Archived topic
Different Background color per category
3 replies · Started by Stefan on April 18, 2022
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 :-)
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
Wow! It works!
Perfect and thanks a lot for the quick reply
Awesome - glad to hear that!