Fix Elementor Global Colors Not Updating When Adding New Colors

Fix Elementor Global Colors not updating when adding new global colors

This post will share a fix to Elementor global colors not updating when adding new colors in the site settings. I recently stumbled upon a really annoying bug in the Elementor editor, to which I couldn’t find any solution online. While designing a new Elementor website, we added to existing templates some new Elementor global colors and global fonts.

After adding the Elementor global colors in the Site Settings, we got back to the editor. Every now and then, the colors disappeared. It seemed like the configuration we updated did not change anything. We had to refresh every time, or even worse, try to add and remove the colors again.

I looked online and couldn’t find any answer that actually solved the problem. Suddenly I noticed that when entering the website via Incognito, things started to work again. This triggered me to find the solution, which like all good things, is really simple.

Time needed: 5 minutes.

The following steps are ways to solve the problem

  1. Regenerate Elementor CSS files

    This is the standard “reset your computer, and it will work” solution. In my experience, it didn’t really help, but it’s still worth trying.
    – Go to your WordPress Dashboard
    – Click Elementor -> Tools -> Regenerate File

    regenerate elementor css file to solve the global colors and global fonts issue

  2. Empty Cache and Hard Reload Page in your Browser

    Leave the dashboard and go back to your website. Right-click the page and click Inspect Element. When the Inspect Element is open, right-click the refresh button at the top of the screen. You’ll now have an option to Empty Cache and Hard Reload Page, which you should click. This deletes a lot of data the browser stores about the website

    Empty Cache and hard reset to fix elementor global colors and global fonts error

  3. Open the Application Tab in the Inspect Element Window

    In your open Inspect Element window, click on the Application tab on the top part.
    You should see a lot of data related to your website, including cookies, local storage, static content and some more.

    open application tab in chrome inspect element window

  4. Delete All Local Storage

    – On the right-hand side, search for Local Storage and click on it.
    – Look for your website name (should be first)
    – Right-click on your website’s name and hit Clear

    Delete Local Storage from Insepct element to fix elementor problem

  5. Delete All Cache Storage

    – On the right-hand side, search for Cache Storage and click on it, this should be further down.
    – You should see only one entry
    – Right-click on that entry and hit Delete

    . delete cache storage from inspect element

Conclusion

Although this bug can be quite a headache, the solution is very simple. Simply hard delete local cache, accessing the Application specifically. This will solve the issue with Elementor global colors and global fonts not updating when you try to add new one.

Can you keep a secret?
You’ll be blown away by this AI powered tool 🤯
Trust me, it’s worth your time. My full review is right here.
Guy Eshet

Guy Eshet

Having more than 10 years of experience in development, Guy Eshet has a passion for software development, web design, and technology. He is constantly on to search for tools to simplify our lives. Guy is fluent in 5 languages, loves meeting new people, learning new things, and improving his skills.

Share this article!

Share on facebook
Share on twitter
Share on linkedin
Share on whatsapp

Leave a Reply

Your email address will not be published.

Be The First To Know!

Discover The Hottest Crypto & AI Tools