Adding Extra Style Sheets in Drupal


During the course of the development of this website I realized that I had a requirement to apply specific styling to individual articles for the purpose of demonstrating CSS examples.

I didn't really want to have to create static html pages for this as it defeats the purpose of using a CMS. Using the existing style sheet of my theme wasn't an option either, apart from bloating this file it wouldn't work very well if I decided to change themes in the future. Nor did I want to simply add an additional style sheet and call it from my page.tpl.php file, as this file could become very large over time. Inline style were not really an option either as this would make it more difficult for people to follow example and make it harder for me to re-use css classes.

What I wanted was to be able to create css style sheets and apply to specific articles. This would overcome the problem of ending up with a very large style sheet. I would also be able to re-use css classes.

By adding the following php snippet to the beginning of my article I am able to easily add additional code to the <head> of my html document. Of course it needs to be modified to reflect the path to my css file and the name of the css file. The input format also needs to be set to PHP.

('<style type="text/css" media="all">@import "/files/css/test.css";</style>')

From time to time I will add some CSS examples not only for my own reference but to hopefully help someone else save a little bit of time re-inventing things.


The CSS_Injector module would seem to be what you're after here - it has a way to make rules on when certain css is added to a page, and does it in a drupal friendly way.

Submitted by Anonymous (not verified) on Fri, 2010-01-29 22:25.