Skip to main content

Quick start

Overview​

Create a repeating card layout that automatically loads posts or products using the Divi 5 Loop workflow, enhanced by Divi Loop Extender’s integrated query controls.

Prerequisites​

  • Divi Loop Extender installed, activated, and licensed.
  • Divi Theme or Divi Builder 5.0.0-public-beta or newer.
  • Sample posts or WooCommerce products containing featured images and titles.
  • Basic familiarity with the Divi 5 Visual Builder interface.

Enable the loop on the parent container in Divi 5 Enable the Loop in the parent container settings.

Step 1: Create the parent container​

  1. Open your target page in the Divi 5 Visual Builder.
  2. Add a new Container (Row or Section) that will hold the loop content.
  3. Select the parent container and open its settings.
  4. In the Content tab, expand the Loop accordion.
  5. Toggle Loop Element to On.
  6. Choose the Post Type you want to display, such as Posts or Products.

Your parent container now generates repeating items based on the selected post type.

Step 2: Design the loop item layout​

  1. Inside the parent container, add child modules to represent a single item in the loop.
    • Example: Image, Text, and Button modules for a post card layout.
  2. Assign Dynamic Content to each module:
    • Image → Featured Image
    • Text → Post Title
    • Button → Post Link
  3. Adjust design and spacing to style the repeating item layout.

Bind the card modules to dynamic content Bind child modules to dynamic post fields.

Step 3: Configure Loop Extender settings​

  1. Reopen the parent container settings and stay in the Loop accordion within the Content tab.
  2. Configure the integrated Loop Extender options, including:
    • Query Filters – target specific categories, tags, or custom taxonomies.
    • Post Status Filtering – include or exclude drafts, pending, or private posts.
    • Sorting and Order – sort results by date, title, or custom fields.
  3. Observe the live preview as you adjust these options to validate the query output.

Adjust Loop Extender settings in the Loop accordion Refine query and sorting directly inside the Loop accordion.

Step 4: Validate the loop​

  1. Save the page and exit the Visual Builder.
  2. View the page on the front end and confirm that the correct posts or products appear.
  3. Check that dynamic fields (titles, images, links) display correctly.
  4. Adjust query settings if results are missing or out of order.

Check the result on the frontend. Check the result on the frontend.

What's next?​