Using different style sheets for different templates

June 3, 2007 – 8:24 am | by

I’m creating a site where the pages are divided into two sections: Hebrew and English. I need the Hebrew pages to use a template that basically looks the same as the English pages, but everything is switched around to right-to-left.

I created a copy of the style sheet and called it style-hebrew.css. In the copy, I made all the relevant changes so that everything is flipped around, which basically meant writing direction: rtl in a bunch of places, and floating things to the right instead of left, and vice versa. But now I needed a way to call this style sheet on the Hebrew pages.

First, I created a page template called hebrew-page.php. In this template, I replaced

<?php get_header(); ?>

with

<?php include ('header-hebrew.php'); ?>

Then I copied the header.php file and renamed it header-hebrew.php. In this file, I replaced the usual call to the style sheet:

<link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); ?>" type="text/css" media="screen" />

with the call to my new Hebrew style sheet:

<link rel="stylesheet" href="<?php bloginfo('template_directory'); ?>/style-hebrew.css" type="text/css" media="screen" />

Now, in the admin, whenever a Hebrew page is created, they just have to make sure to select the Hebrew Page template from the Page Template drop-down menu on the right-hand panel.

This method can be used for any site that needs to call different styles for different pages or categories. Just create another style sheet and header.php files, and call them in the appropriate places.

There may be a more efficient way to do this, but I have yet to discover it.

[Slashdot] [Digg] [Reddit] [del.icio.us] [Facebook] [Technorati] [Google] [StumbleUpon]

  1. 13 Responses to “Using different style sheets for different templates”

  2. By PB on Apr 7, 2008 | Reply

    Great job! Simple…and it works. I wanted to call a different header on some custom pages and googling for a solution returned nothing but complex instructions and php hacks that did not apply. Glad I found this.

  3. By René Kragh Pedersen on Aug 8, 2008 | Reply

    Short, to the point, and it works.
    Thank you very much.

  4. By Andrew on Aug 23, 2008 | Reply

    You rock, thanks for the tip.  Works great.  Thanks once more.

  5. By daniel on Sep 3, 2008 | Reply

    can you tell me how to convert templates into hebrew ones?
    direction: rtl; not always work
    and the menues are still left to right

    thanks

  6. By Brillant Solution on Nov 6, 2008 | Reply

    A brilliant solution!!! Simple and easy to work out. I can’t thank you enough. I need a stylesheet to override a column wrapper with a wider center class and no right side toolbar. I couldn’t work this out because the stylesheet was called on the header, not the page. Your solution to call a different header file with a different stylesheet is brilliant. After hours of searching. . .on Google and the Wordpress forums all the posts had me changing code and working with JavaScript. You should post this on the Wordpress forum.

    Thanks again

  7. By Miriam Schwab on Nov 7, 2008 | Reply

    @Brillant Solution: I’m so glad this tip helped you. Thanks for the thanks!

  8. By zach on Dec 21, 2008 | Reply

    Ah, I’ve been looking all over for this solution.  Its so easy! 
    Thanks a million!  I’m surprised this is nowhere on the wordpress codex *(as far as I could find), seeing as it is such an important function.

    Cheers
    Zach

  9. By Nini on Mar 13, 2009 | Reply

    Ditto all the above – Thanks so much! You saved the day

  10. By Matt on Apr 9, 2009 | Reply

    Brilliant!  This is just what I needed! 

    Thanks for posting this.

    -Matt

  11. By Jaidev on Aug 25, 2009 | Reply

    Nice.
    One simplification:
    instead of changing
    <?php get_header(); ?>
    with
    <?php include ('header-hebrew.php'); ?>
    You could simply call get_header with 'hebrew' as a string parameter:
    <?php get_header('hebrew'); ?>
    and header-hebrew.php would be used instead of header.php.
    see: http://codex.wordpress.org/Function_Reference/get_header
     

  12. By SistahHollywood on Nov 1, 2009 | Reply

    AWESOME! I’m using your solution to customize a client’s categories  … every other solution I tried was soooooo messy. This is simple and to the point.
    I’m not savvy in php but will attempt to use this to include child-categories for a parent category.
    Thanks again!

  13. By Jessie Kwak on Jan 31, 2010 | Reply

    I’ve been searching for hours, and your simple piece of code was the brilliant solution i was looking for.  Cheers!

  14. By Justin Sternberg on Mar 15, 2010 | Reply

    Can i use this same function to call the original css style sheet first, and then the secondary style sheet, since the secondary only includes mods to the first?  Make sense?

Post a Comment

Studio Press Premium Themes