[Resolved] Buttons background color does not work

[Jorge]

I use GP with Elementor
I set the color background for buttons set in Appearance > Customizing > Color > buttons > background in #ffffff
I create an Elementor section with a button and set nothing in the colors
The button does not show the color set in Appearance.

Where is the problem?

thanks

[David]

Hi there,

you will need to check Elementors settings, there used to be an option to disable its global colors and use the themes. I am not sure if that is still the case.

[Jorge]

Thanks for your answer David. As you say, there is an option in Elementor to disable their fonts and colors and I´ve disabled it.

[David]

Is it still not working ? If no can you share a link to the site.

[Jorge]

Yes, here it is:

https://www.arenamartinez.com/

Ther you can see some buttons like “VER MÁS” o “DESCUBRE MÁS” with the issue.

Thanks David

[David]

OK so it looks like Elementor does not support theme colors now as it writes this CSS:

.elementor-button {
    display: inline-block;
    line-height: 1;
    background-color: #818a91;
    font-size: 15px;
    padding: 12px 24px;
    border-radius: 3px;
    color: #fff;
    fill: #fff;
    text-align: center;
    -webkit-transition: all .3s;
    -o-transition: all .3s;
    transition: all .3s;
}

Its adding its own classes now.
You will need to set the color in Elementor 🙁

[Jorge]

Perfect David. I´ll contact with Elementor support and tell them. Thanks

[David]

You’re welcome. Let us know if you find something 🙂

[Jorge]

Yes. Thanks

[Jorge]

David, Elementor support team, has told me this:

“Hi Jorge.
Upon investigating the site I can confirm that you are not receiving any different styles from Elementor. That gray is the default button color when all styles are removed and the disable default colors is engaged. I have replicated this on my test site.

Now that I have seen it confirmed by myself and by the Generate Press customer support it is clear to me that there is a mismatch in the CSS classes required for Elementor to inherit colors from the Generate Press theme.

The problem could be found with some deep digging into the Generate Press codebase, but the quick solution would be to utilize the site settings of Elementor and control your button colors from our Editor nad not the theme.

So yes our disable default options are working.”

What do you propose to do? as it is a bit annoying not knowing where to change colors, if in Elementor or in GP.

I´ll wait for your answer. Thanks

[Elvin]

Hi Jorge,

To add another perspective to solving this issue, let’s try this angle.

I’ve scanned through the page source of the site you’ve linked and noticed you have a caching plugin enabled which merges ALL of the CSS of your site into 1 cached file.

This can be an issue.

The buttons previously mentioned are something added through Elementor’s page builder UI so the colors have to be set in it.

It seems like a simple issue of stale cache.

Here’s something you can try:

Try completely disabling the caching plugin and try changing the button’s color through Elementor’s UI.

Then check if the changes made on the page builder UI finally apply to the live site.

Let us know how it goes.

[Jorge]

Thanks for your email. IU´ve done it and followed theese steps:
– Fastest cache plugin -> Deactivated
– Deleted the contect of the folder wp-content > cache
– Set the button colors in customize > colors > buttons

No changes in the final result.
(I´ve acivated the plugin again as the site is in producion)

Thanks

[David]

What do you propose to do? as it is a bit annoying not knowing where to change colors, if in Elementor or in GP.

It sounds like Elementor changed there CSS Classes, so there is nothing in the theme that would allow you to set its buttons colors. You need to set those colors in Elementor

[Jorge]

Thanks David.

[David]

You’re welcome

[Author]

Posts