Guide on How to Load CSS File Per Role

Question

I'm looking for the simplest solution to allow a custom CSS page to load per role. I have to the CSS pages done, but just need to load them and ensure they are only loaded based on user role.

I'm guessing it should be about three lines of PHP to go at the bottom of the template.php, but not sure what the code should be. Any advice?

Thanks.

---

With relation to the answer and my comment below, tried the beneath code unsuccessfully using the bamboo theme

function bamboo_preprocess_page(&$variables) {
  global $user;

  if (in_array('testtest', $user->roles)) {
    drupal_add_css(drupal_get_path('theme', 'bamboo') . '/roleedits.css');
  }
}

If my code wrong or is it a problem with the theme?

(for the record I did create a role called testtest.)

The error I get is:

Fatal error: Cannot redeclare bamboo_preprocess_page() (previously declared in E:\Test\sites\all\themes\bamboo\template.php:231) in E:\Test\sites\all\themes\bamboo\template.php on line 385

---

NOTE: Both the solution below work. I just accepted the one I used. However both have been tested and work fine, just the second solution offered me more flexibility to call roles again in future.

Answer 1

User slivorezka posted the answer before me, and I'm just adding some of my own amendments.

1. Body classes

First, I think using separate files for this is wrongg. Drupal core comes with a nice feature that it adds "logged-in" class to the body tag if the user is logged in. Similarly, you could use a preprocess function to add a class to the body tag, which lists user role IDs. Then, merge and optimize your CSS to use this class to change the appearance.

function THEMENAME_preprocess_html(&$vars) {
  if (!empty($GLOBALS['user']->roles)) {
    foreach ($GLOBALS['user']->roles as $rid => $role_name) {
      $vars['classes_array'][] = drupal_clean_css_identifier("drupal-role-$rid-$role_name");
    }
  }
}

Copy the above snippet to your theme or to a custom module, and change "THEMENAME" to the name of module/theme.

You will see class names like drupal-role-2-authenticated-user in the body tag, which you can use to change appearance.

2. hook_page_alter() or hook_preprocess_page() (there are other hooks too)

See the this answer.

Answer 2

Add the next code to you template.php

/**
 * Implement hook_preprocess_page().
 */
function THEME_NAME_preprocess_page(&$variables) {
  global $user;

  if (in_array('DESIRED_ROLE', $user->roles)) {
    drupal_add_css(drupal_get_path('theme', 'THEME_NAME') . '/YOUR_CSS_NAME.css');
  }
}