[resolved] Different CSS Based on Category (4 posts)

  1. noelgreen
    Posted 8 years ago #

    I'm wondering how to make a title of a post have different CSS based on what category it's in... or, better yet, if it's a sub-category or not.

    So, I have a post.
    Title: This Post
    Category: Main Cat

    This post would have an orange title using a serif font.

    Then I have a second post.
    Title: Second Post
    Category: Sub-Cat

    Sub-Cat is a sub-category of "Main Cat". "Main Cat" is its parent category in other words. So, "Second Post" would have a green title in a sans-serif font.

    Is this fairly easy to do?

  2. Adam Brown
    Posted 8 years ago #

    Sure. Suppose that your template wraps each post in something like this:

    <div class="post">

    Try something like this:

    <div class="post <?php
    foreach((get_the_category()) as $cat) {
    echo $cat->cat_name . ' ';
    } ?>">

    That will insert each category name as a class. Note that it must be within the loop.

    More info:


  3. Kafkaesqui

    Posted 8 years ago #

    You can also test for category with the in_category() tag:


  4. noelgreen
    Posted 8 years ago #

    Thanks guys!

Topic Closed

This topic has been closed to new replies.

About this Topic