How to Fix Elementor Stuck on Loading: Complete Troubleshooting Guide

Elementor is one of the most popular ways to build WordPress websites without writing every part of the page manually. But when the Elementor editor gets stuck on the loading screen, shows a gray or blank canvas, or keeps displaying the loading animation indefinitely, it can make the entire website difficult to manage.

The problem is usually not caused by Elementor alone. The editor depends on WordPress, PHP, your active theme, other plugins, JavaScript, AJAX requests, REST API requests, server resources, and sometimes CDN or security configurations. If one of those components fails, Elementor may never finish loading.

This guide explains how to diagnose and fix Elementor stuck on loading problems, starting with the easiest checks and moving toward server-level troubleshooting.

What Does “Elementor Stuck on Loading” Mean?

When Elementor is stuck on loading, the editor may behave in several different ways:

• The Elementor panel keeps showing a loading animation.
• The editor opens but the page canvas remains gray or blank.
• The “Edit with Elementor” button opens a page that never finishes loading.
• Elementor loads partially, but widgets never appear.
• The editor works in Safe Mode but not normally.
• The editor works on some pages but not others.
• Elementor suddenly stopped loading after a plugin, theme, WordPress, or Elementor update.
• The page preview shows a “Preview Could Not Be Loaded” error.

These symptoms can have completely different causes.

For example, if Elementor works in Safe Mode, a plugin or theme conflict becomes much more likely. If it also fails in Safe Mode, you should investigate memory, server configuration, URLs, permissions, caching, security rules, and browser errors instead. Elementor specifically recommends Safe Mode as a way to isolate third-party plugin and theme interference.

Before You Start Troubleshooting

If this is a production website, create a backup before making major configuration changes.

Do not immediately start changing PHP settings, deleting plugins, modifying .htaccess, or reinstalling WordPress.

Instead, first determine what changed and whether the problem happens everywhere.

Check:

• Does Elementor fail on every page?
• Does it fail only on one page?
• Did the problem begin after an update?
• Does it happen in another browser?
• Does it happen in an incognito window?
• Does Elementor work in Safe Mode?
• Does the WordPress frontend still work normally?
• Are there JavaScript errors in the browser console?

These answers can significantly reduce the amount of unnecessary troubleshooting.

1. Test Elementor in a Private or Incognito Window

Start with the simplest possibility: your browser.

Open the WordPress dashboard in an incognito or private window and try editing the page again.

This helps eliminate:

• Browser cache
• Cached JavaScript
• Browser extensions
• Old Elementor assets
• Cookies or local storage problems

If Elementor works in an incognito window, the problem is probably local to your browser rather than your WordPress installation.

You can then clear the browser cache and test again.

Also temporarily disable browser extensions, particularly extensions that modify pages, JavaScript, privacy settings, or developer tools.

2. Check Whether the Problem Happens on Every Page

Try opening several different pages with Elementor.

For example:

• Homepage
• About page
• Contact page
• A newly created test page

If Elementor loads on a new page but not on one specific existing page, the problem may be related to that page rather than Elementor itself.

A particularly large page can contain a significant number of widgets, nested containers, dynamic elements, custom CSS, third-party widgets, or corrupted data.

If only one page is affected, do not immediately assume that the entire Elementor installation is broken.

This distinction is important.

3. Enable Elementor Safe Mode

One of the most useful Elementor troubleshooting tools is Safe Mode.

Go to:

WordPress Dashboard → Elementor → Tools → Safe Mode

Enable Safe Mode and try opening the same page again.

Safe Mode allows you to test the Elementor editor without normal third-party plugin and theme interference. It is intended as a diagnostic tool rather than a permanent operating mode.

If Elementor works in Safe Mode

This is an important result.

It means the problem is likely related to something that Safe Mode has isolated, such as:

• A plugin
• Your active theme
• Custom theme code
• A third-party Elementor addon

You can then perform a conflict test.

If Elementor still does not load in Safe Mode

Do not waste hours deactivating plugins one by one.

The problem is more likely to involve:

• PHP memory
• Server configuration
• URL configuration
• Security rules
• JavaScript execution
• REST/AJAX requests
• Permalinks
• File permissions
• CDN optimization
• Hosting restrictions

Elementor’s current troubleshooting guidance specifically notes that if Safe Mode does not resolve the problem, the cause is less likely to be a normal third-party plugin or theme conflict.

4. Find the Plugin Causing the Elementor Conflict

If Elementor works in Safe Mode, the next step is to identify the conflict.

Do not deactivate random plugins and hope you find the problem.

Use a controlled test.

First, deactivate non-essential plugins while keeping Elementor and Elementor Pro active if you use both.

Then test Elementor.

If the editor starts working, reactivate the plugins gradually.

For example:

• Activate your SEO plugin.
• Test Elementor.
• Activate your caching plugin.
• Test again.
• Activate your forms plugin.
• Test again.

Continue until Elementor stops working.

The last plugin activated is a strong candidate for the conflict.

This is particularly important with Elementor addon plugins because they can add additional widgets, JavaScript, CSS, dynamic functionality, and editor integrations.

A real-world WordPress support case, for example, involved an Elementor editor that stopped loading when a third-party addon was active.

Do not assume the conflicting plugin is “bad”

A conflict does not necessarily mean that the plugin is poorly developed.

Two plugins can individually work correctly while interacting badly with each other.

The conflict may also only occur under a particular combination of:

• Plugin versions
• PHP version
• WordPress version
• Theme
• Elementor version
• Server configuration

5. Test the WordPress Theme

If disabling plugins does not solve the problem, test the theme.

Temporarily switch to a lightweight default theme or Hello Elementor.

Then try opening the same page.

If Elementor starts working, investigate the original theme.

Possible causes include:

• Custom JavaScript
• Custom Elementor integrations
• Theme scripts
• Custom Elementor widgets
• Theme builder functionality
• Header or footer templates
• Custom AJAX functionality
• Outdated Elementor compatibility code
• Incorrectly implemented hooks

If the site uses a heavily customized theme, the theme itself may be responsible even though Elementor worked correctly before.

6. Regenerate Elementor Files and Data

Elementor generates CSS and other data used by the editor and frontend.

If these files become outdated or inconsistent after an update or migration, regenerating them can resolve certain loading and display problems.

Go to:

WordPress Dashboard → Elementor → Tools

Look for the option to regenerate or clear Elementor files and data.

Depending on your Elementor version, the exact wording may differ.

After doing this:

• Regenerate Elementor files/data.
• Clear your WordPress cache.
• Clear your hosting cache if applicable.
• Clear CDN cache if applicable.
• Clear your browser cache.
• Reload Elementor.

Elementor recommends regenerating CSS/data as part of its troubleshooting process for editor and preview problems.

If you regularly work with caching and optimization plugins, this step becomes particularly important.

7. Check WordPress and Site URLs

An incorrect URL configuration can prevent Elementor’s editor or preview from communicating correctly with WordPress.

Go to:

Settings → General

Check:

WordPress Address (URL)

and

Site Address (URL)

They should normally match the intended domain and protocol.

For example, avoid situations where one uses:

https://example.com

while the other uses:

http://example.com

or one uses:

https://www.example.com

while the other uses:

https://example.com

unless your specific setup intentionally requires a different configuration.

Elementor’s current troubleshooting documentation specifically recommends checking that the WordPress Address and Site Address use matching protocols and domain configuration.

URL mismatches can become especially common after:

• Moving a website
• Changing domains
• Enabling SSL
• Switching from www to non-www
• Migrating from staging to production
• Changing hosting

If the website was recently migrated, also review our guide on How to Move a WordPress Website to a New Host Without Downtime.

8. Increase the PHP Memory Available to WordPress

Elementor can require considerably more memory than a simple WordPress page because the editor has to load WordPress, Elementor, your theme, plugins, widgets, page data, and editor functionality simultaneously.

If PHP memory is too low, Elementor may freeze or fail to complete loading.

You can check your server information through WordPress Site Health or Elementor’s system information.

A common starting point is:

define( 'WP_MEMORY_LIMIT', '256M' );
define( 'WP_MAX_MEMORY_LIMIT', '512M' );

These should be added to wp-config.php before:

/* That's all, stop editing! Happy publishing. */

However, setting a WordPress constant does not necessarily override the actual PHP memory limit imposed by the hosting environment.

For example, WordPress may be configured to request 512 MB while PHP or the hosting provider only allows 256 MB.

In that situation, changing wp-config.php alone will not solve the underlying server limitation.

If you want to understand the difference between WordPress and PHP memory limits, see How to Fix WordPress Memory Limit Errors: Complete Guide.

9. Check PHP Version and Server Resources

Memory is not the only server-side factor.

Also check:

• PHP version
• PHP memory limit
• Maximum execution time
• Maximum input variables
• Maximum POST size
• Upload size
• PHP workers
• CPU availability
• Server response time
• Server error logs
• Database performance

A website with a large Elementor installation can expose server limitations that a basic WordPress site never reaches.

For example, an Elementor editor may make multiple requests while loading the editing interface. If the server is slow, overloaded, or repeatedly timing out, the browser may simply continue displaying the loading animation.

This is one reason why increasing random PHP limits is not always the correct solution.

You need to determine whether the server is actually reaching a limit.

10. Check the Browser Console for JavaScript Errors

If Elementor is stuck loading, the browser developer console can provide one of the most useful clues.

Open the Elementor editor and then open Developer Tools.

In Chrome:

Right-click → Inspect → Console

Look for red errors.

You may see messages related to:

• JavaScript exceptions
• Failed requests
• CORS
• REST API
• AJAX
• 403 errors
• 404 errors
• 500 errors
• Blocked scripts
• Security policies
• Failed network requests

For example, if a required Elementor JavaScript file returns a 403 response, Elementor may never finish initializing.

Likewise, if a JavaScript error from another plugin prevents Elementor’s scripts from executing correctly, the editor may remain stuck.

Do not only look at the first error.

Sometimes the first visible error is a consequence of an earlier failed request.

11. Check the Network Tab

The Console is useful, but the Network tab can be even more informative.

Open:

Developer Tools → Network

Then reload Elementor.

Look for requests that:

• Remain pending
• Return 403
• Return 404
• Return 500
• Return 502
• Return 503
• Fail completely

Pay particular attention to requests related to:

• admin-ajax.php
• REST API endpoints
• Elementor scripts
• WordPress JSON endpoints
• Preview URLs
• Dynamic content requests

If a request remains pending indefinitely, the problem may be on the server rather than in the browser.

If it returns 403, investigate security rules or permissions.

If it returns 500, check PHP and server logs.

If it returns 404, investigate URLs, rewrite rules, or missing files.

12. Check AJAX Requests

Elementor relies heavily on communication between the browser and WordPress.

If AJAX requests are blocked, fail, or time out, the editor can appear to be permanently loading.

Possible causes include:

• Security plugins
• Web application firewalls
• ModSecurity
• Server restrictions
• Incorrect permissions
• Plugin conflicts
• PHP errors
• Hosting limitations
• CDN rules
• Reverse proxy configuration

If you see failed admin-ajax.php requests in the Network tab, investigate the actual response rather than simply refreshing the page repeatedly.

The HTTP status code often tells you where to look next.

13. Check REST API Problems

Modern WordPress installations use the REST API for many types of communication.

You can test whether the REST API is responding by visiting:

https://yourdomain.com/wp-json

Replace yourdomain.com with your actual domain.

A working WordPress REST API should return JSON data rather than a generic server error.

If the REST API is broken, investigate:

• Security plugins
• Authentication
• Permalink configuration
• Server rules
• Firewall restrictions
• Plugin conflicts
• PHP errors
• Custom REST API code

If you regularly work with WordPress integrations or custom functionality, our guide How to Debug WordPress REST API Errors: Complete Troubleshooting Guide covers the debugging process in more detail.

14. Disable JavaScript Optimization Temporarily

Performance plugins can sometimes change how JavaScript is loaded.

Common features include:

• Minification
• Combination
• Defer
• Delay JavaScript
• Remove unused JavaScript
• Script optimization
• CDN JavaScript optimization

These features can improve frontend performance while simultaneously causing problems in a JavaScript-heavy editor.

Temporarily disable JavaScript optimization and test Elementor again.

This is especially important if the problem started immediately after changing a performance plugin’s settings.

Cloudflare’s Rocket Loader can also interfere with Elementor’s script execution order. Elementor specifically lists disabling Rocket Loader as a troubleshooting step for certain preview and editor loading problems.

Once you identify the optimization feature causing the problem, you can usually exclude Elementor-related scripts instead of disabling optimization across the entire website.

15. Temporarily Disable CDN and Security Optimization

If you use Cloudflare or another CDN, temporarily bypass or disable features that modify JavaScript, HTML, or requests.

Check:

• Rocket Loader
• JavaScript optimization
• HTML rewriting
• Firewall rules
• Bot protection
• Browser integrity checks
• Custom WAF rules
• Rate limiting

The goal is not to permanently disable security or CDN services.

It is to determine whether they are interfering with Elementor.

If Elementor starts working after disabling one feature, restore the remaining configuration and create a targeted exclusion.

16. Check Security Plugins and ModSecurity

Security systems can block requests that look unusual.

This can happen with:

• Wordfence
• Other firewall plugins
• Hosting WAFs
• ModSecurity
• Cloudflare rules
• Server-level security systems

If Elementor requests are returning 403 errors, check your security logs.

You may find that a security rule is blocking a request generated by the editor.

If you suspect ModSecurity, ask your hosting provider to check whether it is blocking Elementor-related requests.

Do not permanently disable server security simply because Elementor works afterward.

The better solution is to identify the rule and create an appropriate exception if possible.

17. Flush WordPress Permalinks

Broken rewrite rules can cause unexpected problems with previews and requests.

Go to:

Settings → Permalinks

You normally do not need to change your permalink structure.

Simply open the page and click:

Save Changes

This refreshes WordPress rewrite rules.

Then test Elementor again.

This is a low-risk troubleshooting step and can be particularly useful after:

• Migration
• Domain changes
• Server changes
• Plugin changes
• Changes to custom post types

Elementor also recommends flushing permalinks as part of its troubleshooting process for certain editor and preview problems.

18. Check File and Folder Permissions

Incorrect file permissions can prevent WordPress or Elementor from reading or writing required files.

A common WordPress configuration is:

• Directories: 755
• Files: 644

The exact permissions depend on the hosting environment, so do not blindly change every file on the server.

If Elementor’s generated files cannot be created, read, or updated correctly, the editor may behave unexpectedly.

Check hosting logs and filesystem permissions if you see errors involving missing or inaccessible Elementor files.

19. Check WordPress Debug Logs

If the problem continues, enable WordPress debugging temporarily.

In wp-config.php:

define( 'WP_DEBUG', true );
define( 'WP_DEBUG_LOG', true );
define( 'WP_DEBUG_DISPLAY', false );

Then try opening Elementor again.

After reproducing the problem, check:

/wp-content/debug.log

Look for:

• Fatal errors
• PHP warnings
• Uncaught exceptions
• Plugin names
• Theme file paths
• Elementor file paths
• Memory exhaustion
• Undefined functions
• Deprecated functions

A fatal error pointing directly to a plugin file is a much stronger lead than simply knowing that Elementor is loading indefinitely.

WordPress debugging is also useful for broader troubleshooting, especially when a website starts behaving differently after an update.

20. Check the Hosting Error Logs

WordPress’s debug log does not always contain the complete story.

Your hosting provider may also have:

• PHP error logs
• Apache logs
• Nginx logs
• ModSecurity logs
• Firewall logs
• Resource usage logs
• Request logs

If Elementor produces a 500 or 503 response, check the server logs at the exact time you reproduce the problem.

For example, you may discover:

PHP Fatal error
Allowed memory size exhausted

or:

upstream timed out

or a security rule blocking the request.

That information immediately narrows the investigation.

21. Check Whether Only Large Elementor Pages Fail

Sometimes Elementor works perfectly on small pages but fails on a large page.

This can happen when the page contains:

• Hundreds of widgets
• Many nested containers
• Large amounts of dynamic content
• Complex loops
• Multiple third-party widgets
• Custom code
• Large inline CSS
• Heavy queries
• Numerous responsive settings
• Complex WooCommerce elements

If a small test page loads but a very large page does not, compare the two rather than treating them as the same problem.

The issue may be resource consumption rather than a general Elementor installation problem.

22. Check Custom Code and Code Snippets

Custom code can break Elementor without producing an obvious WordPress error on the frontend.

Investigate:

• functions.php
• Code Snippets plugins
• Custom JavaScript
• Custom Elementor widgets
• Custom REST API endpoints
• Custom AJAX handlers
• Theme-specific Elementor integrations
• Header scripts
• Footer scripts

If the problem began after adding custom code, temporarily remove or disable the relevant code and test again.

Be especially careful with JavaScript that runs globally in the WordPress admin area.

A script intended for the frontend can accidentally execute inside the Elementor editor and interfere with its interface.

23. Check for a Plugin or Theme Update That Started the Problem

If Elementor worked yesterday and stopped working immediately after an update, that timing matters.

Check recently updated:

• Elementor
• Elementor Pro
• WordPress
• Theme
• Elementor addons
• Optimization plugins
• Security plugins
• WooCommerce

Do not automatically roll everything back.

First identify which update corresponds with the beginning of the problem.

If necessary, test the previous version in a staging environment.

For important production websites, a staging environment is much safer for compatibility testing than repeatedly changing versions on the live site.

You can also use our guide on How to Safely Update & Test WordPress Websites Using Staging Environments before making major compatibility changes.

24. Do Not Forget Elementor Pro Compatibility

If you use Elementor Pro, make sure Elementor and Elementor Pro versions are compatible and both are updated appropriately.

Running mismatched versions can create unexpected editor behavior.

For example:

• Elementor updated but Elementor Pro remains outdated.
• Elementor Pro updated before the free Elementor plugin.
• WordPress updated while Elementor remains on an old release.
• A third-party addon has not yet caught up with a newer Elementor release.

Before troubleshooting deeper server problems, verify that the core components are not simply out of sync.

25. Reinstall Elementor Only After Diagnosing the Problem

Reinstalling Elementor is sometimes useful, but it should not be your first troubleshooting step.

If the actual cause is:

• A plugin conflict
• A server firewall
• Low memory
• Broken JavaScript
• Cloudflare optimization
• Incorrect URLs
• PHP errors

then reinstalling Elementor will not fix the underlying problem.

If you have evidence that Elementor’s files are incomplete or corrupted, reinstalling a clean copy can make sense.

Always maintain a current backup before doing so.

26. Elementor Works in Safe Mode but Not Normally: What This Tells You

This is one of the most useful diagnostic results.

If:

Safe Mode = works

Normal mode = does not work

then focus on:

• Plugins
• Theme
• Custom code
• Elementor addons
• JavaScript

Start with the most recently installed or updated components.

You do not need to change hosting immediately.

27. Elementor Does Not Work Even in Safe Mode: What to Check

If:

Safe Mode = does not work

then focus on:

• PHP memory
• PHP/server errors
• WordPress URLs
• REST/AJAX requests
• Browser console
• Network requests
• CDN configuration
• Security/firewall rules
• Permalinks
• File permissions
• Hosting restrictions

This distinction can save a lot of time.

There is little value in repeatedly deactivating plugins if Safe Mode has already shown that the problem is deeper than normal plugin/theme interference. Elementor’s own documentation recommends moving toward server, configuration, and browser/network diagnostics when Safe Mode does not resolve the issue.

28. Elementor Is Loading but the Editor Panel Is Blank

A blank or partially loaded Elementor interface can be slightly different from a completely frozen editor.

Check:

• Browser console
• JavaScript errors
• Plugin conflicts
• Third-party Elementor addons
• Memory
• Optimization plugins
• Theme scripts
• Elementor-generated files

If only certain widgets fail to appear, investigate the addon or widget rather than the entire Elementor editor.

For example, if Elementor works normally until a specific third-party widget is added to the page, that widget becomes the primary suspect.

29. Elementor Shows “Preview Could Not Be Loaded”

This is related but not identical to an editor that never loads.

The Elementor editor may open, but the live preview iframe fails.

Common areas to investigate include:

• Plugin/theme conflicts
• Memory limits
• Permalinks
• Security rules
• Cloudflare Rocket Loader
• Server configuration
• File permissions
• Incorrect URLs

Elementor’s documentation specifically identifies these categories for the “Preview Could Not Be Loaded” problem.

30. A Practical Troubleshooting Order

Instead of trying random fixes, use this sequence:

Step 1: Test another browser

Use an incognito window.

Step 2: Test another Elementor page

Determine whether the issue affects one page or the entire site.

Step 3: Enable Safe Mode

This separates plugin/theme problems from deeper problems.

Step 4: Regenerate Elementor files and data

Then clear relevant caches.

Step 5: Check memory

Verify the actual PHP and WordPress memory limits.

Step 6: Check browser errors

Look at Console and Network.

Step 7: Check AJAX and REST requests

Look for failed 403, 404, 500, 502, or 503 responses.

Step 8: Test plugins

If Safe Mode works, isolate the conflicting plugin.

Step 9: Test the theme

Switch temporarily to a default or Hello Elementor theme.

Step 10: Check CDN and security

Investigate Cloudflare, WAF, ModSecurity, and optimization rules.

Step 11: Check logs

Review debug.log and server logs.

Step 12: Investigate the hosting environment

If the problem remains, ask the hosting provider to check PHP errors, resource limits, firewall blocks, and timeouts.

This order is much more efficient than randomly changing multiple settings at once.

Common Mistakes When Trying to Fix Elementor Loading Problems

Increasing memory without checking the actual server limit

Setting WP_MEMORY_LIMIT to 512M does not guarantee that PHP can actually use 512M.

Disabling every plugin permanently

Plugin conflicts should be isolated, not solved by leaving half the website disabled.

Disabling security completely

If a firewall is blocking Elementor, identify the specific request or rule rather than removing all protection.

Changing multiple settings at once

If you change five things and Elementor starts working, you still do not know what caused the problem.

Reinstalling WordPress unnecessarily

An Elementor loading issue rarely justifies reinstalling the entire WordPress installation.

Ignoring the browser console

A single JavaScript error can sometimes explain the entire problem.

Assuming every loading issue is caused by Elementor

The editor is often only the component displaying the symptom.

The actual problem may be PHP, hosting, JavaScript, a plugin, a firewall, or a failed request.

How to Prevent Elementor Loading Problems

You cannot prevent every compatibility issue, but you can reduce the likelihood of them occurring.

Keep WordPress, Elementor, Elementor Pro, themes, and important plugins reasonably up to date.

Before major updates, use staging whenever possible.

Avoid installing unnecessary Elementor addon packs.

Monitor PHP memory and hosting resources.

Be careful with aggressive JavaScript optimization.

Keep backups.

Test custom code before deploying it globally.

Monitor error logs when introducing major functionality.

And when something breaks, identify the change that happened immediately before the problem appeared.

Elementor Stuck on Loading: Quick Checklist

If you need a short checklist, work through these steps:

• Test Elementor in an incognito window.
• Try another page.
• Enable Elementor Safe Mode.
• Regenerate Elementor files and data.
• Clear browser, plugin, server, and CDN caches.
• Check WordPress and Site URLs.
• Check PHP memory.
• Check PHP/server limits.
• Inspect the browser Console.
• Inspect failed Network requests.
• Test AJAX and REST API requests.
• Disable JavaScript optimization temporarily.
• Check Cloudflare Rocket Loader.
• Check security plugins and ModSecurity.
• Flush WordPress permalinks.
• Test with a default theme.
• Isolate plugin conflicts.
• Review wp-content/debug.log.
• Review hosting error logs.
• Check recent plugin, theme, Elementor, and WordPress updates.
• Contact the hosting provider if server-level errors remain.

Final Thoughts

When Elementor gets stuck on loading, the fastest solution is usually not to reinstall everything or randomly increase server limits.

The important part is determining where the failure occurs.

If Safe Mode fixes the problem, investigate plugins, themes, and custom code.

If Safe Mode does not help, investigate memory, server configuration, URLs, JavaScript, AJAX, REST API requests, security rules, caching, and hosting.

The browser’s Console and Network tabs can often tell you exactly which request is failing, while WordPress and server logs can reveal PHP and hosting-level problems that are invisible from the Elementor interface.

Once you identify the failed component, the solution is usually much more straightforward.

Written by Nemanja Stosic

WordPress Developer & Website Optimization Specialist

Nemanja has worked on more than 200 websites and focuses on WordPress development, performance optimization, SEO, security, WooCommerce, and practical website improvements.

For a deeper guide covering WordPress development, performance, security, SEO, WooCommerce, and troubleshooting, check out the WP Flow Mastery WordPress eBook.