Introduction
The Divi team is constantly releasing really awesome interface updates for their core theme to ensure it is faster, more intuitive and greatly enhances your website building experience. Unfortunately, the Divi theme is plagued with a bug that makes the back-end Divi Builder and the front-end Visual Builder unworkable on most browsers due to several limitations in its local storage. In this guide, we will be showing you some tips and tricks to help you fix the problem.
Divi Builder Continuous Loading
The Divi Builder infinite loading issues occurs when trying to edit pages and may affect the front-end visual builder or the back-end builder.
Divi Builder Continuous Loading Diagnosis
Due to Divi’s comprehensive nature, it is not a lightweight theme as it requires quite a bit of background processes to load and run. The Page and Visual Builder require more resources (PHP memory in particular) than a typical WordPress theme.
This causes errors when Divi tries loading vital resources and is prevented from doing so by default parameters on your browser or hosting service. This problem is usually caused by your browser’s default local storage limits which may also prevent the module settings popups from opening.
It is good practice to try troubleshooting your browser first before attempting to edit your website files and settings. After applying each tip, you can refresh your website page to see if the error has been rectified.
Divi and Cloudways CDN caching
As I was installing our DIVI search & filters demo for WooCommerce on Cloudways, I was surprised to be stroke by the issue. After a bit of trials and errors, I solved it by simply erasing the Breeze cache (Cloudways plugin). As I cloned the new environment from another demo, DIVI got lost somewhere with the caches. Surprisingly, DIVI was the only theme I installed that got stuck due to cloned caches.
Divi and too many products?
We failed also while installing DIVI on a 100 thousand WooCommerce products demo. But this time, we could not find a fix. It seems that a query got hanged while looking for the installed layouts during the first phase of an import.
You can find the complete analysis of this issue on Why DIVI load time is 15 seconds on a shop with 100K products.
Fixes for Divi Builder Issues
The first and best way to solve any problems with Divi is to update the theme itself, if there is a new update available, as your issue may have been addressed in the new update. However, if you are already on the latest version of Divi and the issue still presents itself then the tips below will help you as well.
Wiping Browser Local Storage
The directions below are pretty standard across all browsers, we are making use of the Chrome browser in this tutorial.
Tip 1: Clear Local Storage Memory
Make use of your browser’s developer tools extension (this tutorial makes use of the dev tools in Chrome) to inspect either the back end or front end of the website that is having a problem.
To open the Development tools console, right-click on the website and click on Inspect, or use Ctrl+Shift+I.
On the console, click on the Application tab and locate the Local Storage option on the left. Clicking on it will present you with a drop-down list of your website, right-click on it and click on Clear to wipe the local storage memory.
Tip 2: Clear Browser Cache and Cookies
Your computer devices stores website information on the browser cache so it doesn’t have to download the same information every time you visit that website. Instead, it pulls the stored information from its memory. Sometimes the old data on your browser cache and any new data on your website can cause errors.
To clear your browser’s cache and cookies, navigate to the settings page on your browser and search for the “Clear browsing data” option. This option will allow you to wipe your browsing history, cookies and cache.
Select all of the available data and clear them, then quit all browser windows, close and re-open the browser.
Editing Default Server Parameters
Your level of access to your website’s server files largely depends on your host in general and hosting plan in particular. Hosting services like InMotion, HostGator, and Bluehost will provide you with a cPanel like the one below. Other hosts might provide a different hosting management interface.
To access your server files, click on the File Manager option (outlined in red);
On the pop up that appears, select the Document Root option and choose your website from the drop-down menu. Remember to select the Show Hidden Files (dotfiles) option before clicking on Go.
This will take you to your server files including all of your website’s files which can be accessed in the public_html folder. Use the Search bar (outlined below) to quickly access any files you want to edit.
Tip 1: Edit Builder Timeout with .htaccess Fix
To fix the Divi Builder Timeout popup that prevents you from using the editor to edit a post or a page on your website using the Divi or Visual builder you may have to edit your .htaccess file.
Search for .htaccess using the search bar and select the first option.
This will take you to the location of the particular file. Right-click on it and select Edit to begin adding our code.
Copy the following code without the “” and click on Save Changes.
“<IfModule mod_substitute.c>
SubstituteMaxLineLength 10M
</IfModule>”
You can also try adding the following to the top of the .htaccess file:
“php_value memory_limit 256M”
Save this file and refresh your website.
Tip 2: Increase WordPress Memory Limit
To increase the amount of memory assigned to WordPress, you search for the wp-config.php file in your cPanel’s File Manager (like we did before) and edit it.
Scroll to the very bottom, just above the line that says: /* That’s all, stop editing! Happy blogging. */ and add this code:
“define(‘WP_MEMORY_LIMIT’, ‘256M’);”
Save this file and refresh your website
Tip 3: Edit the PHP.ini File
Allowing your PHP files access to more memory is a good way of speeding up your website and avoiding PHP memory errors. To do this we have to search for our php.ini file and edit it. Once you locate the PHP.ini file, open it and search (Ctrl + F) for a line like this:
“memory_limit = 64M ;”
Change the memory limit to 256M so it looks like this:
“memory_limit = 256M ;”
While you are there, you can also increase several other memory limits.
“upload_max_filesize = 50M
post_max_size = 50M
max_execution_time = 300”
So it looks like this:
Save this file and refresh your website. This should prevent the error from allowing you design your awesome website.s
If the above steps do not solve the problem, you may need to contact your hosting company and ask them to increase your website’s memory limits for you.
Is divi a good wordpress theme? Is there a better theme?
Divi is indeed a great page builder, and one of the most widely used. But it seems a bit bloated nowadays, with perhaps too many modules included. Which can cause the problems mentioned above.
Perhaps you could try the rising star Divi comparison by Elementor, just for a while. You might be surprised enough to consider switching.
Here are some links for more comparisons:
Divi vs Elementor by WPCrafter
Elementor vs Divi Builder: A Hands-on Page Builder Comparison
What do you like and dislike about Divi Theme?
You’ve reached the end of the article by now. You certainly have a good understanding of Divi pros and cons. Why not use the comments below and tell us what is good, and perhaps not so good, with your everyday Divi experience? Thanks for the other readers!
Ready to Quiz?
[yop_poll id=”1″]
