Custom Post Background Colour

Hello,

I have another stupid question for you all.

I know how to change my blog posts background colour independently of the rest of the site, but I’m not sure what the code should be for changing the background colour of a custom posts setting?

I want posts such as this - http://paulmacklin.co.uk/travel_blog/north-italy/ - to have a white background.

Hi Paul,

Thank you for reaching out. You can first find out the class name of your custom post by inspecting the page source and in the <body> tag you can get the class name (see screenshot)

Then using the class of your custom post you can remove it’s background image and change the background color to white by simply adding the following code in the Theme Options > CSS:

.single-travel_blog .backstretch > img {
    display: none;
}
.single-travel_blog {
    background: #fff;
}

Here are some related links for further reading, this could help you in finding and implementing some CSS fixes:

Don’t forget to clear all caches including your browser’s cache after adding the code. Let us know how this goes!

Hi Nabeel,

This obviously works for the blog posts, but when I attempt this on the travel blog pages it says the class name in the body tag is “ember application”, and when I use that class it affects the home page too. Any ideas?

Hello Paul,

Can you please share your travel blog page? The given code will only work for single travel blog custom post type. If you can give us the url of where we can change the page or what you are trying to edit at the moment, then maybe we can tweak the code.

Regards.

Hey RueNel,

Well, I’m trying to change the appearance of travel blogs in general, so everything that sits under http://paulmacklin.co.uk/travel-writing/ essentially, including the places taxonomies and posts.

P

I think I was just being an idiot - I was inspecting the page inside Cornerstone, and so I was getting that feedback through the body class. Let me try again.

Hello Paul,

You can use this custom css:

.single-travel_blog .backstretch > img {
    display: none !important;
}

.single-travel_blog {
    background: #fff;
}

This will force to make the background color visible.

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.