Please help. Anyone knows of the proper way how to change the background color for a custom post type template only? Using chrome's inspect, I saw that my theme uses the ID of "#main" for all the page's background color so if I try changing it, all pages got affected. Just looking for a way on how only the CPT template will get affected. If it helps, below is a snapshot of the theme.

New attachment

2 Answers 2


You can use the body's classes :

body.single-artist #main{

Collapse the <div id="main">. I hope that you have <article> tag which id and class attributes like below

<article id="post-212" class="post-212 post type-post status-publish format-video has-post-thumbnail hentry category-resources post_format-post-format-video active">

Inside the class attribute you can find the post type as type-post, so you can write css for post.type-post if you have used <article id="post-<?php the_ID(); ?>" <?php post_class(); ?>> like this in your custom post type template and your custom post type name is article for example, then you have a class called type-article inside the class attribute of <article> tag.

Also you can add you own class by <article id="post-<?php the_ID(); ?>" <?php post_class('my-custom-post-type-name'); ?>>

  • Thanks!! I was able to get the post type class and change its background color temporarily to #CCC (you can see that on the updated screenshot above). However, it still shows a left and right white background which is controlled by the div id "main". How can I make its background color changed only for my CPT Template?
    – Alex M
    Commented Jun 16, 2016 at 15:33

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.