Skip to content 
If you want to build a website using WordPress, you’ve probably heard about the drag-and-drop editor called Elementor.
It’s one of the most popular options out there. To put this in perspective, WordPress is used by 43.3% of all websites, and nearly one in ten (12.7%) of all websites use Elementor.
But as easy as Elementor Pro makes it to set up and manage your site, it can sometimes get stuck.
If you ever face the error “WooCommerce Elementor keeps spinning” you’re not alone. It’s a common glitch that may put a wrench in your store updates or configuration.
So, what do you do when you face this Elementor loading problem? Let’s find out.
Why Elementor Gets Stuck On Loading When Using WooCommerce
First, you need to understand what’s causing the problem. When Elementor and WooCommerce clash, you typically see issues like:
Elementor Stuck On Loading Screen
It’s one of the most common problems when you use Elementor Pro in WordPress. The editor never progresses beyond the spinning loader, preventing you from making any changes or updates.
Elementor Sidebar Not Loading
Sometimes, the editor loads, but not completely. The editing panel appears blank or disappears entirely, keeping you from work.
Elementor Shortcode Not Loading
The third most common error is when dynamic content or WooCommerce shortcodes fail to render inside the editor.
In addition to these, sometimes you may not be able to save the changes made in Elementor properly. It can disrupt your workflow and may lead to more complications.
But why does WooCommerce Elementor keep spinning or disappearing?
Depending on your WordPress version and website complexity, several factors can trigger the above issues. But it typically comes down to:
- Plugin conflicts or outdated software, which simply means incompatible versions of Elementor, WooCommerce, or other plugins clash with one another. This may cause any of the above Elementor loading problems.
- For example, JavaScript powers the live preview and drag-and-drop functionality inside Elementor. If WooCommerce or Elementor scripts fail to execute, often due to minification, caching, or outdated plugin code, the editor can freeze on the loading screen.
- Checking your browser’s console for red error messages is the quickest way to identify these script conflicts and narrow down the cause.
- Another common reason is server resource limits. Sometimes, low PHP memory or max execution time can lead to issues like Elementor shortcodes not loading.
- Occasionally, some WooCommerce modules, like cart fragments or AJAX scripts, may interfere with Elementor, resulting in loading issues.
8 Proven Hacks to Fix Elementor Pro Conflict with WooCommerce
Whether it’s module interference or memory issues, most Elementor loading problems can be fixed if you know what’s causing them.
As WooCommerce maintenance experts, we’ve faced these issues often, and drawing on our experience, here are a few solutions that work.
1. Clear Your Cache and Browser Cookies
Before you deep dive into the WooCommerce and Elementor conflict, know that most issues have simple fixes. One such quick, straightforward fix is clearing your site, plugin, and browser caches.
WooCommerce websites typically use cache plugins like WP Rocket or W3 Total Cache to boost loading speed by caching pages, posts, CSS, JavaScript, and other elements. It reduces server load and speeds up your online store.
But as your store grows, it gathers a lot of cache data, which may sometimes keep your WooCommerce Elementor spinning. Clearing your cache from the browser, plugins, and site can solve this problem immediately.
When Elementor fails to load, check your browser console first. Right-click on the page, select Inspect, and open the Console tab.
You can look for red error messages that indicate JavaScript conflicts. If the errors mention WooCommerce or a specific add-on, that plugin is likely the source of the problem.
Sometimes Elementor fails to load due to stale CSS files. Here’s how you can Regenerate CSS & Sync Library:
- Log in to your WordPress dashboard.
- Go to Elementor > Tools.
- Click on Regenerate CSS and Sync Library.
Now, clear your website, plugin, and browser cache. Clear the cookies as well, since stored data may block Elementor’s scripts from reloading correctly.
If the issue continues, try opening Elementor in an incognito or private browsing window. This removes any stored browser data that could interfere with loading.
2. Increase Your PHP Memory Limit
Elementor is resource-heavy, and when combined with WooCommerce, it requires more memory to run smoothly.
Many hosting accounts are limited to 128MB or less, which can be the reason your WooCommerce Elementor keeps spinning. The quick fix is to increase your memory to at least 256MB or higher.
There are two ways to increase memory:
- First, update your wp-config.php. Add this just before the “That’s all, stop editing!” line.
- After making changes, save the file, and check if the changes are effective.
- Second, use your hosting control panel to increase your PHP memory limits. Many hosting providers let you do this directly through cPanel, Plesk, or custom dashboards.
Refresh your website after increasing the PHP limit to see if Elementor loads properly. If you’re unsure how to do this, reach out to your WooCommerce development agency.
3. Update Elementor, WooCommerce, and Your Theme
Outdated plugins or themes are one of the biggest culprits if Elementor is stuck on loading. You must update your Elementor Pro, WooCommerce, and theme to help them work in sync.
If they aren’t updated to the latest versions, your editor may fail to load or display errors.
Make sure to:
- Update your WordPress core to the latest version to fix any bugs.
- Keep your Elementor Pro and WooCommerce up to date via the plugins page. Go to the WordPress Dashboard > Updates, and upgrade both to the latest versions.
- Upgrade your theme to avoid compatibility issues.
But before you update, backup your website and test the updates in a staging environment. Update your theme, WordPress core, WooCommerce, and Elementor Pro one by one in the staging, and check if the editor works as intended.
Doing this has two benefits:
- For one, upgrading and testing in the staging environment reduces the risk of broken layouts or checkout issues in your live site.
- Secondly, it prevents your live store from costly downtime and gives you time to fix any other issues.
Or, if the issue started after updating, you can roll back to a previous stable version. Go to Elementor → Tools → Version Control → Rollback.
Choose a stable version that worked before. For WooCommerce, you can use the WP Rollback plugin.
4. Check for Plugin Conflicts
If the Elementor sidebar is not loading or loads partly, you may want to check your plugins for potential conflicts.
To do this, turn off all plugins except Elementor and WooCommerce. Now, try opening Elementor.
A plugin conflict could be the reason if Elementor loads properly. Next, turn on each plugin one by one and test if Elementor loads as expected. It’ll help you find out which plugin conflicts with Elementor.
Once you know which plugin is responsible for the Elementor loading problem, you can:
- See if updates are available for the plugin.
- Adjust its settings to see if it lets Elementor work smoothly.
If the above options fail, replace it with a more Elementor-compatible plugin.
5. Disable Unused WooCommerce Features
WooCommerce is loaded with many features, which is one of the reasons why it’s sought after for building e-commerce stores.
But not all of them are necessary for your store, and keeping the unnecessary ones active can slow down your website. More importantly, it can lead to Elementor loading problems.
For instance, cart fragments constantly refresh the cart data on every page load. While useful for dynamic carts, they can slow down performance and keep WooCommerce Elementor spinning.
You can turn off any unnecessary WooCommerce features using optimization plugins like Perfmatters or Asset CleanUp, or code snippets.
Another option is to reach out to a reliable WooCommerce developer for technical support.
6. Turn On Safe Mode in Elementor
Elementor (both free and pro versions) comes with a safe mode that helps you identify which plugins or features are causing conflict.
Safe Mode temporarily disables your theme and plugins and loads only Elementor and WordPress core files. That makes it easier and safer for you to identify why the Elementor sidebar is not loading or keeps spinning.
Go to WordPress dashboard → Elementor → Tools → Safe Mode, and turn it on. After turning it on, you can open the drag-and-drop editor to see if it works properly.
- If Elementor works fine in Safe Mode, it’s your theme or a plugin. Switching to more Elementor-compatible add-ons and a theme can resolve this issue.
- The Elementor shortcode is still not loading, or the editor keeps spinning; the conflict could be server-related, such as low PHP memory or outdated settings.
This is an advanced solution, but it helps you identify the problem quickly and effectively.
7. Switch Temporarily to a Default Theme
Like most WooCommerce store owners, you want a theme built for speed and flexibility. But what if the theme itself is the reason your WooCommerce Elementor keeps spinning?
To test this, switch to the default theme temporarily. Open Elementor after switching to a default theme.
- If the Elementor loads without hiccups, your theme is the culprit. Sometimes, replacing it with a more compatible, well-supported, and customizable theme is a more practical long-term solution.
- The problem could come from one of your plugins, features, or even server settings if the editor still fails to load.
If you’re in doubt, speak with a skilled WooCommerce developer, which brings us to our next, and final fix.
8. Reach Out to the Experts
If your WooCommerce Elementor keeps spinning even after trying the above fixes, it’s time to call in the pros. You can reach out to the online WordPress community or contact tech support from WordPress.
If the issue is with WooCommerce, check their support forums for known conflicts.
Reach out to Elementor Pro support since you’re a paying customer. Provide them with the system info from Elementor → System Info.
In addition to this, feel free to share:
- Console errors from your browser’s developer tools.
- Debug logs from WordPress.
- A clear description of when the issue occurs (e.g., “Elementor sidebar not loading after updating WooCommerce”).
Alternatively, you can reach out to an agency offering WooCommerce maintenance services. Getting professional help resolves your issues quickly, saving time, money, and brand reputation.
Bonus Tips to Avoid Elementor Loading Issues in the Future
Once you debug your current conflict, you’ll want to focus on avoiding Elementor loading problems in the future, and proactive maintenance makes that happen.
That means you should:
1. Regularly Update Your Themes and Plugins
Outdated themes and plugins not only cause Elementor loading problems but also slow down your website and increase security risks.
Always update WordPress core, Elementor, WooCommerce, themes, and plugins to their latest versions. Test the updates in a staging environment before making them live.
2. Use Lightweight Themes Built for Elementor
Use a lightweight, customizable theme built for Elementor, like Hello Theme or Astra. These are optimized for speed, flexibility, and easy integration with Elementor.
3. Limit the Number of Add-Ons and Extensions
Feature-packed stores are tempting, but those extra widgets and add-ons can slow down your site.
Worse still, they may keep the WooCommerce Elementor spinning. So, it’s best to stick to the features you need, nothing more. Deactivate or remove the plugins, add-ons, or widgets you don’t need.
Frequently Asked Questions
Why does WooCommerce cause Elementor to keep spinning?
WooCommerce adds scripts and features like cart fragments that sometimes conflict with Elementor’s editor.
When these scripts overload resources or clash with Elementor’s code, the editor gets stuck on the loading screen.
How do I enable landing pages in Elementor without conflict?
Make sure Elementor Pro and WooCommerce are both updated. Use a lightweight theme and disable unnecessary WooCommerce features.
If issues persist, build your landing page in Elementor’s Safe Mode to confirm it’s not a plugin or theme conflict.
What should I do if the Elementor shortcode is not loading properly?
First, check if the shortcode works on a regular WordPress page. If it does, the problem is likely a plugin or theme conflict.
Deactivate add-ons one by one, and clear your cache to see if the shortcode loads correctly inside Elementor.
Can server settings impact Elementor loading performance?
Yes, low PHP memory (below 256MB), limited max execution time, or outdated PHP versions can stop Elementor from running smoothly. Increasing PHP memory and using a host optimized for WordPress can resolve these issues.
Does using a child theme affect Elementor’s editor loading?
A properly coded child theme won’t cause issues. However, if custom functions or outdated code are added, they may interfere with Elementor Pro.
Testing with a default theme helps confirm whether the child theme is the cause.
Keep Your WooCommerce and Elementor Pro Always in Sync
If your WooCommerce Elementor keeps spinning, you can’t update your site.
But the good news is that you can solve most of these issues by clearing cache, raising PHP memory, checking for plugin conflicts, and switching to a more compatible theme.
In the long run, keep your website updated and secure to avoid Elementor loading problems.
CoSpark is here to help you keep your site running at its best. We’re a WooCommerce agency with an excellent track record.
Our experts can help you with development, maintenance, and migration. Reach out and let’s get started.
