[Resolved] Different Background color per category

Home Forums Support [Resolved] Different Background color per category

Home Forums Support Different Background color per category

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #2192112
    Stefan

    Hello,

    I would like to have a custom background color for blog articles of a special category.
    For the archive page this CSS works.

    .archive.category-XX {
    background-color: #61c1c9;
    }

    I have tried this but it does not work.

    .post.category-xxx {
    background-color: #61c1c9;
    }

    Do you have any idea that how I set this up for the articles?

    Thanks in advance!

    … – and happy easter 🙂

    #2192132
    David
    Staff
    Customer Support

    Hi there,

    1. Add this PHP Snippet to your site:

    add_filter( 'body_class', function( $classes ) {
        if ( is_single() ) {
            global $post;
    
            foreach( ( get_the_category( $post->ID ) ) as $category ) {
                $classes[] = 'cat-' . $category->category_nicename;
            }
        }
    
        return $classes;
    } );

    This will add a class of cat-slug to your single post body tag.

    2. Then you can use this CSS:

    .single.cat-slug {
        /* your css styles here */
    }

    Change the slug to match your category term

    #2192139
    Stefan

    Wow! It works!

    Perfect and thanks a lot for the quick reply

    #2192144
    David
    Staff
    Customer Support

    Awesome – glad to hear that!

Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.