4

I'm looking to apply custom CSS in the admin only for a certain user role, "Contributor" to be exact.

Everything I try either seems to have no effect, or produces a 500 error.

What I've tried has in the main been loosely based around this:

add_action('admin_head', 'custom_admin_css');

function custom_admin_css( ){

global $user;

if (isset($user->roles)  && is_array( $user->roles ) ) {

    if( $user->roles[0] == 'administrator' ) {
        //Do something
    } elseif ( $user->roles[0] == 'editor' ) {
        //Do something
    } elseif ( $user->roles[0] == 'contributor') {
        echo '<style> CSS </style>';
    } else {
        //Do something
    }
}
}
6
  • Can you edit your question ( using the link above ) to add in what you've tried so far?
    – Howdy_McGee
    Nov 7, 2016 at 15:38
  • 1
  • 1
    @CalvT Ok, I'll rememnber that for the next time.
    – JHoffmann
    Nov 7, 2016 at 16:24
  • 1
    With the answer from that question you can output the user role to the body class. This way you dont have to output the CSS rules conditionally. Instead you target the user role with rules like this: .role-editor #targetElement { display:none }
    – JHoffmann
    Nov 7, 2016 at 16:39
  • 1
    @JHoffmann That's a good suggestion to add the role to the body class, please add that as an answer
    – birgire
    Nov 7, 2016 at 16:44

2 Answers 2

14

Upon request I will write an answer using a function from a suggested answer for the similar question: How to target with css, admin elements according to user role level?.

This function will output classes to the body element for all roles of the current user in the form role-XXXXX

function wpa66834_role_admin_body_class( $classes ) {
    global $current_user;
    foreach( $current_user->roles as $role )
        $classes .= ' role-' . $role;
    return trim( $classes );
}
add_filter( 'admin_body_class', 'wpa66834_role_admin_body_class' );

Now the roles can be targeted with css rules like:

#targetElement { 
    display: none; 
}
.role-editor #targetElement { 
    display: visible; 
}

These CSS rules don't have to be output conditionally. They can be placed for example in any CSS file which is included via admin_enqueue_scripts action:

function wp245372_admin_enqueue_scripts() {
    wp_enqueue_style( 'my-admin-css', 'path/to/file.css', array(), 0.1);
}
add_action( 'admin_enqueue_scripts', 'wp245372_admin_enqueue_scripts' );
2

Try this:

function wpse245372_admin_user_css() {
    $user = wp_get_current_user();
    if ( in_array( 'administrator', (array) $user->roles ) ) {
       // Your Admin Stuff
    } elseif ( in_array( 'editor', (array) $user->roles ) ) {
       // Your Editor Stuff
    } elseif ( in_array( 'contributor', (array) $user->roles ) ) {
       echo '<style> CSS </style>';
    } else {
       // What Everyone Else Gets
    }
}
add_action( 'admin_head', 'wpse245372_admin_user_css' );
3
  • Adding this to my functions.php causes my admin to turn into a blank page (basically no html, white page)
    – CalvT
    Nov 7, 2016 at 16:31
  • go to your wordpress installation, in the root you will find wp-config.php file. open it in your editor and search for wp_debug, and turn it to "true" you will see the error. please copy the error and paste it here. Nov 7, 2016 at 16:41
  • @CalvT you should consider developing in a way that you can display or log the errors. See e.g. debugging in WordPress in the Codex. There was a PHP error in the above snippet, that I fixed. Note there's also the wp_add_inline_style()
    – birgire
    Nov 7, 2016 at 16:42

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.