Change color sticky header

Hi!

I choose to use the overlap header for a transparant effect. On scroll a sticky header with a grey background appears, that’s how I want it. However, i want to change the background color of these sticky header to this color: #92967c. How can i do that? When I change the background color in the header settings, the transparent effect is gone. I tried custom CSS but it did not work.

https://studio-eilandstijl.nl/hotelam/home-3/

}
body .whb-sticked .whb-general-header {
background-color:#92967c;
}

[Luke Nielsen]

Hello,

Please use the custom below instead:

body .xts-sticked .xts-general-header {
background-color:#92967c;
}

Kind Regards

• This reply was modified 5 days, 2 hours ago by Luke Nielsen.

Yes, thanks! Looks great.

Another question: I also want to change the background color of the mobile bottom navigation. Background color #92967c and the text and icon #F3F4EA. I found some custom CSS for the woodmart theme but that one didn’t work for the Mars theme.

Try to use the following code snippet

.xts-sticky-navbar {
 background-color: #92967c;
}

.xts-sticky-navbar a {
 color: #F3F4EA;
}

.xts-sticky-navbar a:hover {
 color: #FFFFFF;
}

.xts-cart-count span {
 display: none;
}

[Author]

Posts