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.

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

    1. hello im having the same problem on some clients sites… i do some customizations on the pages in admin backend, after i loggof, and refresh page it goes back for a older version of the page, or lose style… has u found the solution? please im crazy about this…

  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. Thanks a lot, Jonathan, for this contribution.

    It really saved my brain´s health, I was getting crazy while trying to see changes done to custom modules.

    Keep up the good work!

  5. after doing this, I still have an error: admin.js?ver=2.2:190 Uncaught TypeError: Cannot read property ‘model’ of undefined

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

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

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

    window.localStorage.clear()

  9. Just a quick comment. This solved my problem. Installed the plugin and the lagging went away on the page builder. Thanks

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

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

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

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

  14. Absolutely thank you Jonathan, I’d tried Stephens article on how to create custom modules, and moved towards yours. But couldn’t find out why my edits sometimes show and sometimes won’t. I was thinking on caching but never thought they would use the js local storage. Anyways thanks for your help big time!

    1. Oh I wanted to ask, I’m trying to create new fields, below is from the $fields array.

      ‘content_new’ => array(
      ‘label’ => esc_html__(‘Heading Content’, ‘et_builder’),
      ‘type’ => ‘text’,
      ‘option_category’ => ‘basic_option’,
      ‘description’ => esc_html__(‘Here you can create the content that will be used within the module.’, ‘et_builder’),
      ‘toggle_slug’ => ‘main_content’,
      ),
      ‘sg_subtext’ => array(
      ‘label’ => esc_html__(‘Heading Subtext’, ‘et_builder’),
      ‘type’ => ‘text’,
      ‘option_category’ => ‘basic_option’,
      ‘description’ => esc_html__(‘Here you can create the content that will be used within the module.’, ‘et_builder’),
      ‘toggle_slug’ => ‘sg_subtext’,
      )

      However the new field subtext isn’t showing in the builder.

  15. Not sure if anyone is getting this issue. But when I edit a post then I push update.

    I go to the page to see it. Then I click edit page.

    When I am in the admin again the old content from before i hit update shows.

    I have to refresh the page in order to see he updated changes in the admin.

    I tried your local cache plugin and disabled any other caching plugin i had but the issue still occurs.

    Any ideas

  16. Yes, I had a nightmare week with this problem. There is a chrome clear cache extension which clears the local cache. I have turned off the Divi caching and use WP-Fastest Cache.

    I guess that I will neeed to clear the caches after updates in future.

    Who says tha tlife gets easier!

  17. I was having issues with my Modules not opening on multiple installs. I would just get the spinning wheel of death. And sometimes I would get no response at all from clicking the settings tab. Have been using the Visual Front End Builder since. A Divi support guy referred me here and I entered the recommended code in Chrome Dev Tools Console and it seemed to do the trick. Thanks,

  18. Hi Jonathan,
    I have a .js file stored in theme\divi\js\. I did everything i thought it might make the browser bringing up my updated .js file which already uploaded in godaddy webserver. But it keeps bringing up the old version. Could you educate me on this issue? Thank you very much!

    1. Jonathan,
      Yes, clear localstorage works for me. At the most hopeless momment after 2 days of researching how to get rid of the stubborn old .js keeps showing up, i found your post last night. Wake up today (after a night full of dream about the issue) start with your recommendation, it finally works. I wish you are able to feel how much appreciation from me to you. Thank you, thank you very much for sharing such the wonderful knowledge! A huge hug from distance!
      Anh.

  19. Jonathan,

    I’m having a persistent Divi Builder Cache error. I’m using WP Fastest Cache. I’ve tried:

    – clearing the WPFC cache
    – clearing my browser cache
    – running the js above
    – installing the plugin above
    – installing a plugin found elsewhere online, I believe written by you, that purports to fix the issue
    – disabling WPFC entirely
    – different browsers & OS – issue persists in Chrome & IE on W10, and in Safari on OS X

    Others claim to be able to edit pages on the site, but I’m hooped. Can you suggest any other course of action?

    Thanks,
    Jim

  20. Thank you so much for this. I’ve been trying to create a custom module based on an existing one and just added a few fields but the new fields are not showing up at all. Good thing I stumbled upon your post and it fixed my issue.

  21. Thanks Jonathan. I’ve uploaded the plugin and it has solved the problem I was having on numerous sites with not being able to open or edit modules.

    (Any solution to the clumps of hair I’ve pulled out 🙂 )

  22. Jonathan! You are my savior. Your plugin helped me get rid of the problems in Divi. Very grateful to you! You are awesome!

  23. I get “undefined” when I run these. Is that how it’s supposed to work? It doesn’t seem to be helping with the latest issues I’m having. But I’m not sure if it’s working or not…?

    1. Yes that is the expected output. All it does is clear the local storage. If you use Chrome, you can watch the local storage in your Developer Tools, under Application -> Storage -> Local Storage. You could also clear the local storage there.

      This only helps you if you need the clear the page builder local storage cache if you are developing page builder modules, it wouldn’t help if you are having other caching issues.

          1. I can’t remember what worked now. I kinda don’t think it was this. Clearing all cookies related to the site and restarting Chrome, I think is what did it….

          2. This article was written over 3 years ago now, you’ll probably find the Divi page builder caching system has changed a lot since then.

  24. Thank you very much for this article! I’ve spent two hours trying to get my fields to appear. I wonder if there is a development mode in Divi which switches off all the caching. I’ve also searched for a way to turn off LocalStorage for my dev site in Chrome, but it seems that this option was available in earlier versions and now has been removed.

  25. Hi, I’m developing an extension for Divi and when I change the fields in the get_fields function they are not updated in the builder.
    I tried to clear the cache as you suggested and open the site with another browser, but the error persists. Do you have any idea?
    Thanks in advance

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.