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.
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.
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 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 the Shortcode.
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 and used for the first time.
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.
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.