Visual Loop & Form Builder
Turn any element into a repeating loop or a working form by filling in fields, no hand-typed Twig or attributes required.
Say you've built a single blog-post card and want it to repeat across your 6 latest posts, or you've laid out a contact section and want the "Send" button to actually submit somewhere. Normally that means writing a loop expression or adding form attributes by hand. Instead, select the element in the layer tree, mark it as a Loop or a Form, and a panel opens with plain fields for everything, it writes the real code for you, in place.
This is a visual front end for Loops and Turn Any Element Into a Form. Everything you set here is stored as ordinary Twig or data-atom-* attributes, still readable and editable by hand in the Code tab if you ever need to.
Use Cases
- A repeating blog post, product, or testimonial grid, built once as a single card, then looped across your latest content.
- A working contact or lead-gen form, save submissions, email yourself a copy, and forward the data to a CRM via webhook, all without touching Twig or form attributes.
- Client-friendly setup. Marking an element as a Loop or Form and filling in plain fields is safe for a less technical teammate to configure, the Code tab stays available if something needs hand-tuning later.
The Loop Panel
Example: "Show my 6 latest blog posts, 3 per row, newest first." Mark your card element as a Loop, set Show to Posts and How many to 6, and the panel writes the query for you.
The panel has two modes. Basic is the fields below, no code. Custom lets you write the loop's expression directly, for anything Basic can't express: multiple post types at once, matching any of several categories instead of just one, stacking more than one custom-field rule, or referencing the current post. If a loop was hand-written (in the Code tab, or imported) and uses something Basic's fields can't hold, the panel opens in Custom automatically rather than quietly rewriting it down to what Basic can express, and switching back to Basic warns you first if anything would be lost.
| You want to... | Field |
|---|---|
| Choose what to loop over | Show: Posts, Products, Terms / Categories, Users, or External API (JSON) |
| Name the item inside the loop | Item name (defaults to post, product, term, user, or item) |
| Limit to one post type | Post type (Posts source) |
| Limit to specific categories | In categories, a live search picker |
| Set how many show at once | How many |
| Control sort order | Order by / Order |
Narrowing it down (Posts and Products): skip a number of items first (offset), filter by publish status, pick specific items to include or exclude with a live search picker, filter to one author, and three checkboxes, exclude the current post, include sticky posts at the top, and avoid showing duplicates across multiple loops on the same page.
By date: any time, or the past day, week, month, year, or a custom range.
By a custom field: pick any meta key (ACF, Meta Box, or a native field), a comparison (=, !=, >, >=, <, <=, LIKE, IN, EXISTS, NOT EXISTS), and a value.
Terms source adds: a parent term ID, and a "skip terms with no posts" checkbox. Users source adds: role.
External API source takes a URL, an optional path for nested JSON, and a method (GET or POST), then reads fields with {{ item.field }} inside the loop. Responses cache for 5 minutes.
Pagination (Pro): None, Numbered (adds page links after the loop), or Load more (a button that loads more per click, with a configurable batch size), see Loops for how these render.
Empty state: an "If empty, show" message field, shown whenever the query returns nothing.
The Form Panel
Example: turn a laid-out contact section into a real form, save every submission, and email yourself a copy. Mark the section as a Form, every input, select, or textarea inside it is picked up automatically as a field, then set what happens on submit.
| You want to... | Setting |
|---|---|
| Store every submission | Save to database toggle, visible under Submissions |
| Get emailed when someone submits | Email a notification toggle, set a recipient and subject, with "More options" for From name, Reply-to, and CC |
| Send the data to Zapier, Make, or another service | Send to a webhook toggle, set the endpoint URL |
| Show a thank-you message | After submit → Show a message, with your own text |
| Send them somewhere else instead | After submit → Redirect to a URL |
Recipients and the webhook URL are stored securely server-side, never written into the page's HTML.
Submissions also appear in wp-admin → Atom Forms, and can be hooked into with uich_form_submitted for custom server-side handling, see Atom Form for the full picture.
Limitations
- Pagination is Pro-only. Free plans can loop and limit results, but Numbered and Load more pagination require Pro.
- External API responses cache for 5 minutes. A source that updates more often won't reflect changes until the cache expires.
- Complex expressions need Custom mode. Basic's fields can't express everything, multiple post types at once, matching several categories, or referencing the current post all require switching to Custom.