Background image and top bar transparence
-
Hello
I m trying to setup my design with a full screen (cover) background image. I would like to have some elements in the boxed (wrapper) to be transparent (to let show the background) as the top bar. For the top bar I set a WPBakery HTML block with my logo in PNG (also with transparency).
I set the background color of the top bar (using the woodmart header builder) with a alpha of 0 but there is still something making (I except) the whole header with a white background and I can’t figure out what makes this…
Could you please help me ?
Hello,
The issue is caused by the website wrapper background color.
Please Go to Theme Settings >> Styles & Colors >> Pages Background and remove the wrapper background.
Screenshot for Clarification: https://gyazo.com/39b9790226e82c063d92e1dc27f2b4d7
Then check back.
Regards.
Xtemos Studios.
Thank you for your answer. Unfortunately it seems to still not work. I removed all background color (that I previously set to colors with alpha=0) and the background of the top bar remains white.
Hello,
Please try adding the following Custom CSS in the Global Custom CSS area under Theme Settings >> Custom CSS.
.whb-color-dark:not(.whb-with-bg) {
background-color: transparent;
}
Regards.
Xtemos Studios.
It seems it was not enough, the whole header is in a “div” with the class “.website-wrapper” that put from bas.min.css the background to #fff. The only way I found for now is to add the custom CSS :
.website-wrapper {
background-color: transparent !important;
}
will it makes problem for something else ?
Hello,
We are glad that you managed to solve the issue for you.
No, it will not cause a problem. You can keep the CSS.
Let us know if there’s anything else we can do for you! You can always reach us at any time. We are always here to help you.
Have a wonderful day.
Best Regards.
.
