Hello everyone!

I'm working with a small group of people to develop a news web site in Drupal. I've created page-front.tpl.php so that the front page will look different from the other inside story pages (page.tpl.php). I was wondering if there is a way to link page-front.tpl.php to a different css stylesheet than the default style.css.

Can anyone advise on how I'd do this?

Thanks in advance!

- Darin

Comments

matkeane’s picture

Depending on how different your front page layout is from the rest of the site, you could just add a class="front" to your body tag and use that to create CSS style rules that only affect that page.

If you want to avoid loading a lot of CSS rules that aren't needed for the front page, you can unset a CSS file from within your theme's template.php file and define another CSS file to load in place. Can't find an example of the code off-hand, but I'm pretty sure that the Hunchbaque theme is one that does this.

notarealperson’s picture

I would go with the former suggestion if I were you - add a new #front body class and then put the new rules under #front.

matkeane’s picture

Yeah, I generally end up going that route as, most of the time, there are a lot of shared styles between the front page and the rest of the site. Also, that way, I can turn on CSS aggregation and serve everything up in one hit. I've never tried measuring the performance gain of that versus a trimmed down CSS file specific to the front-page.

For some reason though - maybe because I might end up with several pages with the same body class - I tend to go with a .class, rather than an #id but, since a page can only have one body, I guess that's just splitting hairs!

totocol’s picture

Hi,

Do I need to define the page-front.tpl.php somewhere for it to be found before finding page.tpl.php? (I'm a newbie so not sure about these details). I have just created a new file identical page.tpl.php but called page-front.tpl.php and then erased all the sections of code that were referring to the content section. Am I missing something?

thanks a lot

matkeane’s picture

Nope, that's it - duplicate the page.tpl.php, rename to page-front.tpl.php, then modify as desired. Drupal should automatically find the new template - unless you're using a theme which defines which template file to use in its template.php code, and I don't think the base themes do this.

totocol’s picture

Thanks,

How could I check if the template.php code defines that?. Any idea of what the code could look like?. It does not seem to read that template first.

Thanks again

totocol’s picture

Just checking if someone can provide some input on this?

Thanks

matkeane’s picture

Hi,

I can't find an example of a theme doing this right now, but this handbook page shows how you can modify the tpl.php template file to use in the theme's template.php code: http://drupal.org/node/249726

But, unless you theme is doing something like that, you should just be able to rename page.tpl.php to page-front.tpl.php and Drupal will find it.

One gotcha a colleague experienced was an extra file extension when Windows helpfully(?) hid recognized file extensions. When the file was renamed, it ended up as 'page-front.tpl.php.php' and Drupal ignored it.