Custom header image for categories

sajcoppe · March 2017

Hi BeTheme,

I have a question regarding the header image. I've been trying all weekend but I can't figure out how to do it. I hope you can help. The website I'm making is visible on http://185.104.29.62/~labassistent/.

When you check the category 'parts & supplies' (http://185.104.29.62/~labassistent/product-category/parts-and-supplies/), it shows a category. This page shows the standard header image that I set in the options. I would like to 'overwrite' this per category so that I can set a different header image per category.

I have seen in the code that every page has a different body class, so I should be able to use this to change the image via css? Do you have a clue what I have to put in my custom css to get this to work?

Thanks in advance,

Greetings, Sander

Bryan · March 2017

Hi,

Use this css

.term-parts-and-supplies body:not(.template-slider) #Header_wrapper {
    background-image: url(http://185.104.29.62/~labassistent/wp-content/uploads/2016/10/Untitled-2.png); }

Change the image url,
thanks

omino · August 2017

Hello,

I have a similar issue to this one and have tried using the custom css provided (modified for my own site). However, the header image refuses to update.

My Body Tag:

Custom CSS Tags I tried:

.category-late-night-miami body:not(.template-slider) #Header_wrapper {

background-image: url(/wp-content/uploads/2017/07/20170725_dm_default_header.png) !important; }

.category-61 body:not(.template-slider) #Header_wrapper {

background-image: url(/wp-content/uploads/2017/07/20170725_dm_default_header.png) !important; }

When I remove the category class selector(s), the following css does work. However this makes an unwanted site-wide header change:

body:not(.template-slider) #Header_wrapper {

background-image: url(/wp-content/uploads/2017/07/20170725_dm_default_header.png) !important; }

Please advise.

Bryan · September 2017

Hi,

can you try this css first?

body.category-late-night-miami #Header_wrapper {
    background-image: url(/wp-content/uploads/2017/07/20170725_dm_default_header.png) !important; 
}

omino · September 2017

Yes, thank you, that worked!

Custom header image for categories

Comments

This website uses cookies