Hi,
How can I reduce the opacity of the page background? I found a thread about doing it for the menu, maybe it is as easy as this?
Page background opacity
This is our free support forum. Replies can take several days. If you need fast email support, please purchase a SiteOrigin Premium license.
So I found out that adding following lines to the custom-css makes the whole page area transparent. But also the content. Where or how can I specify the command for only the background?
#main {
zoom: 1;
opacity: 0.1;
}
Hi Andre. Using RGBA is the way to go here:
/* Vantage Boxed Layout Set Page Opacity */ #main { background: rgba(200, 54, 54, 0.5); padding: 35px; }Insert the above into Appearance > Custom CSS and change the first three numbers to your RGB values and then change 0.5 to whatever opacity you want.
Thank you for the fast reply!
I did as you said but nothing changed. I can’t even change the color using this.. Is it possible that some parts of the CSS are blocked for the custom-css?
I created a transparent image as background. Effect is that the selected page color is behind the transparent image instead of the overall background. Is it possible to remove the page-background color attribute?
Not that I know of. Setting the opacity of the main container, the method your originally tried has the issue of also changing the opacity of all the elements in that container. So the next solution is the one I sent through.
With regards to your first reply, you can change the color of the Custom CSS I sent. 200, 54, 54 is the color value and 0.5 is the opacity. Using Photoshop or a color tool you can get the RGB color value. Alternatively send me the color and a link to your site and I’ll check it out.
This is the site: http://www.mankindsdead.com/news/
The background is plain white (#ffffff), I put this in the custom-css:
#main {
background: rgba(255, 255, 255, 0.5);
padding: 35px;
}
Try this:
/* Vantage Boxed Layout Set Page Opacity */ #main { background: rgba(255, 255, 255, 0.5) !important; padding: 35px; }works perfectly, thanks a lot!
Super, glad we could help.
how could one fake the effect of the page opacity showing the background image with slight blur.
Hi Andy
If you start your own thread, we’ll help you there.
https://siteorigin.com/new-thread/
Hi,
I’m not on premium, since I’m out of money. But the shortcode works well, But (!!!!) the header area is not transparent.
Only the background below the menu, not the header-menu area.
How to work that out?
Found solution:
https://siteorigin.com/thread/transparent-menu-bar-background-body-visible/
Hi immsdk
Glad to hear you found a solution.
Please open a fresh thread for any future questions and we’ll jump in there: https://siteorigin.com/new-thread/.