Single Post Subheader Image Override

TeeDev · February 2017

There is an option to override the header background image within a post.I'm looking for a way to do this with the subheader background image. I would like to be able to set it per blog category, but if not I am happy to set it within each post if possible.

Is this possible?

Albert · February 2017

Hi,

we do not have an option to overwrite subheader background for each post but you can use custom css to overwrite subheader background for all posts:

.single-post #Subheader { background: url('path-to-background') !important; }

TeeDev · February 2017

Thanks for this, I worked out how to get what I wanted.

I needed to have the subheader of a category archive and all the posts within it have custom background images. Here is what I added to CSS:

/* Define custom Subheader for Services section and posts */
.category-6 #Subheader, .postid-187 #Subheader, .postid-155 #Subheader, .postid-146 #Subheader, .postid-130 #Subheader, .postid-178 #Subheader {background-image: url(http://example.com/wp-content/uploads/2017/02/services.jpg);}

/* Define custom Subheader for Portfolio section and posts */
.category-7 #Subheader, .postid-195 #Subheader, .postid-198 #Subheader, .postid-231 #Subheader, .postid-229 #Subheader, .postid-225 #Subheader {
background-image: url(http://example.com/wp-content/uploads/2017/02/portfolio.jpg);}

/* Define custom Subheader for bbPress forum section */
.bbpress #Subheader {background-image: url(http://example.com/wp-content/uploads/2017/02/forum.jpg);}

Sorry, I couldn't find the information on how to paste code. I tried `backticks` but that didn't work.

Albert · February 2017

Each css need to be put under Theme options > Custom CSS & JS > Custom CSS section.

Single Post Subheader Image Override

Comments