Skip to main content

Loop layout breaks after AJAX

Symptom

The first page load looks correct, but after a filter, Load More, or pagination AJAX update the loop looks broken: missing styles, collapsed cards, incomplete markup, or Theme Builder layout pieces that do not reappear.

Applies To

  • Archive Loop custom layouts and premade templates
  • Divi 5 Loop Builder layouts refreshed by Ajax Filter
  • Complex Theme Builder or nested module layouts

Likely Causes

  1. Standard layout rendering is too aggressive — Fast path drops or sanitizes markup that your layout needs.
  2. Custom loop template relies on scripts that do not re-init — Carousels, lightboxes, or third-party widgets need a JS re-init after AJAX.
  3. CSS scoped only to the first paint — Styles depend on wrappers that change after AJAX replaces loop HTML.

Fix

Step 1: Switch Layout Rendering Mode

  1. Go to Divi Engine → Divi Ajax Filter → Transient Caching.
  2. Set Layout Rendering Mode to Compatibility.
  3. Save, clear cache, and retest filtering. See Caching and performance.

Step 2: Retest with a premade template

  1. Temporarily switch the Archive Loop to a premade loop template.
  2. If premade works but your custom layout fails, simplify the custom layout or rebuild it with supported loop item modules.

Step 3: Re-initialize front-end scripts

If third-party widgets break only after AJAX:

  1. Hook divi_filter_completed and re-init the widget. See Developer hooks (JavaScript).
  2. Avoid duplicate initializations on the first page load.

Step 4: Check for console errors

  1. Open the browser console.
  2. Filter once and note any JavaScript errors.
  3. Disable conflicting plugins if errors point outside Divi Ajax Filter.

Verify

Apply several filters and use Load More or pagination. Loop cards should keep structure and styles consistent with the initial load.

Collect for Support

If the fix does not work, collect:

  • Layout Rendering Mode before and after the change
  • Whether you use premade templates, library layouts, or Loop Builder
  • Browser console errors after filtering
  • A link to a staging page that reproduces the break

What's Next