Snippet: node type specific CSS files
I just wrote a fun little bit of code for answering a question on our Danish Drupal community site.
The user in question wanted to add different CSS-files, depending on the type of the node used as the main page content, and I just wanted to share a little bit of code demonstrating how much can be a achieved very easily with Drupal's very flexible theming system. So with no further ado, here it is:
And in the example here, "_craftmen_" is the name of the theme (the one used on Reveal IT, actually), and "_side_" is the node type (it means "page" in Danish.).
-
Or a simple module...
[HTML_REMOVED]
function node_specific_css_nodeapi(&$node, $op, $a3 = NULL, $a4 = NULL) { if ($op == 'view') { $css = path_to_theme() .'/node-'. $node->type .'.css'; if (file_exists($css)) { drupal_add_css($css, 'theme'); } } }
?>
This will sit in a module called "node_specific_css". It will wait for a node to be viewed (full or teaser... you might want to tweak teaser nodes too?). It then looks in the current theme's folder for a file matching the format [HTML_REMOVED]node-{type}.css[HTML_REMOVED], for example [HTML_REMOVED][HTML_REMOVED]node-blog.css[HTML_REMOVED][HTML_REMOVED].
With this method, you dont have to edit code everytime you want CSS for a new CCK type, just drop in a new CSS file into your theme folder and it will get added.
[HTML_REMOVED]Note: I haven't tested this - but in theory it should work... I think![HTML_REMOVED]
-
Panels2 + css?
I use panels2.. and I want to use a different css file for a specific page..
Can i achieve this with this code?
I think I could but then all the node-types of type webform would be styled by that css file?
-
I think I could but then
I think I could but then all the node-types of type webform would be styled by that css file?
You are correct. Node type specific CSS would apply to all node of that kind. However, Panels should have it own theming hooks that you could use.
Try checking out the Theme developer module, that should be helpful in figuring out what hooks or template files to override.
-
yes I’m learning step by
yes I'm learning step by step.. I figured out can can just do the job in panels bij using css IDs....
Now I also wanted to theme a specific view (view module) and I have overridden the generic tpl.php file... but now I'm stuck at the css.. I want to theme the output.. give the rows a specific height.. but it seems the tpl.php file uses variables for the use of classes..
i calls other tpl.php file for the fields then it seems to call another one for the output...
but how can I use this to theme? when I don't even know the class