Long forms can overwhelm your visitors, leading to abandoned pages and lost conversions. With multi-step forms, you can break a single long form into shorter, bite-sized steps presented one screen at a time.
By starting with low-commitment questions (the "foot-in-the-door" effect) and showing a clear progress bar, you significantly reduce the perceived effort for your visitors, driving much higher completion rates.
How to Create and Manage Steps
By default, all new forms start as a standard, single-step form. When you are ready to expand, you can easily add and organize your steps.
- Adding Steps: You can add a new step in two ways:
- Open the Step Management Drawer in the menu.
- Click the "+ Step" button located after or between your existing steps.
- Tracking Your Steps: The step dropdown menu in the editor will automatically update to show your total count and precisely which step you are currently editing (e.g., Step 2 of 4).
- Moving Steps: Want to change the order? You can use the arrow keys to rearrange your steps and the fields they contain.
- Deleting Steps: You can delete any step unless it is the very last one remaining. All forms require at least one step. If you delete a step, you can delete its questions or move them to the adjacent step (if you are on the first step, they will move to the second; otherwise, they default to the previous step).
- Adding Questions: You can add fields to specific steps in two ways:
- Selecting a step, and clicking on fields that you would like to add. Steps can be selected using the dropdown menu or by simply scrolling to the step.
- Drag and drop a field directly into the desired step.
Designing and Styling Your Form
You have full control over how each step looks and feels to your visitors. Click on any element to change its properties, text, or styling.
Next, Previous, and Submit Buttons
- The Submit Button: The final Submit button only appears on the very last step of your form. You can position and style it independently—its styling will not affect your Next or Previous buttons.
- Next & Previous CTAs: These navigation buttons are treated as a single, unified element across your entire form. To ensure visitors don't get stuck, Next and Previous buttons cannot be hidden or deleted.
Progress Indicators
Keep your visitors motivated! You can customize the size and color of the Progress Bar to match your brand, giving visitors a visual cue of how close they are to finishing.
How it Works for Visitors (Published Forms)
Once your form is live, the user experience is seamless:
- Step-by-Step Validation: When a visitor clicks "Next," the form instantly validates the fields on that specific page before letting them move forward. This prevents them from filling out the whole form only to get an error at the end.
- Dynamic Progress: The progress bar updates in real time as the visitor advances through the screens.
- Lead Generation: Once the final "Submit" button is clicked, all information from every step is compiled and instantly generates a lead in Unbounce.
Frequently Asked Questions:
Can I convert an existing single-step form into a multi-step form?
Yes. Open any existing form in the builder and use the + Step button or step management drawer to add steps. Your existing fields will remain on the original step.
Is there a limit to how many steps I can add?
No. You can add as many steps as your form requires.
Why am I missing the option to add a new step?
Multi-step forms are only available on our Build, Optimize and Concierge plans. If you are on the starter plan, this feature will not be supported.
What happens to my multi-step forms if I downgrade to the Starter plan?
Your existing multi-step forms will remain intact and continue to function. However, you will not be able to add new steps to any form until you upgrade to a paid plan.
Are Unbounce multi-step forms accessible, and do they support WCAG 2.1 AA requirements for my website visitors?
Yes! Our multi-step forms are designed from the ground up to ensure that all of your page visitors—including those who rely on assistive technologies—can complete your forms independently.
We support WCAG 2.1 AA requirements through several key built-in features:
- Full Keyboard Operability: Visitors can navigate seamlessly through every input field and trigger the "Next," "Previous," and "Submit" buttons using only a keyboard (via the Tab, Enter, and Spacebar keys) with a highly visible focus indicator showing exactly where they are on the page.
- Screen Reader & Error Friendly: If a visitor makes a mistake or misses a required field, the form instantly announces the error to screen readers and automatically jumps their cursor to the exact field that needs to be fixed, ensuring a smooth and frictionless conversion experience for everyone.