Articles on: Contact forms
This article is also available in:

Customizing the fields in a contact form

After you've added a contact form on your site, make sure you change the layout so your customers submit only the relevant info. Add and remove the fields in the form, make some of them mandatory — that is up to you.

Customizing the layout of a contact form



Hover over the contact form and click on the "gear" to access its settings:



In the Layout tab press Add field and select the fields you'd like to show in the form — email, date, check box, etc:



To access the settings of the field, click on the "gear" next to it:



To change the name that will be displayed above the field itself, change the text in the very first line of the settings:



In the fields with placeholders, you can add text that will be displayed in these placeholders and disappear when the user starts to type something:



In order to add a detailed description to the field, enable the Add field description option in the settings and enter the desired description in the line below:



To make the field required, enable the Make this field required option. After that, an asterisk should appear near the field's name:



When the Make this field requied option is enabled, the Exact value field appears. In this field you can set a password for your page.



Tip: For more information about adding and configuring a password-protected page, see the Creating a password-protected page article.

You can set a Default value in the appropriate field. This text will already be entered in the field when the form opens, but the site visitor can delete or change what was entered in the default field.



The Default value field can be used simultaneously with the Hidden field option. In this case, for example, you can name the form or specify other additional and important information for you.



To set value from a URL parameter, add a UTM tag to the appropriate field.



Tip: The Collecting UTM values with a hidden field in a contact form article will help you to understand how to use hidden fields and configure UTM tags.

For a field type Phone, you can also set a phone number mask, which is a template that helps you enter the number in the correct format.

To remove a field from the form, click on the trash can icon next to it:



You can also change the order of your fields in the form. For that, pick the field up by the handlers and drop in the necessary position:



Tip: Don't forget to set the actions of the contact form after filling it out according to the instructions in the Actions of a contact form when it is submitted article.

Updated on: 11/14/2024

Was this article helpful?

Share your feedback

Cancel

Thank you!