As much as we love Elementor, errors sometimes occur while loading the plugin. One of the common errors is the “Preview Could Not Be Loaded” Error. This is THE top error that occurs with Elementor and Elementor Pro. But don’t fret, almost always, this can be fixed.
It basically tells you the plugin failed to load with no additional information. This could be really frustrating for users. Especially when it was working fine just a minute ago.
How to fix the ‘Preview could not be loaded’ error
Before going further, 99% of the time, this error usually caused by running out of memory. To resolve this, you must increase the PHP memory_limit variable. The recommended memory limit is 512MB. Do this. And if you still encounter this problem, read on.
Elementor documentation offers 9 different solutions to this problem. But it’s really up to you to trial and error various methods. These methods are:
- Deactivate plugins.
- Switch theme.
- Check the structure of your permalinks.
- Edit in incognito mode with your browser.
- Check conflicts with membership plugins.
- Solve possible theme conflict.
- Solve Rocket Loader issue.
- Verify that you do not have a redirect on the page.
- Solve hosting issues.
Some methods are really undesirable. For example, Switching Themes and Deactivating Plugins. Especially on a “live” website, switching Themes may not be an option.
The following are the steps i usually go through when debugging the issue before going through the list.
Check Scope of the Error
First, you should Check if Elementor is failing to load on just a particular page or a site wide issue. Try loading Elementor on different pages to narrow down the problem.
If the issue is just on a particular page, chances are the culprit is a Shortcode. If that is the case, revert to using WordPress editor and remove the WordPress Shortcode.
Over the years, we encountered some really badly written Shortcodes embedded into WordPress Themes. If removing the Shortcode is not ideal, try updating the Plugin or Theme associated with it. But if the issue occurs site wide, try the following.
Check Hosting Compatibility
As described here, the simple explanation to the problem could be just a lack of allocated memory. Check Elementor > System Info tab and increase memory allocated to PHP. Furthermore, this error should be apparent the moment Elementor is installed, updated and used for the first time. Especially the recent update to Elementor 2.4.1 and above did seem to require more allocated memory.
Check Visibility Settings
There are some cases where a Password Protected page cannot be edited. Therefore, try editing the page with Visibility settings in Draft or Published settings.
Check Plugins Compatibility
Before going on to deactivate plugins, check the list of known plugin conflicts. In addition, try deactivating Caching and Security Plugins like WordFence and Autoptimize.
We have been using Elementor (Free) coupled with AnyWhere Elementor to call out Elementor layouts. Initially, all was well when we installed Elementor Pro. However, upon updating to the latest plugin, error occurs. Fortunately, Elementor has a Rollback function to the previous version (found in Tools > Version Control).
Increase Disk Space
In some cases, server errors occurs. Such as Error 500 and 400. Upon checking server logs, we recently encountered an Error 400. Turns out, there was insufficient disk space available. Delete some large files and all was well again.
Undo Recent Changes
If you have made code changes to the WordPress Theme template files or functions.php file recently, then it would be a good idea to backup and undo your recent code changes. It is highly probable that changes made has caused the error especially if you get Error 500 response.
Avoid Multiple Editing Screens
On shared hosting plans, the CPU and Inodes Usages usually are limited. Go to your cPanel and click on the Expand Stats link, which is usually on the left hand side of your screen. If you see a high CPU use, close your browser tabs. and retry again when the CPU usage goes down. We understand that when building a website, editing on multiple tabs is inevitable. Go easy on your server or better yet, switch to SiteGround.
Error on Duplicated Posts
One known occurrence of this error causing Elementor not loading is on duplicated posts. The reason is that the permalink or slug is duplicated as well. The easy fix is to change the permalink, save the post and you should be able to be able to load Elementor successfully.
Cleaning the Database
In a Facebook post in the Elementor community, a user managed to solve the problem of the the editor not loading by cleaning the database with a plugin like WP Optimize. However, do be sure to backup your database before any cleaning.
When All Else Fails
No idea on what you are doing? Or need professional help? Reach out to the Elementor Community in Facebook. Or If you have Elementor Pro, you can send your website login details and the Elementor support team to help pinpoint the cause and fix it.
You may also like these articles: