Issues
- A blank page called ‘white screen of death’ shows while editing with Elementor.
- A gray page with endless loading is displayed while editing Elementor.
- The widget panel is grayed out or loading endlessly while editing with Elementor.
- When clicking Edit with Elementor, you do not see the edit page and you are sent to the live page.
- Edit with Elementor link not available.
Possible causes
Following may be the causes:
- Fatal error
- Memory issues
- Code related issue
- Server error
- Plugin issue
- Version incompatibility
Solutions for white screen
Following are some of the solutions for white screen:
Check system requirements.
Check if you meet system requirements. For details, see System Requirements To Use Elementor.
Check memory
Deactivate a few plugins to free some space and see if it solves the issue.
If this solves the problem, ask your hosting company to increase your WP memory. For details, refer wp-config.php – Common APIs Handbook.
Check Elementor loading method
The white screen of death can also occur due to the way Elementor loads. Use the option switch front-end editor loader method to solve this issue.
Follow these steps:
- Login to Wp Admin.
- Go to Elementor > Settings.
- Click Advance.
- Enable Switch Editor Loader Method.
- Click Save Changes.
Check back-end and front-end urls
If the URL in the back-end is different from the one in the front-end it can cause blank page error to occur.
For details, refer Giving WordPress Its Own Directory – Advanced Administration Handbook.
Follow these steps:
- Login to WP Admin.
- Go to Settings > General.
- Make the Site Address (URL) the same as the WordPress Address (URL).
- Click Save Changes.
Resolve plugin conflict
See Resolve plugin conflict below
Ensure version compatibility
If you are using both the free version of Elementor and Elementor Pro, make sure the versions are compatible. Using newer version with the outdated version can cause conflicts. As the newer version may be using code or functions not recognized by the older versions. Update both (Elementor and Elementor Pro) to the latest versions.
Clean custom code
Custom code can sometimes interfere with the Elementor Editor. Try to disable any custom code you may have added to your website to see if this resolves the issue.
Clean content
If content is copied from another page, do the following:
- Paste it into the Text Editor.
- Switch to the plaintext mode and remove any CSS classes and extra code.
Solutions for gray screen
Following are the solutions for white screen.
Resolve plugin conflict
Follow these steps to check for plugin conflict:
- Activate Safe mode and check to see if you can edit with Elementor.
- If you can edit with Elementor in Safe mode, do the following:
- Temporarily deactivate all of your plugins except Elementor and Elementor Pro.
- Reactivate each plugin, one at a time, until the problem reappears. The last plugin reactivated is the cause of the problem.
- Contact the 3rd party plugin’s developers to get help with resolving the conflict, or use a different plugin with similar functionality.
- If the website does not work, submit a ticket to Elementor support.
Resolve browser add-on issue
You can get the loading page because of an add-on installed on your browser. In this case, you can switch to any of these other browsers:
- Safari
- Chrome
- Firefox
- Opera
Disable the preloader
If your theme uses a preloader, you may need to disable the preloader within the theme’s options or within Customizer. For details, see Is Elementor Compatible With All WordPress Themes?.
Check browser error message
The gray page can also occur due to:
- X frame restrictions
- Cross-origin issues
To confirm, check the error messages of your browser console.
- Right click on the webpage.
- Select Inspect > Console.
The Console shows errors in red with the location and line number where it occurred.
Change the X-Frame-Options from DENY to SAMEORIGIN. Ask your hosting company to solve this.
Switch off Rocket Loader (For Cloudflare users)
Cloudflare users may need to either switch off Rocket Loader or add rules to Cloudflare. When Rocket Loader is activated it can take time to load the editor of Elementor and sometimes you will get stuck on the gray loading page.
For detailed solution, see Elementor And Cloudflare Rocket Loader.
Clear cache
The cache of Cloudflare can prevent your browser from recognizing the new versions of Elementor and Elementor pro. Clear/deactivate your cache before updating the plugins.
Ensure version compatibility
If you are using both the free version of Elementor and Elementor Pro, make sure the versions are compatible. Using newer version with the outdated version can cause conflicts. As the newer version may be using code or functions not recognized by the older versions. Update both (Elementor and Elementor Pro) to the latest versions.
Solutions for widget panel loading endlessly
Following are the solutions for widget panel loading endlessly.
Widget panel grayed out completely
If the widget panel is grayed out completely and looks like the following image, you may have a plugin conflict.
To find a plugin that is causing the layout issue, deactivate all of your plugins except Elementor and Elementor Pro, if applicable. If this solves the problem, reactivate each plugin one by one, until you spot the problematic plugin. If found, contact that plugin’s support for help, or use a different plugin.
Only Text Editor widget grays out
If this grayed out panel only happens with the Text Editor widget, see Additional Troubleshooting section of Site Migration » Elementor.
Widget panel loading endlessly
If the widget panel is loading endlessly and looks like the following image, see Elementor Widget Panel Not Loading for the solution.
Solution for edit page not accessible
This may be due to plugin conflict. the troubleshooting procedures already mentioned in this article.
Solution for Edit with Elementor link not available
For resolution of this error, see Fix Edit With Elementor Button Missing.