WordPress Categories: Alternate CSS Stylesheets

When you use WordPress to build a site and not simply a blog, you often need to have different styling for posts belonging to specific categories. For example you may want to use different color themes for category specific posts, thus you will need to use different images, different background colors and different font colors. All you have to do is make the stylesheets needed for your color themes and then it is very easy to have specific stylesheets used in category specific posts. What you need to do is modify your header.php and use the following code.

<link rel="stylesheet" href="http://www.sitename.com/wp-content/themes/default/style.css" type="text/css" media="screen" />
<?php if (in_category('1') ):
?>
<link rel="stylesheet" href="http://www.sitename.com/wp-content/themes/default/css/news.css" type="text/css" media="screen" />
<?php elseif (in_category('2') ):
?>
<link rel="stylesheet" href="http://www.sitename.com/wp-content/themes/default/css/services.css" type="text/css" media="screen" />
<?php elseif (in_category('3') ):
?>
<link rel="stylesheet" href="http://www.sitename.com/wp-content/themes/default/css/partners.css" type="text/css" media="screen" />
<?php endif;  ?>

Explanation: We begin by attaching the main css stylesheet that will apply to the whole site. Then we start adding conditional statements and stating that if the post is for example in category with id 1 (e.g. category News) then the stylesheet news will apply to it (additionally to the main style.css but overriding it where we want it to). We continue by stating the other stylesheets we want attached to the other category specific posts.

Tags: , , ,

Author:

2 Responses to “WordPress Categories: Alternate CSS Stylesheets”

  1. cna training says:

    nice post. thanks.

  2. Valentina says:

    Thanks a lot! This is the first method that works for me :) !

Leave a Comment