Can’t edit with Elementor

Overview

If you can’t edit in Elementor for any of the following reasons, follow this guide to resolve the most common 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 don’t see the edit page and are sent to the live page instead.
• Edit with Elementor link not available.

Issue – Editor is stuck on a grey page or loading spinner

Check for Plugin or Theme Conflicts

1. Activate Safe mode and check to see if you can edit with Elementor.
2. If you can edit with Elementor in Safe mode, do the following:
   1. Temporarily deactivate all of your plugins except Elementor and Elementor Pro.
   2. Reactivate each plugin, one at a time, until the problem reappears. The last plugin reactivated is the cause of the problem.
   3. Contact the 3rd party plugin’s developers to get help with resolving the conflict, or use a different plugin with similar functionality.
3. If the website does not work, submit a ticket to Elementor support.

Caching or Performance Settings

• You may be experiencing a caching issue. Try to clear your browser cache and refresh the page.
• Try to deactivate all plugins besides Elementor.

Browser extensions

• Try editing in incognito mode or another browser.

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.

Page Layout or Theme Issues

• You may be trying to edit a page that was created with a different theme.
• You may be trying to edit the Blog or Posts page. You can’t edit the blog archive page using Elementor.

Memory Issues

• You may be experiencing a memory issue. Check WP Memory Limit and increase it if needed. For details, refer wp-config.php – Common APIs Handbook.

Advanced: Console or Server Issues

• You may have a problem with your .htaccess file.
• You may see a gray page while editing due to a JS error or X-Frame-Options restriction. Right-click the page → Inspect → Console tab → look for red error messages.
• You may be facing an issue with the Preview URL. Go to Elementor → Settings → Advanced and switch the editor loading method to Enabled.
  Enable Switch Editor Loader Method.
  

Issue – Editor won’t load or appears as a blank white screen

Check the 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 the blank page error to occur. For details, refer to Giving WordPress Its Own Directory – Advanced Administration Handbook.

Follow these steps:

1. Login to WP Admin.
2. Go to Settings > General. 
3. Make the Site Address (URL) the same as the WordPress Address (URL).
   
4. Click Save Changes.

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:

1. Paste it into the Text Editor.
   
2. Switch to the plaintext mode and remove any CSS classes and extra code.

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. 

1. Right click on the webpage.
2. 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.

Issue – 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 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 the 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.

Issue – Edit with Elementor link not available

For resolution of this error, see Fix Edit With Elementor Button Missing.