Get a free consultation
Home About Services Work Insights Blog

Elementor & Page Builder Help

Elementor Stuck on Loading Screen: Step-by-Step Troubleshooting

A practical, backup-first troubleshooting guide to fix Elementor when the editor stays on the loading screen. Follow safe steps, test on staging, and know when to hire help.

Ahmed Raza Rafaqat By Ahmed Raza Rafaqat
Ask ChatGPT Ask Claude Ask Gemini Ask Perplexity

elementor stuck on loading screen step-by-step troubleshooting — if the Elementor editor hangs on the loading spinner, this guide walks you through safe, prioritized checks you can run without risking content loss.

This article assumes you want to try safe fixes yourself but will also give clear stop points where you should use a staging site or contact a professional. If you want a full, backup-first Elementor workflow before you start troubleshooting, see the pillar guide linked below for broader context.

Table of contents

Quick Summary And Safety Checklist

Problem In One Sentence

The Elementor editor opens but gets stuck on the loading spinner and never reaches the editing UI.

Risk Level And What To Do First

Risk level: Medium. Most checks are low-risk, but you should always back up the site and test on staging before making changes that affect plugins, PHP settings, or the database.

Backup And Staging Checklist

  • Create a full backup: files and database.
  • Set up a staging site on your host or a local copy.
  • Confirm the backup is restorable by listing the backup file or running a test restore on staging.

What This Guide Will And Will Not Do

This guide gives safe, prioritized steps to diagnose and fix common causes: browser issues, plugin/theme conflicts, PHP limits, REST API and permission errors, Elementor cache, and large resource problems. It will not attempt risky live-database edits without telling you to stop first. If you see clear signs of malware, database corruption, or host-level firewall blocks, stop and get professional help.

First Checks You Can Do In Minutes

Clear Browser Cache And Try Another Browser Or Incognito

Start with the simplest checks. Clear your browser cache, disable extensions (especially ad blockers), and open Elementor in an incognito window or a different browser. If the editor loads, the issue is local to your browser or an extension.

Check For JavaScript Console Errors

Open the browser developer console (F12 or right-click > Inspect) and watch the console and network tabs while loading the editor. Look for JavaScript errors or 4xx/5xx network failures. These errors often point directly to the failing plugin, REST endpoint, or a CORS problem.

Confirm Elementor And WordPress System Requirements

Quickly check WordPress and Elementor version compatibility and minimum PHP version. If your site uses very old WordPress or PHP versions, upgrade on staging first. For a full, backup-first Elementor workflow refer to the pillar guide linked above for context on safely testing upgrades.

Quick Server Status And CDN Check

Temporarily pause any CDN (Cloudflare in Development Mode) and clear the CDN cache. Some CDN rules or WAF settings can block REST requests or admin-ajax and freeze the editor.

Identify Common Causes

Plugin Or Theme Conflicts

Other plugins or the active theme may enqueue scripts that break Elementor or block REST endpoints. Conflicts are the most frequent cause.

PHP Version Or Low PHP Resources

Insufficient memory_limit, low max_execution_time, or an incompatible PHP version can cause the editor to stall during backend processing.

REST API Or Server Permission Problems

Elementor relies on WordPress REST API for many editor tasks. Server rules, mod_security, bad permissions, or CORS can block REST requests and stop the editor from finishing loading.

Corrupted Elementor Files Or Cache

Corrupt plugin files, a bad update, or stale CSS/JS files cached on disk or by a caching plugin can prevent the editor from initializing.

Large Pages Or Slow Third-Party Requests

Pages with many widgets, heavy third-party scripts, or calls to remote APIs can take so long that the editor times out or appears stuck.

Step 1 — Backup And Put Site Into Staging

Create A Full Backup (Files And Database)

Use your host backup tool or a plugin such as UpdraftPlus or a host snapshot. Make sure the backup includes wp-content, the database, and any custom uploads. Store the backup offsite and note the file name and date.

Create A Staging Site Or Use A Local Copy

Most hosts offer a staging environment. If your host doesn't, create a local copy using LocalWP or a manual duplicate. Always run diagnostics on staging first so you do not disrupt the live site.

Confirm The Backup Can Be Restored

On staging, perform a test restore or at least verify that the backup files are accessible and the database export contains expected tables.

Step 2 — Test For Plugin And Theme Conflicts

Enable Elementor Safe Mode

Elementor Safe Mode runs Elementor without active theme and plugins for the current user. Use it first because it's quick and safe. If Safe Mode works, you likely have a conflict.

Deactivate All Nonessential Plugins On Staging

On staging, deactivate all plugins except Elementor and Elementor Pro. If the editor loads, reactivate plugins in small groups to find the conflict. Take notes: which plugin caused the break and the plugin version.

Switch To A Default Theme Temporarily

Temporarily switch to a default theme like Twenty Twenty-One on staging. If the editor loads, the active theme is causing the issue. Look for custom scripts in the theme's functions.php or header/footer files.

Reactivate Plugins One At A Time And Test

Reactivate plugins one at a time and test the editor after each activation. When the editor fails, you've found the likely culprit. If the plugin is essential, check for updates or contact the plugin author. You can also look for alternatives.

Step 3 — Check PHP, Memory, And Server Settings

Check PHP Version Compatibility

Confirm your PHP version matches Elementor and theme requirements. Upgrading PHP can break plugins if they use deprecated functions, so test upgrades on staging. For more on PHP compatibility testing, see the short guide on PHP versions linked below.

Read about PHP versions and safe testing if you need a workflow for changing PHP safely.

Increase PHP Memory Limit, Max Execution Time, And Upload Size

Common recommended minimums for complex page builders are:

  • memory_limit: at least 256M (increase to 512M if necessary)
  • max_execution_time: 120 seconds or higher
  • upload_max_filesize: at least 32M

Request these values from your host, or add them temporarily in php.ini or .user.ini on staging. Avoid making changes on live without a backup.

Related troubleshooting on server errors is available here: server error troubleshooting.

Look For Errors In Server Logs

Inspect PHP-FPM, nginx or Apache error logs for fatal errors or permission denials timed to when you load the editor. Errors here point to missing PHP modules, memory exhaustion, or file permission problems.

Ask Your Host About Mod_security Or Firewall Blocks

Hosts sometimes block REST requests with mod_security rules. Ask support to temporarily disable rules while you test on staging, or request whitelisting for admin-ajax.php and REST endpoints.

Step 4 — Fix REST API, File Permissions, And CORS

Test The REST API Endpoint

From your browser, open: yoursite.com/wp-json/ and yoursite.com/wp-json/wp/v2/pages (replace yoursite.com). You should get JSON responses. If you see 403/404 or an HTML login page, REST is blocked or redirected.

Check File And Folder Permissions

Typical permissions: files 644 and folders 755. Incorrect permissions can prevent WordPress from writing files (Elementor regenerates CSS files). Use your host file manager or SSH to check and fix permissions on wp-content/uploads and wp-content/plugins/elementor.

Review Server And Browser CORS Errors

Cross-origin resource sharing errors appear in the console as blocked requests. If you use a different admin domain or a proxy, ensure the server sends correct Access-Control-Allow-Origin headers or avoids cross-origin requests for admin endpoints.

Common Host Settings That Break REST Requests

Reverse proxies, aggressive caching of admin endpoints, and WAF rules often cause issues. Work with your host to ensure REST endpoints are excluded from caching and that admin paths are not blocked.

Step 5 — Clear And Regenerate Elementor Data

Regenerate Files And Data From Elementor Tools

In Elementor > Tools, use Regenerate CSS & Data and Sync Library. This rewrites CSS files Elementor stores and often fixes broken editor initialization due to stale or corrupt files.

Sync Library And Reimport Templates If Needed

If a template import failed, the editor can hang when trying to load missing assets. Sync the library and re-import necessary templates on staging.

Clear Plugin, Theme, And Server Caches

Clear caches from caching plugins, server-side caches, and CDNs. Also delete any object cache (Redis, Memcached) entries if possible. On staging, temporarily disable caching during tests.

Safely Reinstall Elementor Or Elementor Pro

On staging, delete and reinstall Elementor and Elementor Pro (deactivate, download fresh copies, reinstall). Keep backups. Reinstalling can fix corrupt plugin files when other steps fail.

Step 6 — Debugging Slow Or Large Pages

Use Browser Devtools To Find Slow Requests

Open the network tab and sort by longest requests. Identify third-party requests (fonts, analytics, external APIs) that take a long time. These can delay editor initialization.

Disable Third-Party Widgets And Fonts Temporarily

On staging, remove or disable widgets that rely on external APIs (booking widgets, external forms, live chat) and test the editor. Replace heavy fonts with system fonts while diagnosing.

Split Large Pages Into Smaller Sections For Editing

If a page has hundreds of widgets, split it into multiple pages or templates when possible and edit smaller sections separately. See the responsive guide for tips on breaking layouts into manageable sections.

Responsive editing strategies can help when pages are large or complex.

Consider Server-Side Caching Settings For Editor Requests

Ensure caching layers exclude /wp-admin/ and REST endpoints. Cached admin responses can cause inconsistent editor behavior.

When To Roll Back And How To Restore

Restore From Backup On Staging Or Live

If a troubleshooting step breaks the site, restore from the backup taken before changes. On staging, test restores first. On live, restore only if necessary and communicate downtime to stakeholders.

Document What You Changed Before Rolling Back

Keep a simple change log with timestamps and actions. This helps re-run safe steps after a restore and gives a clear report if you hand the issue to a professional.

Verify Editor Loads After Restore

After restoring, confirm the editor loads before reapplying any changes. If the editor still hangs after a restore, the issue likely lies outside your change set (host-level or external service).

When To Stop DIY And Hire A Professional

High-Risk Signs And Complex Root Causes

  • Server-level firewall or WAF blocking REST with no clear exception
  • Persistent database corruption or repeated failed restores
  • Evidence of malware or unauthorized changes
  • Errors in server logs referencing missing PHP modules or fatal errors you cannot safely fix

What Information To Gather For A Professional Diagnosis

Collect these items before contacting support: browser console logs, network request screenshots, exact error messages, server error log snippets, PHP version, memory_limit settings, and a list of recent plugin or PHP changes.

How Hi Ahmed Can Help And Next Steps

If you prefer a professional diagnosis or the issue is high-risk, request a quote or ask Ahmed to diagnose and fix the issue. Email: ahmed@studiosimpact.com or use the contact form to start: request a WordPress website quote.

Prevention And Maintenance Checklist

  • Always update and test on staging before applying to live.
  • Keep regular backups and test restores monthly.
  • Limit unnecessary plugins and third-party widgets; remove inactive plugins.
  • Monitor PHP errors and server logs for early signs of trouble.
  • Recommended server specs for Elementor-heavy sites: current PHP supported version, 256–512M memory, PHP-FPM with reasonable execution time, and a host that supports excluding admin requests from caching.

Appendix: Useful Commands, Tests, And Resources

Curl And Browser Tests For REST API

curl -I https://your-site.example.com/wp-json/

Expected: HTTP 200 and JSON headers. If you receive a redirect to a login page or HTTP 403/500, REST is blocked.

Example PHP Settings To Request From Your Host

memory_limit = 512M max_execution_time = 180 upload_max_filesize = 64M

How To Collect Browser Console Logs For Support

Open DevTools > Console, reproduce the issue, then right-click in the console and choose Save as to export logs. Also capture Network tab where you can export HAR files for deeper analysis.

Links To Elementor And WordPress Documentation

Refer to Elementor docs for Safe Mode and data regeneration and WordPress docs for REST API and debugging constants (WP_DEBUG, SCRIPT_DEBUG) when performing deeper diagnostics.

FAQ

Why is Elementor stuck on the loading screen?

Usually a blocked REST API call, a JavaScript error from another plugin or theme, insufficient PHP resources, or a caching/permission issue prevents the editor from finishing initialization.

What should I do first if Elementor won't load?

Back up your site, test in incognito or another browser, and enable Elementor Safe Mode. If the issue persists, move to staging and follow the conflict isolation steps in this guide.

Will I lose my content if I troubleshoot Elementor?

If you follow the backup-first approach and test on staging, you should not lose content. Always take a full backup before deactivating plugins or changing PHP settings.

How do I back up my site before trying fixes?

Use your host snapshot tool or a backup plugin to create a full backup of files and database. Verify the backup file exists and, if possible, run a test restore on staging.

Can a plugin cause Elementor to hang?

Yes. Plugin conflicts are common. Use Safe Mode and the deactivate/reactivate workflow on staging to isolate the conflicting plugin.

How do I check for JavaScript errors that stop Elementor?

Use the browser developer console (F12) and look for red error messages and blocked network requests when the editor loads. Those errors show which script or endpoint failed.

Will increasing PHP memory fix Elementor loading problems?

Sometimes. Low memory can cause backend processes to fail. Increase memory_limit on staging and test. If memory is the issue, increasing it will usually help.

What is Elementor Safe Mode and how do I use it?

Safe Mode lets you use the Elementor editor without active plugins or theme for your user. It is available from the admin bar when editing a page with Elementor and is a quick way to confirm conflicts.

How do I test the WordPress REST API for Elementor issues?

Open yoursite.com/wp-json/ and specific endpoints in a browser or use curl. Check for HTTP 200 JSON responses. If you get a redirect, 403, or 500, REST is blocked or failing.

When should I contact a developer instead of continuing DIY troubleshooting?

Stop DIY when you see host-level firewall blocks, persistent database errors, evidence of malware, or fatal server errors you cannot resolve. Gather logs and the diagnostics described above before contacting a developer.

Get Help

If you want a professional diagnosis or would rather not risk live changes, request a WordPress website quote or ask Ahmed to diagnose and fix your WordPress issue. Email: ahmed@studiosimpact.com or visit the contact section to get started: request a WordPress website quote.