Drupal 7; How to assign custom CSS and JS by node

CSS, Drupal, Javascript, jQuery

If you need to have custom CSS or JS for a node, it is easy to set up.   This can be setup via the template.php file.   To customize available CSS or JS via template.php, modify the THEME_preprocess_node.  For example, if you have a special node type called “directory” in a theme called “boulder,” add the following code to your boulder_preprocess_node function.



  function boulder_preprocess_node(&$variables) {
    if ($variables['view_mode'] == 'full') {
      $node =& $variables['node'];
      if ($node->type == 'directory') {
        $path = drupal_get_path('theme', 'boulder');
        drupal_add_css($path . '/CSS/directory.css');
        drupal_add_js($path . '/js/directory.js', 
            array('type' => 'file', 'scope' => 'header'));
      }
    }
  }

I love this. It’s quick, easy and very useful.

Leave a Reply