Wordpress: can this be altered based on user type for CSS?

PHP programming forum. Ask questions or help people concerning PHP code. Don't understand a function? Need help implementing a class? Don't understand a class? Here is where to ask. Remember to do your homework!

Moderator: General Moderators

Post Reply
simonmlewis
DevNet Master
Posts: 4434
Joined: Wed Oct 08, 2008 3:39 pm
Location: United Kingdom
Contact:

Wordpress: can this be altered based on user type for CSS?

Post by simonmlewis »

We are trying to show some CSS only when someone is a) logged in and their usertype is 'wholesaler'.

This function should set the CSS for us, but for all.

The idea is to switch off a 'rotating' price area, and just show the price and wholesale price to wholesaler users.
with it turned on, there is a big gap where the code is setting it to be a fixed height. If I disabled the fixed height, when logged in as wholesaler, the Price below the wholesale title disappears.

Code: Select all

add_action('wp_head', 'add_css_head');
function add_css_head() {
   if ( is_user_logged_in() ) {
   ?>
      <style>

.wholesale_price_container
{
    line-height: 20px;
}

.grve-product-item .grve-product-content {    
    overflow: visible;
    height: 65px;
}
.grve-product-item .hover .grve-product-switcher,
.grve-product-item .grve-product-switcher.product-added {
 -webkit-transform: none;
 -moz-transform:    none;
 -ms-transform:     none;
 -o-transform:      none;
 transform:         none;
}
      </style>
   <?php
   }
}
Love PHP. Love CSS. Love learning new tricks too.
All the best from the United Kingdom.
simonmlewis
DevNet Master
Posts: 4434
Joined: Wed Oct 08, 2008 3:39 pm
Location: United Kingdom
Contact:

Re: Wordpress: can this be altered based on user type for CS

Post by simonmlewis »

As often happens, I found a fix myself.
This CSS will work for any type of user role within Wordpress, and means you can override the CSS based on that role.

I had to double check the user role wording in the database, and use "!important", to override any existing CSS.

Code: Select all

// set wholesale CSS overrides.
// includes setting category pages wholesale price box to disable rollover, while keeping the setting for non-wholesalers
add_action( 'wp_enqueue_scripts', 'set_wholesale_css' );
function set_wholesale_css(){
    if( in_array( 'wholesale_customer', (array) wp_get_current_user()->roles ) ){
        echo '<style>
        .grve-add-to-cart-btn 
        {
        display: none!important;
        }

        .wholesale_price_container
        {
        line-height: 20px!important;
        }

        .grve-product-item .grve-product-content 
        {
        overflow: visible!important;
        height: 65px!important;
        }
        
        .grve-product-item .hover .grve-product-switcher,
        .grve-product-item .grve-product-switcher.product-added {
        -webkit-transform: none!important;
        -moz-transform:    none!important;
        -ms-transform:     none!important;
        -o-transform:      none!important;
        transform:         none!important;
        }
      </style>';
    }
}
Love PHP. Love CSS. Love learning new tricks too.
All the best from the United Kingdom.
User avatar
Vegan
Forum Regular
Posts: 557
Joined: Fri Sep 05, 2008 3:34 pm
Location: Victoria, BC

Re: Wordpress: can this be altered based on user type for CS

Post by Vegan »

I use custom CSS on my gaming site which is supported by the Theme I use

never considered more than that as I prefer to have my site as fast as possible due to the traffic load
Hardcore Games™ Legendary is the Only Way to Play™
Post Reply