1

Is there a way to add a CSS class to the <body> tag based on the visibility of a particular block on a page?

We have certain blocks that are visible on specific pages. It would be nice to be able to change CSS styles for related content depending on whether they are present.

How can I achieve this?

3

You have to do it via the template_preprocess_html function.

Add this to your theme's template.php file:

function MYTHEME_preprocess_html(&$variables) {
  // dpm($variables);
  $node = menu_get_object();
  if (isset($node) && isset($variables['page']['sidebar_first']['system_navigation'])) {
     $variables['classes_array'][] = 'system-navigation';
  }
}

In the above code I am looking for the system navigation block in the sidebar first region and if it is there I am adding system-navigation class to the classes array. I am also checking if I am on a node page via the call to menu_get_object()

You will have to adapt the code to your use case.

Install the devel module, then uncomment the dpm statement. Then look under the page variable at other variables without a # in front of them.

enter image description here

  • I'm using my own variation of the Commerce Kickstart 2 theme, which already has this function in template.php. I added Devel, enabled it and then added your code to the function commerce_kickstart_theme_preprocess_html() and it does nothing. I expected dpm() to show at least -something-. Did I not 'activate' something? Or does Kickstart work differently than 'normal' Drupal themes? – jchwebdev Aug 24 '14 at 23:46
  • I added your code to the omega theme (which is the parent theme) and it does fire. So why doesn't it fire for the child theme? – jchwebdev Aug 24 '14 at 23:52
  • Preprocess functions run for all themes in the ancestry. I see two possibilities, either you have the wrong theme activated, or when you created your own version of the Commerce Kickstart theme, you did not rename all the functions in the template.php file to start with your name of the theme, and they still start with commerce_kickstart, such as in commerce_kickstart_theme_preprocess_html(&$variables), it should be MYTHMEME_preprocess_html. – J. Reynolds Aug 25 '14 at 4:37
  • Now we're getting somewhere! OK, I added the code you suggested and (according to dpm() ) it adds the class I want to $variables['classes_array'][]. However, this is not being rendered in the body tag. How do I tell why that is not happening? BTW: Is dpm() supposed to slow down the system about 100%? – jchwebdev Aug 25 '14 at 18:15
  • Never mind. It turns out that the Omega theme uses $variables['attributes_array']classes']. Thanks. NOW: If I can figure out how to render an &reg; in an Omega breadcrumb I'll be all set! :D CHEERS! – jchwebdev Aug 25 '14 at 20:49

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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