All Collections
Page Builder
Builder Components
All you need to know about the Form module for the landing page
All you need to know about the Form module for the landing page

In this article, we have explained in detail regarding how you can set up a form and customise it

siddarth avatar
Written by siddarth
Updated over a week ago

A form on a landing page is crucial for capturing visitor information, facilitating lead generation, and driving conversions.

Ultimately, a form on a landing page plays a critical role in converting visitors into leads or customers, while also gathering valuable information that can improve future marketing efforts.

Let us learn in detail about the form module:

First, let us learn how to add a form module to the page.

Adding a Form module on the page:

Method 1: USING THE '+' ICON


A ‘+’ icon will appear on the top and bottom of any module as you hover around the region on the right panel.

When you click on that '+' icon, you will see the modules tab open up on the left panel.

You will a module named 'Form' on the Modules tab. Click on that and it will automatically be added to the page.

Here is how you can do it. Please see the video below

Method 2: Drag and Drop the form module

You can simply drag the form module from the left panel and drop it wherever you want on the right panel.

As you drag the form module on the right panel, a blue border will be visible on the right panel indicating all possible drop targets.

Here is how you can do it. Please see the video below

How to add different form fields on the Form module:

Click once on the form module. This will open up the settings of the respective form on the left panel.

Under the steps tab, you will find the 'Add Fields' button.

Once you click on 'Add fields', you will see the list of different form fields available on the left panel.

Click on the desired form field and it will be added to the form.

Here is how this is done. Please see the video below

Customising the Form:

Editing Field fields:

To edit the form fields, double-click on the respective field in the Tree View.

Under the form field settings, you will find the options to change the form labels and placeholder text.

You can also add a REGEX pattern for the form field.

Here is how you can do it. Please see the video below

There are different types of form fields that you can choose to add to the Form.

Here is the list of different Form fields available:

  • Name fields: There are three name fields that can be added to the Form, namely First Name, Last Name and Full Name fields.

  • Phone field: This can be used to get the contact number of the user.

  • Email field: This can be used to get the Email of the user.

  • Short text field: A short text field in the form designed for limited, succinct input or responses.

  • Long text field: A spacious form field in the form designed for detailed, extended text input.

  • Date field: A designated field in the form for selecting or inputting a specific date.

  • Number Input field: A field in the form specifically designed for adding numeric values or quantities.

  • Single option field: A field in the form where only one choice can be selected from the provided options.

  • Multiple option field: A field in the form that allows the selection of multiple choices from the provided options.

  • Range Slider field: A field in the form enabling users to select a value by sliding within a predefined range.

  • Drop-down field: A field in the form with a list of options that expands when clicked, allowing a single selection

  • Country field: A field in the form designed for selecting a specific country from a list or dropdown.

  • Toggle field: A switch-like field in the form that allows users to toggle between two states, typically 'on' and 'off'.

Styling the form fields:

Click on the Styling Tab of the form module in the left panel.

The option to change the Alignment, Colors and Typography of the various elements of the form module can be found here.

Submission settings of the Form module:

Form Submission action can be edited in the Submission settings tab.

You can make two actions happen after the form submission is done namely redirection and download of lead magnet.

Under the 'submission type' setting, you will find 2 options.

  1. Redirect

  2. Lead Magnet

Redirect:

If you select redirect, the user will be redirected to the provided external URL after the form submission.

Once you select redirect, you will have also to add an external URL where you wish to send the users after form submission.

The URL must be added in the Redirect URL field. Please see the screenshot below.

Lead magnet:

If you select the lead magnet option, the lead magnet file will be shared with the user after the form submission.

To learn how to add a file as a lead magnet, click here

Leads Storage

The Leads from your form Submissions will be available in the dashboard under the leads tab.

To learn more about Lead storage, click here

To get notified through an email whenever there is a new lead sign-up, you have to set up the lead notification email option.

To learn how to enable the lead notification email option, click here

To send automated emails to your leads once they submit the form, you have set up what we call the Email-Autoresponder on the dashboard.

To learn how to set the email autoresponder, click here


To learn more about customising your landing page, click here



Did this answer your question?