wordpress-tips category image Individual Category Styling

Posted on November 30, 2008 and last modified on May 5th, 2009.

Did you know that you can make your category archives individual in style for each? Take this site as an example. If you take a quick look at the categories here [as listed above in the menu bar] you can see that each archive has it’s own introduction, particular to each on an individual basis. Likewise, the Post Its archive is styled slightly differently, in that it has no category bar underneath each post, as do the other archives.

So, how do we get this result? Well, it is quite simple to be honest. All you need to do is copy your archives.php code into a text editor and then set about making any changes you wish. You can make as many structural and CSS changes as like and is only limited by your imagination. To make each one display differently on your site, you need to save each with a different name. This is the important bit and is controlled by something known as the WordPress Template Hierarchy, which without going into too much detail here, runs something like this [as applied to categories]:

Category Templates:
1. category-id.php – If the category’s ID were 6, WordPress would look for category-6.php
2. category.php
3. archive.php
4. index.php

So, what you need to do with each individually structured/styled category archive is simply name it appropriately, i.e as in the example above: category-id.php

In my instance on this site, the Post Its category is ID:24, so my category archive template is named category-24.php. My Themes category archive is based on it being category ID:14, so it becomes category-14.php and so on.

It is then just a simple matter of uploading your new files into the relevant theme directory and hey presto, you have individually styled category archives on your site.

Related Posts:

No related posts found!

About the author

JamesICT has added 31 posts to this site so far...

Owner/administrator of many sites, including FreshlyPressed.net, James is a website workaholic. Give him a problem to fix and he will not stop until it is completed. Just read his testimonials and it is not hard to see, James is the man when it comes to helping you with your website.

Other posts by JamesICT

Leave a Reply

XHTML: You can use these tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>