Home>Support>Transparent Background

Transparent Background

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].

I am attempting to make the background of rows and widgets transparent.
My knowledge of CSS is quite limited and I cannot make it work using similar solutions that I found on other threads.

First off, Why do the widgets do not have a transparent option to start with?

Anyway, I have a row split in two columns. On the first column I have SiteOrigin-Slider, and on the second I have a SiteOrigin-Call_to_Action. I need to make the row background transparent, and the SiteOrigin-Call_to_Action background transparent.

Inspecting the elements of my page and I can see that I need to make the background-color: (255,255,255, 0.0) for two locations, but I seem not to be able to get the syntax correct or I do not know how to use the CSS Styles in the widgets.

What I tried to do is add this on the CSS Style box in de row widget:

aside#siteorigin-panels-builder-3.widget_siteorigin-panels-builder.well {
background-color (255,255,255, 0.1);
}

And I tried to add this for the SiteOrigin-Call_to_Action:

.so-widget-sow-cta-default-d8b5b01c468c .sow-cta-base {
background-color (255,255,255, 0.1);
}

Neither worked. I have tried adding “!important” on the end as well, with no results.

This is our free support forum. Replies can take several days. If you need fast email support, please purchase a SiteOrigin Premium license.

Get The Most Out of SiteOrigin with SiteOrigin Premium

Find Out More