Multistep Form
The Multistep Form module allows users to create multi-step forms that seamlessly integrate with HubSpot forms. This documentation provides step-by-step instructions on setting up and customizing the module.
Adding Form Fields:
To add form fields to each step of your multi-step form, follow these steps:
- Each step can contain multiple form groups, and each group can have up to 3 fields organized in 1, 2, or 3 column layouts.
- Configure each field by selecting the appropriate type such as Text, Email, Phone Number, Rich Text, Dropdown, Boolean, Checkboxes, Radio, or No Field (for display text only).
- Provide relevant information for each field, including a description, form property (matching a corresponding field on the HubSpot form), and optional settings like required or hidden (for conditional fields).
Set up HubSpot Form:
- Set up a HubSpot form and create fields that correspond to the fields in your multistep form.
- Ensure that the form property names in the multistep form match the form field names in HubSpot.
- Configure the thank you message or redirect page settings within HubSpot.
Conditional Logic
Apply conditional logic to fields to dynamically show or hide other fields based on user input. Use the following options for conditional logic: equal to, not equal to, greater than, less than, is empty, and is not empty. Enter the corresponding value to trigger the conditional display.
Intro Overlay
Utilize the Intro Overlay feature to create an engaging introduction page before users start filling out the form. Enable the "Show Intro Overlay" option and customize the content and styling fields to make a captivating first impression.
Exit Intent Form Submission
Enable this feature to automatically submit the form when a user intends to leave the page, as long as an email address has been entered. This ensures that valuable data is captured even if the user decides not to complete the entire form.
email field in the HubSpot Form should be required
If you add a hidden field called abandoned to the form, the submission data will include information indicating whether the form was abandoned or not.
Customization
The Multi-Step Form Integration module offers extensive customization options to match your branding and requirements. Customize the appearance and styles of the module in the Style tab, allowing you to tailor colors, fonts, and overall design to integrate seamlessly with your website theme.
