I'm trying to create a CSS class called .bg-unit-color which will change depending on the taxonomy reference chosen

I've set up a course category taxonomy and then set up a color field within it using jQuery Colorpicker module. I've got to the point where I can render the color in my node--example.tpl.php file with the following:

$term=taxonomy_term_load($node->field_example_category['und'][0]['tid']); $category_color=field_view_field('taxonomy_term',$term,'field_example_category_color'); echo render($category_color); ?>

I've also used the drupal_add_css function in my template.php file, so this works:

$new_color='black'; drupal_add_css(".bg-unit-color {background-color: $new_color;}", 'inline');

However I can't marry the two together to create what I'd like to do which is this:

drupal_add_css(".bg-unit-color {background-color: $category_color;}", 'inline');

Any help would be massively appreciated. Thanks in advance

  • Can you provide a little more context on what you tried in the last example? What happened when you tried to do what you really want? Including the entire hook you wrote (or at least all the code for this part and the hook name) in template.php would be helpful.
    – acrosman
    May 6, 2016 at 20:54
  • If I include all of the following in my template file, I just get the white screen of death. $term=taxonomy_term_load($node->field_example_category['und'][0]['tid']); $category_color=field_view_field('taxonomy_term',$term,'field_example_category_color'); drupal_add_css(".bg-unit-color {background-color: $new_color;}", 'inline');
    – Rick
    May 6, 2016 at 21:43
  • Also, I'm using jQuery Color picker for the color field
    – Rick
    May 6, 2016 at 21:48
  • Are you putting the code into a function or just directly into you template.php file?
    – acrosman
    May 8, 2016 at 21:45
  • @acrosman I was putting it directly into the template.php file. I've since been told I should be putting it into a function like <?php function mytheme_preprocess_node(&$variables) { } so that's my next step. Although I haven't quite got there yet
    – Rick
    May 17, 2016 at 14:30

2 Answers 2


If using render you should attach the css to that render array.

$term = taxonomy_term_load($node->field_example_category['und'][0]['tid']);
$category_color = field_view_field('taxonomy_term',$term,'field_example_category_color');
$name = $term->name;
$category_color['#attached']['css'][] = array(
  'data' => ".bg-unit-color {background-color: $name;}", 
  'type' => 'inline',
  • Thanks for your answer Mikey. I can't get this to work though. The problem seems to be that the following code $term = taxonomy_term_load($node->field_example_category['und'][0]['tid']); $category_color = field_view_field('taxonomy_term',$term,'field_example_category_color'); causes a white screen of death when I put this in my template.php file
    – Rick
    May 7, 2016 at 6:39
  • @Rick I got that code directly from your question so I'm not sure what to tell you.
    – mikeytown2
    May 7, 2016 at 18:02
  • I think the issue was that I need to put the code in a function like <?php function mytheme_preprocess_node(&$variables) { } ...wasn't doing that before
    – Rick
    May 17, 2016 at 14:31

To update the classes on a node based on a field value you can use template_preprocess_node(). I would put my CSS into a file, have the file attached to all pages via the theme, and then set a class on the node's wrapping div:

function mytheme_preprocess_node(&$vars) {
  if($vars['node']->type == 'my_content_type') {
    $category_color=field_view_field('taxonomy_term',$term, 'field_example_category_color');
    $vars['classes_array'][] = drupal_html_class($category_color);

A non-code solution would be to use the Field Formatter CSS Class module.

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.