1. Help
  2. Features
  3. Multi-step forms

Creating Multi-Step Forms

Introduction

Multi-step forms are a great way to improve the user experience of your web forms. They are especially useful for long forms that collect a lot of data.

Each step of a form can contain multiple fields. For the end-user this provides a much better experience than a long form with many fields, or multi-step forms where each step contains only one field.

How to add steps to a form

To add a step to your form simply click on the Add Step button in the form editor. You can find the Add Step button at the end of the last step in your form, just before the default success message.

Adding a new step / page to a form
Adding steps to the form

This will add a new step at the end of the form. You can also re-order form steps using the Move step up and Move step down buttons. You can find these buttons on the top-right corner of each step.

Eager navigation

Multi-step forms have a feature called eager navigation. When the user fills out the last field on a particular step the form will automatically move to the next step. This improves the user experience.

Note that eager navigation only works when the last field is a choice-type field, like multiple choice, dropdown, or rating.

Using conditional logic

You can use conditional logic to make steps optional. This is done using the show steps action.

Example, we have a dog adoption application form. On the first step we ask the visitor if they have existing pets. If they answer yes, we will show the Existing Pets step of the form. If they answer no, we will skip the Existing Pets step.

This is done using a conditional logic step:

Creating conditional steps
Creating conditional steps

Note: Using conditional logic here doesn’t automatically take the user to that step. It simply makes certain steps hidden or visible. The user still has to follow the normal flow of the form.