Notice: This thread is over two years old; the information may be outdated. Please consider creating a new thread if you require free support. If you have an active SiteOrigin Premium license, you can email our premium support desk at [email protected].
Hi, I’m currently using the North Theme, and I’d like to make the menu bar semi-transparent. I saw a few other threads about this, and I was able to use rgba to make a widget background transparent. Following the Custom CSS advice from this thread, I couldnt seem to keep the regular menu bar opaque while making the sticky version trasnparent. Any thoughts? Here’s my site. Thanks.
Hi Miles,
To clarify, that other thread is for Vantage. The CSS Andrew replied with for the header should have worked however.
If you navigate to WP AdminAppearanceCustom CSS, you’ll get our custom CSS editor. Please add the following CSS:
#masthead.site-header { background: rgba(0, 0, 0, .5);}For the navigation, please use:
.main-navigation { background: rgba(0, 0, 0, .5);}Or use the following if you wish to remove the background color for the navigation altogether.
.main-navigation { background: none;}Please note that lower is less visible and higher is more visible.
You might also need to install the SiteOrigin CSS Editor.
Thanks Alex! This worked perfectly. Also, thanks for recommending the SiteOrigin CSS Editor. It’s much more robust than Simple Custom CSS, which I was using before.
Hello!
Thanks Alex for those instructions, but I was wondering did I do something wrong because it is not working on my site….when i inspect the page, it says “Invalid property value” next to my selector below.
#masthead.site-header {
background: (0, 0, 0, .5);
}
Hi Utopia,
No, I did. :( I omitted rgba.
I’ve updated my previous post with the following CSS:
#masthead.site-header { background: rgba(0, 0, 0, .5); }Thank you for your reply! That totally works now! :)