If you love building websites with Divi, you’re not alone. The drag-and-drop builder makes designing pages fun and easy! But if you’re aiming for lightning-fast load times, you’ve probably heard about WP Rocket. It’s one of the best caching plugins out there for WordPress.
Now, you might be wondering…
Can Divi and WP Rocket work together? The answer is a big YES — but with a few things to keep in mind. In this guide, we’ll show you how to make both tools play nicely.
What Is Divi?
Divi is a WordPress theme and visual page builder created by Elegant Themes. It’s super popular because it lets you:
- Design pages without coding.
- Use pre-made layouts.
- Edit everything using drag-and-drop tools.
It lets you build just about anything with ease. But with great power comes… a bit more code. That means sites built with Divi might be a little slower if you don’t optimize them.</
What Is WP Rocket?
WP Rocket is a premium caching plugin that speeds up your website. It works by:
- Caching pages and files.
- Minifying CSS, JavaScript, and HTML code.
- Delaying JavaScript loading.
- Preloading resources before users need them.
It’s powerful, automatic, and doesn’t require a tech degree to use.
Why Use WP Rocket With Divi?
Divi can slow things down a bit because of its powerful builder features. WP Rocket can fix that by improving load time and performance.
When used together, they can help you get faster page loads AND beautiful designs. Win-win!
But here’s the catch: Some WP Rocket settings can mess with Divi’s functionality. That doesn’t mean you can’t use them together — just that you need to be smart about it.
Getting Started – Install Both Plugins
Before you dive into settings, you need to install both tools.
- Install and activate your Divi theme from Elegant Themes.
- Install WP Rocket by uploading the plugin and activating it.
Once they’re set up, it’s time to tweak things so they play together properly.
Essential WP Rocket Settings for Divi Users
1. File Optimization
This feature helps remove extra spaces and code from your files. But it can sometimes break your design when using Divi.
What to do:
- Go to WP Rocket > File Optimization.
- Enable Minify CSS files — test your site thoroughly afterward.
- Try enabling Minify JavaScript files. If something breaks, disable this option.
- Be cautious with Combine CSS/JS files. Divi’s builder doesn’t always like this.
2. Delay JavaScript Execution
This is a great speed booster. It delays non-essential scripts until the user takes action on the page.
But be careful. It could interfere with Divi modules like sliders and animations.
Best practice: Turn it on, but exclude key Divi scripts.
You can find Divi-related scripts by looking for files containing divi, et_builder, or elegantthemes.
3. LazyLoad
LazyLoad delays image loading until they’re about to be seen. This can really improve load times!
Recommended settings:
- Enable LazyLoad for images and iframes.
- Don’t apply LazyLoad to background images in Divi if you see layout issues.
Test your image-heavy pages thoroughly!
4. CDN Integration
If you use a CDN (Content Delivery Network), WP Rocket can help integrate it. This is optional but great for global visitors.
CDNs speed things up by loading resources from servers near your visitors. That means faster page loads no matter where they are!
Divi Builder Issues to Watch For
Sometimes, WP Rocket’s optimizations affect how the Divi Builder loads. If you notice your builder acting weird, here’s what to do:
- Clear the cache after every change.
- Disable optimization settings one by one to see which causes issues.
- Temporarily turn off WP Rocket to make sure it’s the problem.
Most issues can be fixed by excluding a file or disabling one feature at a time.
Performance Testing
Once everything is set up, use testing tools to see your improvements.
Try these free tools:
Test your homepage, blog posts, and any other major pages.
Tips to Keep Things Smooth
- Always back up your site before tweaking settings.
- Clear your cache after enabling or disabling features.
- Use staging sites for tests instead of your live site.
- Keep everything updated — themes, plugins, and WordPress itself.
Helpful Exclusions for WP Rocket
If something isn’t working right, you can tell WP Rocket to ignore certain files.
Here are some Divi files you might want to exclude:
/wp-content/themes/Divi/js/custom.js /wp-content/themes/Divi/core/admin/js/recaptcha.js /wp-content/themes/Divi/core/admin/js/common.js
Put these in WP Rocket’s exclusion settings under File Optimization.
When to Contact Support
If you’re still running into problems, don’t stress.
- Reach out to WP Rocket support.
- Or contact Elegant Themes support.
Both are super helpful and used to these types of questions.
Final Thoughts
Using Divi with WP Rocket is like peanut butter and jelly — great on their own, but even better together.
Just remember:
- Start slow. One setting at a time.
- Test your site often.
- Don’t be afraid to ask for help.
With some care and testing, your site will be fast AND fabulous!
