Caching Conflicts and Optimization Tips for Divi Engine Plugins

Caching is vital for performance, but when misconfigured, it can break styling, prevent AJAX calls, or conflict with Divi Engine plugin features like maps, sliders, filters, and galleries. This guide outlines recommended caching configurations and known issues specific to Divi Engine plugins.

warning

You must either use Divi Performance settings OR a Caching Plugin to optimize Divi. Using both to essentially re-process the same files or tasks will almost certainly break layouts or functionality on your site.

Common Issues and Quick Fixes

1. AJAX Features Losing Styling

• Symptoms: Styling disappears when using AJAX filter, load more, or custom loops.
• Fix: Disable the following under Divi > Theme Options > Performance:
  • Dynamic CSS
  • Dynamic Module Framework
  • Critical CSS

2. Map and Gallery on the Same Page Break

• Symptoms: Google Map and Gallery module conflict when placed together.
• Fix: Disable JavaScript and jQuery optimizations in Divi’s performance options.

3. Machine Gallery + Default Divi Mobile Menu Conflict

• Symptoms: Mobile menu doesn’t open or JavaScript errors appear when Machine Gallery is on the same page.
• Fix: Disable JS and jQuery optimization features under Divi performance settings.

4. Loop Layout Shows Thumbnail Twice

• Symptoms: In a loop layout using Divi Ajax Filter, Divi Machine or BodyCommerce, the post thumbnail image appears twice.
• Fix: Disable image Lazy Load in your caching or optimization plugin.

Server-Side Considerations

ModSecurity Blocking AJAX (Often LiteSpeed Cache)

Sometimes LiteSpeed Cache does not plat well with hosting platforms that enable ModSecurity by default.

• Fix: Ask your hosting provider to whitelist admin-ajax.php in ModSecurity rules.

Step-by-Step Optimization Guide

Step 1: Disable Problematic Divi Performance Features

Navigate to Divi > Theme Options > Performance. Turn OFF:

• Dynamic CSS
• Dynamic Icons
• Critical CSS

Step 2: WP Rocket Settings (if used)

Navigate to Settings > WP Rocket.

A. File Optimization

• Uncheck:
  • Minify CSS files
  • Combine CSS files
  • Optimize CSS delivery
• Or manually exclude:
  • /wp-content/themes/Divi/
  • /wp-content/plugins/divi-machine
  • /wp-content/plugins/divi-bodycommerce/
  • /wp-content/plugins/divi-ajax-filter/

B. Media > LazyLoad

• Disable LazyLoad for CSS background images.

Step 3: WP Fastest Cache Settings (if used)

Navigate to Settings > WP Fastest Cache.

A. CSS Options

• Uncheck:
  • Minify CSS
  • Combine CSS
• Or manually exclude:
  • /wp-content/themes/Divi/
  • /wp-content/plugins/divi-machine/
  • /wp-content/plugins/divi-bodycommerce/
  • /wp-content/plugins/divi-ajax-filter/

B. Other

• Turn OFF:
  • Render Blocking CSS
  • Lazy Load CSS background images

Step 4: Exclude Critical Files from Optimization

Below is a list of scripts and styles that should be excluded from minification, combination, or deferral depending on the issue you're experiencing. Use this table as a reference when troubleshooting broken styling, filters not working, sliders failing to load, or builder issues.

Divi Machine

File	Relative Path	When to Exclude
frontend-general.min.js	/wp-content/plugins/divi-machine/js/frontend-general.min.js	If filters or dynamic content in loop layouts break.
carousel.min.js	/wp-content/plugins/divi-machine/js/carousel.min.js	If the Gallery/Slider module fails to initialize.
carousel.min.css	/wp-content/plugins/divi-machine/css/carousel.min.css	If slider elements are unstyled or overlapping.
carousel-swiper.min.js	/wp-content/plugins/divi-machine/js/carousel-swiper.min.js	If slider is Swiper-based and fails to render.
carousel-swiper.min.css	/wp-content/plugins/divi-machine/css/carousel-swiper.min.css	For Swiper sliders, if styling looks incorrect.
style.min.css	/wp-content/plugins/divi-machine/styles/style.min.css	If global styling looks broken.
divi-filter.min.js	/wp-content/plugins/divi-machine/includes/modules/divi-ajax-filter/js/divi-filter.min.js	If filters do not respond or AJAX fails.
divi-filter-loadmore.min.js	/wp-content/plugins/divi-machine/includes/modules/divi-ajax-filter/js/divi-filter-loadmore.min.js	If "Load More" does not work properly.
masonry.min.js (handle: divi-filter-masonry-js)	/wp-content/plugins/divi-machine/includes/modules/divi-ajax-filter/js/masonry.min.js	If grid layouts misalign after filtering.
markerclusterer.min.js	/wp-content/plugins/divi-machine/includes/modules/divi-ajax-filter/js/markerclusterer.min.js	If Google Map markers fail to cluster.
ion.rangeSlider.min.js	/wp-content/plugins/divi-machine/includes/modules/divi-ajax-filter/js/ion.rangeSlider.min.js	If range/price sliders don’t respond.
ion.rangeSlider.min.css	/wp-content/plugins/divi-machine/includes/modules/divi-ajax-filter/css/ion.rangeSlider.min.css	If slider UI appears unstyled.
select2.min.js	/wp-content/plugins/divi-machine/includes/modules/divi-ajax-filter/js/select2.min.js	If dropdowns revert to basic HTML selects.
select2.min.css	/wp-content/plugins/divi-machine/includes/modules/divi-ajax-filter/css/select2.min.css	If Select2 styling fails.
style.min.css	/wp-content/plugins/divi-machine/includes/modules/divi-ajax-filter/styles/style.min.css	If AJAX filter layout breaks.

Divi Ajax Filter

File	Relative Path	When to Exclude
divi-filter.min.js	/wp-content/plugins/divi-ajax-filter/js/divi-filter.min.js	If filters do not respond or AJAX fails.
divi-filter-loadmore.min.js	/wp-content/plugins/divi-ajax-filter/js/divi-filter-loadmore.min.js	If "Load More" fails to load content.
masonry.min.js (handle: divi-filter-masonry-js)	/wp-content/plugins/divi-ajax-filter/js/masonry.min.js	If grid layouts misalign after filtering.
markerclusterer.min.js	/wp-content/plugins/divi-ajax-filter/js/markerclusterer.min.js	If clustered Google Map pins do not appear.
ion.rangeSlider.min.js	/wp-content/plugins/divi-ajax-filter/js/ion.rangeSlider.min.js	If range sliders are unresponsive.
ion.rangeSlider.min.css	/wp-content/plugins/divi-ajax-filter/css/ion.rangeSlider.min.css	If slider styling is broken.
select2.min.js	/wp-content/plugins/divi-ajax-filter/js/select2.min.js	If enhanced dropdowns stop working.
select2.min.css	/wp-content/plugins/divi-ajax-filter/css/select2.min.css	If Select2 elements are unstyled.
style.min.css	/wp-content/plugins/divi-ajax-filter/styles/style.min.css	If filtered results page layout breaks.

Divi BodyCommerce

File	Relative Path	When to Exclude
frontend-general.min.js	/wp-content/plugins/divi-bodycommerce/js/frontend-general.min.js	If mini-cart toggle or price updates stop working.
product-gallery.min.js	/wp-content/plugins/divi-bodycommerce/js/product-gallery.min.js	If gallery sliders or lightboxes fail.
add-to-cart-ajax.min.js	/wp-content/plugins/divi-bodycommerce/js/add-to-cart-ajax.min.js	If "Add to Cart" button does nothing.
add-to-cart-ajax-alter.min.js	/wp-content/plugins/divi-bodycommerce/js/add-to-cart-ajax-alter.min.js	Used as an alternative to above.
db-multi-checkout.min.js	/wp-content/plugins/divi-bodycommerce/js/db-multi-checkout.min.js	If multi-step checkout UI breaks.
venobox.css	/wp-content/plugins/divi-bodycommerce/css/venobox.css	If product lightbox styles break.
carousel.min.js	/wp-content/plugins/divi-bodycommerce/js/carousel.min.js	If carousel features do not initialize.
carousel.min.css	/wp-content/plugins/divi-bodycommerce/css/carousel.min.css	If carousel styling is missing.
minicart-ajax.min.js	/wp-content/plugins/divi-bodycommerce/js/minicart-ajax.min.js	If mini-cart does not update via AJAX.
style.min.css	/wp-content/plugins/divi-bodycommerce/css/style.min.css /wp-content/plugins/divi-bodycommerce/styles/style.min.css	If layout or styling on BodyCommerce pages looks broken.
divi-filter.min.js	/wp-content/plugins/divi-bodycommerce/includes/modules/divi-ajax-filter/js/divi-filter.min.js	For built-in filter functionality.
divi-filter-loadmore.min.js	/wp-content/plugins/divi-bodycommerce/includes/modules/divi-ajax-filter/js/divi-filter-loadmore.min.js	For "Load More" in filter modules.
masonry.min.js	/wp-content/plugins/divi-bodycommerce/includes/modules/divi-ajax-filter/js/masonry.min.js	If grid alignment breaks.
markerclusterer.min.js	/wp-content/plugins/divi-bodycommerce/includes/modules/divi-ajax-filter/js/markerclusterer.min.js	If Google Map clustering fails.
ion.rangeSlider.min.js	/wp-content/plugins/divi-bodycommerce/includes/modules/divi-ajax-filter/js/ion.rangeSlider.min.js	For range filters.
ion.rangeSlider.min.css	/wp-content/plugins/divi-bodycommerce/includes/modules/divi-ajax-filter/css/ion.rangeSlider.min.css	For range filter styling.
select2.min.js	/wp-content/plugins/divi-bodycommerce/includes/modules/divi-ajax-filter/js/select2.min.js	For enhanced select elements.
select2.min.css	/wp-content/plugins/divi-bodycommerce/includes/modules/divi-ajax-filter/css/select2.min.css	For select element styling.
style.min.css	/wp-content/plugins/divi-bodycommerce/includes/modules/divi-ajax-filter/styles/style.min.css	For filtered results UI layout.

Core Divi Theme

File	Relative Path	When to Exclude
style.min.css	/wp-content/themes/Divi/style.min.css	If global styling or layout spacing appears broken after enabling CSS optimization.

Core WordPress

File	Relative Path	When to Exclude
admin-ajax.php	/wp-admin/admin-ajax.php	If any AJAX-based features like filtering, add-to-cart, or form submissions fail unexpectedly (especially with ModSecurity).

Step 5: Avoid JavaScript Deferral (if UI Breaks)

In either caching plugin:

• Disable:
  • Defer JS
  • Combine JS
• Manually exclude all critical JS files listed above.

Step 6: Clear All Caches

1. Divi Static CSS:
   Go to Divi > Theme Options > Builder > Advanced > Click Clear.

2. WP Rocket / WP Fastest Cache:
   Use “Clear cache” and “Purge CDN” buttons.

3. Hosting Panel:
   Clear server-level cache (e.g., SiteGround, WP Engine, Cloudflare).

4. Browser Cache:
   Hard refresh (Ctrl + F5) or use incognito.

note

Always test your site in an incognito/private browser window after clearing all caches.

Best Practices for Divi Engine Users

• Only use one optimization layer, either Divi’s native performance or your caching plugin.
• During development, disable all caching layers to avoid false errors.
• Respect conditional asset loading by excluding the specified plugin scripts.
• Avoid “Delay JS” on any interactive or AJAX-related features such as filters, carousels, or add-to-cart actions.

Known Conflicts

Feature Combination	Problem	Recommended Fix
Ajax Filter + Dynamic CSS	Styling disappears	Disable Dynamic CSS
Map + Gallery on page	One module breaks	Disable JS Optimization
Gallery + Mobile Menu	Mobile menu fails	Disable Divi JS & jQuery options
ModSecurity Enabled	AJAX calls fail	Whitelist admin-ajax.php
BodyCommerce AJAX Cart	Add to cart doesn’t work	Exclude add-to-cart-ajax*.js
Multi-step Checkout not working	Buttons unresponsive	Exclude db-multi-checkout.min.js
Product Gallery/Lightbox broken	Slider not loading	Exclude product-gallery.min.js and venobox.css