The Tool Desk
Outbyte PC Repair FREEClear out junk files and repair common Windows errorsFree Scan →Outbyte Driver Updater FREEScan for outdated or missing drivers - takes under a minuteDriver Scan →Build a Divi blog loop in stages: use Divi AI Agent’s Ask mode to plan, then Build mode to create the page structure, repeating post card, and filters. Review the Visual Builder canvas after each stage and verify the loop query, dynamic fields, and filter target against your own site’s content.
What you’ll build
The workflow creates a filtered blog index with a hero area, a filter sidebar, and a grid of live posts. It uses Divi 5 Flexbox for the page and card layouts, Loop Builder for the repeating post card, and Loop Filter Modules for search, category, and author filtering, with Apply and Reset controls. These pieces work together: the loop supplies the posts, dynamic fields populate each card, and filters must target the correct loop.
Divi AI Agent works inside the Divi 5 Visual Builder and creates or edits native Divi content, rather than returning a static mockup. Its output remains editable. The official [Divi AI overview] describes creating layouts from written briefs, screenshots or mockups, public website URLs, and moodboards.
What you need before starting
- Divi 5 and an active Divi AI subscription are required, according to the [Divi AI Agents Help Center guide]. The same guide says Divi Pro includes Divi AI.
- If you plan to provide a website URL as a reference, it must be directly accessible and not behind a login, as explained in the [reference materials guide].
- Have a rough content and layout plan ready: which posts should appear, what each card should show, and which categories or authors readers should be able to filter.
Plan the loop with Ask mode
Open the page in the Divi 5 Visual Builder. Use Ask mode first if you need to discuss the layout, ask what a setting does, or understand the existing page. Ask mode can inspect the page and answer questions without changing the layout; Build mode is for making edits. The [mode guide] explains this distinction.
#1 Best Overall
Give the Agent a concrete reference if you have one: a written brief, screenshot or mockup, public page URL, or moodboard. For a fresh layout, describe the intended page hierarchy and how the filters relate to the results area. The more specific the desired structure and constraints, the easier it is to check whether the build matches the plan.
Build the page in focused stages
- Open the page: In WordPress, open the target page with the Divi 5 Visual Builder. Start a conversation with the Agent in the builder workspace.
- Ask for the skeleton and card layout: Switch to Build mode and request the page structure: hero, sidebar, and results area. Specify layout details that matter, such as the sidebar-to-results split, gaps, and color variables. The tutorial’s worked example uses Flexbox for both the page skeleton and cards.
- Ask for the loop and dynamic fields: In a separate, bounded request, have the Agent configure the Loop Builder and repeating post card. Specify the content the card should display, such as the post title or other fields your design requires, then inspect the dynamic field mapping.
- Add filtering: Request Loop Filter Modules for the search, category, and author controls, plus Apply and Reset controls. Make clear which loop the filters should affect.
- Review after each pass: Inspect the canvas before asking for another change. If one element is wrong, ask for a targeted refinement rather than layering a large new prompt over an unsatisfactory result.
The official [Agent capabilities guide] says the Agent can configure Loop Builder and dynamic content, including the loop content source, result order, and filters, and can create dynamic content tokens. That capability supports this workflow, but it does not remove the need to check how the loop is configured on your site.
Verify the loop and filters against your content
A visually correct card grid can still show the wrong posts or respond incorrectly to filters if its settings do not match your site. Inspect these three connections in the Visual Builder:
- Loop query: Confirm its content source and result order produce the posts you intend to show.
- Dynamic fields: Check that each card element is mapped to the right post data.
- Filter target: Confirm the search, category, and author controls target this Loop Builder instance.
If you import the tutorial’s Divi Library JSON layout, treat it as a starting layout—not as a guarantee that its query, field mappings, or filter target fit your site’s content model. The example itself is described in the [October 1, 2026 Elegant Themes tutorial].
Quick wins for a faster PC:
Fix the driver behind crashes, sound loss and screen glitchesFind Drivers →Repair Windows errors before they cause bigger problemsFix Now →Choose the right kind of change
Flexbox is the tutorial’s choice for arranging the page skeleton and cards; Divi’s layout options also include CSS Grid, which may suit a different structure. Keep requests small enough to review, and use the Visual Builder’s Undo if a build pass moves the design in the wrong direction.
Build mode can add, edit, move, clone, or delete elements and change settings. Some actions pause for approval. For broader WordPress site management, Elegant Themes marks many actions as destructive and requiring approval; see its [approvals and permissions guide]. Keep unrelated work in a separate conversation, use Rules for constraints you want to persist, and use Commands for repeated tasks.
Rank #4
Understand the agent-spend statement
The October 1, 2026 Elegant Themes tutorial says Divi AI membership includes $5 in complimentary agent spend each month, and that usage costs depend on the model and request. This is a vendor-published, time-sensitive statement—not an independent cost estimate or a guarantee of current terms. The onboarding guide discusses monthly AI Wallet funding without giving a numeric allowance, so check Elegant Themes’ current terms before purchasing or relying on a specific amount. The tutorial also says that the first time you use the Agent on a site, you need to sign in with your Elegant Themes account so the site can access and use your Divi AI credit balance.
Quick Recap
Product prices and availability are accurate as of the date/time indicated and are subject to change. Any price and availability information displayed on Amazon at the time of purchase will apply.
Recommended Free Tools
