Divi Page Builder Cache

The latest versions of the Divi Page Builder includes very smart caching. This can sometimes lead to problems where users find they can’t add or delete rows or modules or use custom modules.

Disclaimer: I’ve only really experienced this issue when developing module customisations. So this may not work for your specific Page Builder caching situation. Results may vary.

LocalStorage

Divi’s Page Builder uses the JavaScript LocalStorage API. Basically this allows the Builder to store the Page Builder cache on your computer instead of in your browser, meaning that even clearing your browser cache does not clear the Page Builder cache.

You can see the LocalStorage elements from your browser’s inspector window. In Chrome it is found under Resources (see image below)

Inspector

To clear the LocalStorage items you need to run a line of javascript in your inspector window’s Console tab.

for(var prop in localStorage)localStorage.removeItem(prop);

I’ll expand this below so you can see what its doing.

for (var prop in localStorage) {
    localStorage.removeItem(prop);
}

What this does is loop through each property in LocalStorage and remove it from LocalStorage. Simple!

UPDATE 05/11/2016 As John kindly pointed out in the comments below an even quicker way to clear the local storage would be to just clear the local storage object.

window.localStorage.clear()

Once you’ve done this you’ll need to refresh the page to see if it has worked.

It’s worth noting that any other web apps you use that may use LocalStorage will also be cleared out, so it’s perhaps best to check if there are any other LocalStorage properties that aren’t Divi specific.

For those who aren’t as tech savvy to know where their inspector window is or how to use it, I’ve created a simple plugin that will clear all localStorage while using the WordPress admin interface if activated. I don’t recommend you leave it activated at all times. You can download the plugin here. Please note that this runs some JavaScript in your admin view, so once you activate it, refresh your admin view and leave it for a few seconds, before trying the Page Builder again.

I’d love to hear if this solved your specific Page Builder caching issues, so please leave a comment below if this helped you.

Buy my Divi Plugins from
Elegant Marketplace.

36 Replies to “Divi Page Builder Cache”

  1. It interesting topic that you have brought up, I’ve noticed some weird behavior over the last month and bit with Divi sites I’ve been building. they keep reverting back to a much older version of the post, I’ve not been able to work out what causing it but this could be the issue that I’ve seen.

  2. I’ve tried to clear the cache, re-install Divi theme, use it on PC/Mac and different browser but nothing. Sorry to admit that new release of Divi Builder gives me some troubles, the first one is I can’t delete rows and modules or load custom modules and page

  3. As I referenced in my comments on your custom module post, this very thing is something I struggled with for a couple of weeks. I kept changing the slug on a custom module, which made the changes work, but caused me a bunch of doubt about whether or not the whole thing would work.

    I had an idea the whole time that there was a cache somewhere, but I never in my life would have thought about the kind of cache you reference here.

    I do have to ask this, though – do you have any idea what Elegant Themes do when they do a module update? Obviously, they wouldn’t require anyone using the Page Builder to need to clear the local cache! :/

    In other words, what to do when a custom module plugin, that is in a marketplace, gets updated?

    As I also referenced in your other article, I hope this post along with that one starts getting some SEO juice! Your information has been helpful beyond belief and it’s very much appreciated.

    1. Hi Terry, thanks for the kind comments and free SEO juice! 😉

      I’ve not looked at this since I wrote it, so I can’t honestly remember, but if I think about it logically you would probably need to do something like this.

      1) bind to some wp_action when the plugin is loaded that checks against a db field for the version number.
      2) if the db has an older version, run some update script that does the page builder clearing, via ajax admn.

      I’m pretty sure, if I remember correctly, this is what ET do.

      It also gives me an idea for a new blog post……. 😉 I’ll write it up during one of my breaks later today/tonight so bear with me.

      1. Thanks very much for the further ideas! Take your time on the new blog – make it as great as the rest. 🙂 Looking forward!

  4. Excellent plugin. I’ve been building a custom full-width slider module as a plug-in and as you can imagine there’s a lot of code in there. I have found that after editing the module and deleting and re-installing the plugin anything added to the module appears, sometimes just creating a new page does the trick too but anything removed from the module is still there.
    Up til now I’ve been creating a new wordpress install and starting from scratch every time I do an update to the plugin. Re-installing div, updating wordpress etc etc. So far I am up to 9 fresh installs, all the while scratching my head trying to figure out what I could be doing wrong.

    I’ve now installed your plugin and woot woot, it appears that I’ll need no more fresh wordpress installs to test my plug-in so from the bottom of my heart, thank you very much indeed for saving me both time and the added expense of an anti-dandruff shampoo.

    1. Hi there, thanks for the support, I am glad the plugin worked for you.

      A reminder that I don’t recommend leaving the plugin active at all times, I only use it while I am developing plugins.

      Happy coding.

  5. Hi Jonathan,
    Thanks for your script, but it doesn’t work for me.
    Since my Divi 2.7.1 => 3.0.14 update, I always have an cache builder alert telling me to clearing my cache (that I already done). 🙁
    Best regards.

  6. For anyone experiencing this problem, a simpler method of clearing Divi cache from console is the following line of JavaScript:

    window.localStorage.clear()

  7. Thanks for your post, much appreciated!
    My problem is that after switching Site Language from English to Finnish and back again, the names of Predefined Layouts stay in Finnish. No matter what Site Language I switch to, all of the names of Predefined Layouts are stuck in Finnish. I also tested switching to and from Swedish and Danish and back to English again, but these names are Finnish only all the time.

    I’ve tried your plugin, but it didn’t make any difference.

    Following your advice in this post I run this code snippet in the console of my inspector:
    > for(var prop in localStorage)localStorage.removeItem(prop);
    < undefined

    I don't know what's 'undefined' but this code cleared my local storage (which, by the way, is under Application in my version of the Chrome inspector).

    However, Predefined Layouts are still in Finnish except for Creative Agency.

    Any suggestion for a solution would be greatly appreciated.

    1. Hello Arne

      This doesn’t sound like a page builder cache issue, my suggestion would be to either contact Elegant Themes support or post your question on the Divi Theme Users group.

      If you would like to contact me directly to investigate the problem, you will find my contact details on the about page.

      1. Thanks for your answer Johathan,

        I’ll take the issue over to Elegant Themes support and post my question on the Divi Theme Users group.

        I’ll get back to you when I know more.

        1. I’ve posted my question on the Divi Theme Users group and the suggested solution is to find the Finnish Predefined Layouts strings in the WordPress database and replace them with the corresponding strings in English.

          1. Thanks, Jonathan,

            I’ll look into the gettext filter you mentioned and get back here if there’s something I don’t understand.

  8. I am currently in development on a Divi Extra website and I have customized some of the modules to include Custom Post Types & taxonomies. This worked up until the recent update of Divi/Extra.

    The functionality of the plugins is not lost (it’s still displaying the custom post type) but the ability to alter them on the module has disappeared.

    It’s a cache issue because I have changed labels within the module and nothing is changing.

    I was hopeful this plugin would work but I haven’t seen any site changes. Any thoughts on cache within the Divi / Extra module would be helpful. Thanks!

    1. Hi Meagan

      I’ve never really worked with the Divi Builder within Extra, but I’m assuming it should be the same. If you’d like me to take a look at your site, feel free to contact me directly and I’ll see if I can figure out if it’s builder cache or something else.

  9. Great!!! Thank you!! I was trying with WP super cache because I wasn´t getting my categories updated but now I know about DIVI local storage. Very useful

  10. Hi Jonathan,

    Glad I found your blog, as this is exactly my problem. However, I installed your plugin but doesn’t seem to make any change. Any further ideas?

      1. I’m one of the ‘not that tech savvy’ guys I’m afraid ;-). Therefore glad to use a plugin.

        Did try it though, but doesn’t seem to work. Maybe doing it wrong. Any advice?

        1. Tom, what problem are you specifically experiencing? If you aren’t building Divi module plugins then I doubt that the Page Builder cache is the cause of your problem.

Leave a Reply

Your email address will not be published. Required fields are marked *