Layouts and sections
Stack, two columns, tabs or a step-by-step wizard — and how sections decide what the member sees at once.
- Beginner
- 5 min read
- Applies to 2.0
Sections come first
A section is a named group of fields. Every layout except the plain stack uses them to decide what appears together, so name them for the member, not for you: Contact details, not Block 2.
The layout selector with the section list beneath it.
The four layouts
Stack
Everything in one column, in order. The right answer for a short form, and the one to start with.
Two columns
Fields sit side by side, in one of three ratios:
| Ratio | Effect |
|---|---|
1-1 | equal halves |
1-2 | narrow left, wide right |
2-1 | wide left, narrow right |
Use 1-2 or 2-1 when one column holds labels or a short input and the other
holds something that needs room, such as a textarea.
Tabs
Each section becomes a tab, and the member sees one at a time. Tabs can sit along the top, or down the left or right side.
Good for a Settings page where the sections are genuinely independent and somebody may want only one of them.
Wizard
Each section becomes a numbered step, with Previous and Next, and the final step submits.
Right for Onboarding, where you want everything filled in and the member has not seen the form before. Wrong for a Settings page, where making somebody walk through six steps to change one preference is a punishment.
Tabs and wizards both hide most of the form most of the time, which means a validation error can be on a panel the member is not looking at. Keep required fields early, and keep the steps short.
Labels you can change
- Submit label — the button's text. "Save changes" beats "Submit".
- Next label — the wizard's forward button.
Both are per flow, so the Onboarding wizard can say Continue while Settings says Save.
Previewing
The builder previews the layout as you work, with a mock submit button so you can see your label in place. What it cannot show you is the member's own data, so check the finished flow signed in as a test member before calling it done — particularly a wizard, where the step count changes how long the thing feels.
Something missing or out of date? Tell support.