Form widget

Add a Form widget

To add a Form widget:

• Add the Form widget to the canvas. For details, see Add elements to a page.

By default, the widget creates a form with three fields – Name, Email and Message. 

We’re going to make a few changes to the form: 

• Rename the form
• Divide the Name field into First name and Last name
• Make sure users have to enter a valid email in the email field
• Add a note in the message field telling users we’d like their feedback.

Add another field

To add another field to the form:

1. In the panel, in the text box under Form Fields change the name of the form to “My Form”
2. In the panel, under the form name, click the Name field.
   

   Clicking the field brings up a number of settings. For more details about these settings, see Settings for the Form widget.
   
   

3. In the Label field, change the name of the field to “First Name”.
   Now we need to add a new field for the last name.
   There are two ways to add a new field:
   1. Click the copy icon to make an exact duplicate of an existing field.
   2. Click +Add Item to add a blank field.
   
   
   
4. Click the copy icon of the First Name field.
   
   

   In the panel, a new field appears under the First Name field. This is a duplicate of the First Name field.
   
   

5. In the panel, click the bottom First Name field.
   
6. In the Label section, rename the field, Last Name.
   

   We now have the correct fields, but it looks a little strange to have the first and last names on separate rows. Let’s make them a bit shorter and put them both on the same row.

Add multiple fields

To put multiple fields on the same row:

1. In the panel, click the First Name field.
   
2. Change the Column Width to 50%.
   
3. In the panel, click the Last Name field.
   
   The First Name and Last Name fields are now side by side.

Set the Field type

To set the field type:

Each field in the form has a type. The type can be used to limit the answers visitors can input. A common example of this is in the email field. By selecting email as the field type, visitors can only input valid email addresses. For more details about these types, see Settings for the Form widget.

In our form, the email field should default to the email type, but let’s double-check to make sure.

1. In the panel, click the Email field. 
   
   
2. In the Type section, make sure it’s set to email.

Edit the placeholder

To edit the placeholder:

The faded text inside the field is called the placeholder text. It can be used as instructional text, helping visitors know what to input in the field. In our example, we’ll add some instructional text to the Message field.

1. In the panel, click the Message field.
2. In the text area of the Placeholder section, enter, “Please send us any feedback, good or bad and include as many details as possible”
   
   The message area now includes information that will help visitors fill in the information you need.