wordpress multi css

multiple style sheets in wordpress

[roclimb]

I'm new to Wordpress and from what I unerstand I can add multiple css sheets to different pages if I put a conditional statement into the header.php area?
If I have 5 different style sheets here for 5 different unique pages wont this slow my pages down having to access 5 css sheets fom the header.php?

Is there a better way to get multi css sheets to work with different pages?

Thanks

[lorax]

If you modify your header.php file to use if/then/else logic then the processing is done on the server and is pretty quick. The comparison can be done based on page names/id numbers. The disadvantage is that you'll be making HTTP calls for each different CSS file unless you cache them.

A good question to ask is do you really need a different style sheet for the different pages?

[roclimb]

Actually I need different style sheets. Its a really large site with a specific need for them.

So my next idea is: can I put the style sheets into different header files, then call diffrent header files for a few different pages.

For example:
header1.php--has one style sheet
header2.php--has another style sheet.

then just call different headers for the pages I need them for?

thanks for the help.

[rocknbil]

Most people just use one header.
<?php if (is_page('about')) { ?>
<link rel="stylesheet" type="text/css" href="style-two.css">
<?php } else { ?>
<link rel="stylesheet" type="text/css" href="style-one.css">
<?php } ?>

Or . . you can use is_category or other WP functions . . . or . . .

<?php
// at the head of document . . .
$this_style = (is_page('about'))?'style-two.css':'style-one.css';
?>

<link rel="stylesheet" type="text/css" href="<?php echo $this_style; ?>">

Or . . . using your last choice, create separate templates for the two site versions . . . there's lots of ways to go about it.

[lorax]

Don't use different header files if you can avoid it. If the pages are really that different have you thought about creating different templates and just assigning the pages to those templates?

[netmeg]

Yea, I would make custom page templates in this case.

[boplicity]

A good template will set a specific class or id for each page in the body tag. That way, you can use one CSS file, and then style the page according to that class or id. For example, you can do something like:

#home .post { width: 100px; float: left; }

This way, you can make significant layout/style changes without messing with the templates at all.

[roclimb]

Thanks for the help,
these ideas are great. i think I am leaning towards making custom page templates. My only question is this: When I make a custom page template its still going to call <?php get_header(); ?>. So essentially I will be still calling the style.css stheet from that header. So can I do something like <?php get_header.2()
or something like that to get a different header with different css in it.

[milanmk]

Yes you can call different header with following code:

<?php get_header('custom'); ?> and it will load header-custom.php file.

[roclimb]

Thanks everyone for all the help: I tried this and it mostly works but I am not accessing the 2nd stylesheet for some reason.

I called the custom header from a page like this

<?php get_header('header_state'); ?>

It works fine and places the header on the page and I called the css file in this custom header like this:

<link rel="stylesheet" type="text/css" href="<?php bloginfo('template_url'); ?>//localhost:8888/cnb_press/wp-content/themes/cnb-zip1/state_style.css" media="screen" />

but my page is still accessing the index.php style.css for some reason. I am on a MAMP and not live.

Any ideas why I am not getting this right?

[milanmk]

Check your function.php file and any other plugin who might be adding style dynamically.

[rocknbil]

<?php bloginfo('template_url'); ?>//localhost:8888/cnb_press/wp-content/themes/cnb-zip1/state_style.css" media="screen" />

If you echo out template_url, I think you'll find it already contains //localhost:8888/cnb_press/wp-content/themes/cnb-zip1/. (And then, only if you're testing locally, otherwise it will be an http(s) URI.) So try

<?php bloginfo('template_url'); ?>/state_style.css" media="screen" />

May or may not need the slash.

[roclimb]

Thanks I did a rendition of the examples you mentioned and included template path and it works fine now. I now have a separate page with a separate header and css attached.

thanks for the help
cheers