Alternate Background Color to Transparent

[willowillos]

I have been playing around with this with no avail. I am trying to get the alternate background color to be transparent. Every time I set it in Title/Breadcrumb section it defaults to white. I have added custom CSS to show the background as white for this class alternate-color. Still, nothing works. If I use the main theme option and set it to transparent it does work.

[Laura]

Hello, so do you want to change the breadcrumb section background or all alternate colors of the theme?
Let me know i will be happy to help 🙂

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

Laura Solanes - Graphic Designer and Web Designer

Please be patient as I try to answer each topic as fast as i can.

If you like the theme or the support you've received please consider leaving us a review on Themeforest!

Always happy to help you 🙂

[willowillos]

I would like the change the alternate colors of the theme.

[Laura]

Hello, will assign the ticket to a higher support level who can help and advise you in your query.
Thanks! ?

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

Laura Solanes - Graphic Designer and Web Designer

Please be patient as I try to answer each topic as fast as i can.

If you like the theme or the support you've received please consider leaving us a review on Themeforest!

Always happy to help you 🙂

[Radu]

Hi,

Make sure to have latest theme version and the theme recommended plugins updated!

Normally from here you can change the breadcrumb section : wp-admin -> theme options -> styling options ->

To providing a CSS selector for customizing “manually” the breadcrumb area I need to see the breadcrumbs on your site but I cannot see it, where I can see that? provide a screenshot that shows that

Cheers
R.

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

What support service includes ? What not ?

[willowillos]

I already have that selection in my Title Section(Alternate) section (see capture). It is set to transparent but defaulting to white. I have the breadcrumb/title area turned off on all pages I will create a new page that leaves this on to show you what I mean. I am using the Alternate Background for Row Settings in Visual Composer (see capture2).

test page with the title bar (https://usenergytour.com/past-events/test-page/)

For the test page Title Bar is set to Transparent for Background color and alternate background color. But it still shows up as white. I have also added custom CSS to the class alternate-color, (see capture3). If I change the color of the title bar to say blue, the color does change.

I had this working with the main style, the background elements that I wanted to be transparent were and I was able to get the effect that I wanted. I had to switch this around when I realized the Blog portion of the site was showing up with all transparent backgrounds.

Attachments:

You must be logged in to view attached files.

[Radu]

Hi,

Background of the main color or alternate color can be changed using next CSS

COPY CODE

.alternate-color {
    background: green;
}

.main-color {
    background: transparent !important;
}

This will control all elements with alternate color or main-colo

If you need to change the background color only for the title/breadcrumb area update theme to latest version (5 may update) and add this CSS

COPY CODE

.breadcrumbs-container {background-color:transparent;}

The CSS will be added to wp-admin -> theme options -> general settings -> quick CSS

NOTE : Child theme needs to be installed and activated.

Cheers
R.

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

What support service includes ? What not ?

[willowillos]

On Kleo 4.2.4. Added the CSS to the location that you specified. Still not getting the desired results. Alternate Background still white, when set to transparent in CSS.

Attachments:

You must be logged in to view attached files.

[willowillos]

waiting for 4.2.4.1 to be able to update through the site.

[Radu]

Hi,

All of those are correct but the issue was caused by the main div wich haves the background white

COPY CODE

div#main {
    background: transparent;
}

By adding this to quick CSS are all elements that haves background transparent will be transparent over the body image

All right now ?

Cheers
R.

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

What support service includes ? What not ?

[willowillos]

Still white.

Attachments:

You must be logged in to view attached files.

[Radu]

Add also this css

COPY CODE

section.container-wrap {
background:transparent;
}

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

What support service includes ? What not ?

[willowillos]

makes everything transparent.

Attachments:

You must be logged in to view attached files.

[Radu]

The div main it’s always under the sections so it’s useless if you choose for certain sections background transparent if the section it’s wrapped in a white background div…

Only in this way, you can have what you need but you should add the white background for certain sections or set white background for main color but for alternate color choose background transparent.

The theme option works but, the main div has by default white background.

I’ve used this css

COPY CODE

div#main {background:transparent;}

.article-content section.alternate-color {background:transparent  !important;}

.article-content section.main-color { background: lightblue !important;}

To can have sections transparent to the background you should set for the main div transparent.

Cheers
R.

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

What support service includes ? What not ?

[Author]

Posts