Layout and repeaters

With structure elements you bring order to your form: you group related fields, arrange them in columns or let a section repeat as often as needed.

Column layout (row)

A row arranges its child elements side by side instead of below one another. In the settings panel you choose the desired number of columns (e.g. 2 or 3). The contained fields are automatically distributed evenly.

This lets you place, for example, "Width" and "Height" compactly on one line.

For full control you can also assign an individual column CSS class (e.g. col-md-6) to single fields.

Field group

A field group combines several elements into a visually coherent block – optionally with a heading. Groups can be nested and are excellent for forming sections (e.g. "Dimensions", "Material", "Personalisation").

Another advantage: you can show or hide an entire group via a condition.

Repeatable section (repeater)

A repeater lets the customer fill in a section multiple times. A classic example: "Add another person" or "Add another engraving line".

• In the shop a plus button appears, with which the customer adds another instance, plus a remove button per instance.

• You can freely choose the label of the add button (translatable).

• Each instance contributes to the configuration – including price and formulas. This allows, for example, quantities or surcharges to be summed per repetition.

Structure in the element tree

Structure elements are containers: drag other elements into them via drag & drop. A typical hierarchy looks like this:

Field group "Dimensions"
 └─ Row (2 columns)
     ├─ Number "Width"
     └─ Number "Height"
Field group "Personalisation"
 └─ Repeater "Engraving line"
     └─ Text field "Text"

Tip: Start with the large sections (groups), create the rows inside them and fill them with the actual fields last. This keeps the tree clear.