[Resolved] Change opacity within Page Header

[Edwin]

Hi Tom

How to have opacity within Page Header > Content > Background Color. Instead of a fully transparent header, merged with the navigation, I’m trying to achieve 85% opacity.

I also tried the opacity within Customize > Colors > Header but that did not change it.

This is working, but when i resize the screen the background is not staying in place

.site-header {
background-color: rgba(38, 38, 38, 0.94) !important;
color: #3a3a3a;
}

Thanks

Edwin

[Leo]

Hi there,

Not sure what you mean?

The page header content right now is from slider.

If you are talking about the navigation, you can change it in Page Headers > Advanced.

Make sure you are using the latest version of GPP.

[Tom]

The background color option in the Page Header settings should have a transparency slider.

[Edwin]

Hi Tom

I tried that, but not working for me. I am trying to archive for the top-header merged with Revolution slider:

background: rgba(15,18,21,0.83);

Thanks

[Tom]

And you have these options set?: https://www.screencast.com/t/WENelJDpM

[Edwin]

Hi Tom

Yes, i have

[Tom]

Ah, just looked into this. The overlay sits behind the Page Header content – not on top of it. Since your slider is Page Header content, it sits on top of the overlay (as it should).

You would need to apply an overlay to the actual slides.

[Edwin]

I didn’t think about that. So easy 🙂

Thanks Tom

[Tom]

You’re welcome 🙂

[Author]

Posts