Zaheer Akram

Unlocking the Power of Positive Thinking: A Guide for a Happier Life

Are you frustrated by Elementor’s ‘Can’t Edit With Elementor’ error, staring at that black loading screen?

In today’s digital world, Elementor has become a powerful and popular page builder for creating stunning websites within WordPress. Its user-friendly drag-and-drop interface allows users to create web pages with ease.

But sometimes you may encounter the frustrating ‘Can’t Edit With Elementor’ issue, slowing down your creative process.

Frankly Speaking, there are more than 8.8 million active websites using Elementor. 

In various industries around the world, its popularity continues to grow 

among beginners and experts alike.” (ref:colorlib)

Typically, this issue is referred to as the “white screen of death“. There are many reasons for this, including issues with your web hosting server, insufficient PHP memory, browser caching, outdated versions of Elementor, and conflicts with other plugins.

In this blog, we’ll walk you through 9 easy steps to overcome this hurdle and get back to building the website with Elementor.

So, let’s dive in and keep your web design journey smooth and hassle-free.

The main cause of Elementor not loading is often that your server does not meet the plugin’s requirements.

The Elementor not loading error results in two primary issues:

  • The widget panel fails to load when Elementor is active on any page.
  • When attempting to load Elementor, a blank screen is displayed.

When the widget panel doesn’t load or only shows a blank screen, it renders the page builder unusable. In some cases, the editor may load correctly, but the widgets are non-functional, preventing you from dragging and dropping them. However, you can still edit existing content without any errors.

To fix this issue, you have to follow these mentioned steps one by one. 

  1. System Requirements Check

First, you should need to ensure that your system meets the necessary requirements for Elementor to function properly.

  1. Memory Issue Resolution 
  • Deactivate Plugins: 

Consider temporarily disabling some of your plugins to check if they are using excessive memory. After that, try reactivating them one by one and check the memory usage of each plugin

  • Request WP Memory Increase: 

If memory is the problem, contact your hosting provider and request an increase in WordPress memory allocation. 

  1. Update PHP Version and increase PHP Memory Limit

Common WordPress errors, like insufficient PHP memory or outdated server PHP versions, can hinder Elementor editor’s functioning. Elementor is most compatible with PHP 7.0 or higher. You can check your PHP version in WordPress by going to Tools > Site Health > Info tab > Server tab. 

If you want more detail about how to increase PHP memory Limit, you can check our latest guide. 

  1. Remove Cache From Your Browser

To resolve this error, first, you will clean your browser’s cache and hard reset the page. For this, click on the right button of your mouse and go to inspect the element.

After that, you will see that your window is split and divided into screens. Now, right-click on the reload tab then click on ‘Empty Cache and Hard Reload”. 

Now, right-click on the reload icon of the browser. You will see three options there. Just click on the empty cache and reload option. 

  1. Update Elementor

Ensure that you’re using the latest version of Elementor because outdated plugins can lead to conflicts with other plugins and the wordpress core. If updates are available, make sure to update the Elementor or Elementor Pro (if you are using it). 

  1. Disable Cache and Performance Plugins

If you are using Cloudfare’s CDN or any other performance plugin for your website performance, you should clear their cache to get rid of the “can’t edit with elementor”  issue. 

Cloudflare’s CDN is a great way to optimize your website, but you may need to switch off Rocket Loader or Add Cloudflare rules to get maximum performance. You may experience loading delays in Elementor when Rocket Loader is enabled, and you may get stuck on the gray loading page. Because Elementor and Rocket Loader do not go well with each other.

So for a better elementor experience, simply you have to disable the Rocket Loader to solve the issue. To disable the rocket loader, follow these three easy steps:

  1. First, you will log into the Cloudflare account and select your domain.
  2. Then, you’ll click on Speed > Optimization from the left menu.
  3. Here, you’ll find the Rocket Loader option just turn it off. Now, You should see better results when using Elementor.

[image]

  1. Enable Switch Editor Loader

Elementor editor is not loaded due to server configuration conflicts. This issue is likely to be resolved by an option in Elementor. 

To fix this issue, 

  1. Navigate to Elementor > Settings > Advanced.
  2. Enable the “front-end editor loader method” option.

Go to Elementor–>Settings-Advanced to fix it. Here, you need to enable the Switch Editor Loader Method.

  1. Re-generate files

If you’re experiencing issues with Elementor, such as problems with editing, consider regenerating files. To do this:

Go to Elementor > Tools > General, then click on the Regenerate CSS & Data button, it will regenerate the CSS files. For some users, the regenerate file option has solved this issue. 

  1. Check Site Health

To resolve the elementor editor issue, another step is to check your website’s health. 

To check the site health, follow these steps:

  • Navigate to your WordPress Dashboard and select ‘Tools’ 
  • Then choose ‘Site Health’ and go to the ‘Status’ section. 
  • This will allow you to identify any errors, which you can then attempt to resolve. 

For additional information, you might check our guide on how to Improve Your WordPress Site Health Check Score

📢 Keep in mind: Before applying each of these steps, you must take a backup of your website. You will be making modifications to your site which is risky to break your website. So, take a full backup of your entire website. Don’t proceed without this precaution.

Zaheer Akram

My journey in the world of web development began [mention when and how you started]. Since then, I’ve had the privilege of working on a diverse range of projects, from small business websites to complex web applications. Each project has been an opportunity to learn and grow, and I thrive on the challenges that come with pushing the boundaries of what’s possible on the web.

Share This

Recent Posts

Unlocking the Power of Positive Thinking: A Guide for a Happier Life

Best Beaver Builder Vertical Timeline Module: How to Choose?

Explore Team Module for Beaver Builder: Ultimate Guide [2023]