Types of elements available with Form Builder
When you start using the Form Builder widget, you'll need to fill it with content using the available elements. This guide will explain what these elements are, their purposes, and how to use them effectively.
In this article
Form elements available with Form Builder
Form elements are the building blocks that allow you to construct your form. Our Form Builder offers four types of elements, each serving different functions and identified by unique colors. They are:
To get to the list of these elements, open your widget configurator and click Add Field on the Build Form tab:
Now, let's take a closer look at each type of element.
Inputs
These green-colored elements allows you to specify what information you need from your visitors. There are ten types of elements in this group:
- Short Text: For short text entries
- Long Text: For longer text entries and descriptions
- Email: To collect visitor email addresses
- Website: To collect visitor website URLs
- Phone: To collect visitor phone numbers
- Number: To collect numerical information
- Date: For getting any specific date from your visitors
- Time: For getting the exact time from your visitors
- File: For allowing users to attach files such as documents, images, or videos
- Hidden: For internal tracking (this field is invisible to users but visible to you when receiving form submissions)
Each of these types has additional settings for customization, such as adding specific text, making fields required, selecting width, or setting field visibility based on other field values:
Static text fields
This blue-colored group allows you to add text and other elements to specific locations in the widget:
- Label: Use it when you need to add text to grab visitors' attention
- Heading: Similar to the label but with larger text, useful for section headers
- Paragraph: Use it for adding plain text, including links, and bullet lists
These types also offer settings for customization, including text, width, and field visibility based on other field values:
Selects
This purple-colored group allows users to choose from multiple options:
- Choice: Use it for multiple choice options
- Image choice: Similar to Choice, but allows for image-based options
- Dropdown: For displaying options in a dropdown list
- Consent: Use this field if you need to get visitor consent
These elements also have additional settings for customizing the selection options:
Rating Scales
This yellow-colored group lets visitors rate your products or services:
- Star Scale: Use it if you want to receive ratings in stars
- Number Scale: Use it to get numerical ratings
- Thumb Scale: For thumbs-up or thumbs-down ratings
- Smiley Scale: For smiley face ratings
Each of these types provides settings to customize the field according to your preferences:
Creating a Multistep Form
If your form is too long, consider using the Multistep option available in our Form Builder:
A multistep form breaks a long form into multiple pieces, making it easier to fill out. It will help you collect your visitors' input through multiple steps that use different components.
For detailed instructions on how to create a multistep form, check out this article - Creating a multistep form with Form Builder widget š