This improves the user experience, increases form completion rates, and makes longer forms more digestible — especially on the Web Form interface.
In This Guide:
What Are Sections?
How to Switch from Pages to Sections
How to Edit Section Titles, Icons, and Colors
How Sections Appear in Web Forms
Example Use Case
What Are Sections?
Sections provide a more guided form-filling experience by:
Showing users an overview of the sections they need to complete
Displaying progress within required sections
Highlighting which parts of the form are optional
This is particularly useful for long or multi-step forms, like surveys, onboarding flows, or registration forms.
Changing Pages to Sections
To switch your form layout from Pages to Sections, follow these steps:
Open the form you want to edit
Click the Settings (⚙️) icon in the bottom right-hand corner of the Form Builder
In the popup window, scroll down to the Pages option
Click the dropdown and select Sections
Click Save at the bottom of the settings window
Your form will now be using Sections instead of Pages.
You’ll notice the “Page 1” tab at the top now displays a pencil icon, indicating it can be customized.
Editing Your Sections
Each section can be customized with:
A title (e.g., “Personal Info”)
An icon (e.g., 👤, 📍, 📝)
A color (to visually group or highlight)
To Edit a Section:
Click the pencil icon on the “Page 1” tab (or any section tab)
A popup will appear with customization options:
Title: Name your section clearly
Icon: Choose from a range of icons
Color: Pick a color that matches your theme or helps users navigate
Click Save to apply your changes
How Sections Display in Web Forms
Sections are visible to users only in the Web Form interface — not inside the Form Builder or on the Mobile App.
When a user opens a Web Form with Sections:
They'll see a Section Overview Screen
Each section will display its:
Title
Icon
Color
Status: “Required” or “Optional”
Progress bar (for required sections)
Required Sections:
Contain one or more form elements marked as required
Show a progress bar so users can track completion
Optional Sections:
No required fields
No progress bar shown
This helps users prioritize which sections they must complete to submit the form.
Example Use Case
Imagine you're building an employee onboarding form. Using sections, you can break it down like this:
Personal Information
Emergency Contacts
Tax Details
Equipment Checklist
Each section has its own icon and color, and the user can easily see what's left to complete — especially helpful for longer, more complex forms.
Summary
Sections provide a clear, modern way to guide users through a form
Customize each section with titles, icons, and colors
Users get visual feedback on their progress (Web Forms only)
Required vs. optional fields are clearly distinguished