Customizing The Fields in a Contact Form

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

1. Hover over the contact form and click on the "gear" to access its settings:
2. In the Layout tab press Add field and select the fields you'd like to show in the form — email, date, check box, etc:
3. To access the settings of the field, click on the "gear" next to it:
4. To change the name that will be displayed above the field itself, change the text in the very first line of the settings:
5. 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:
6. 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:
7. To make the field required, enable the Make this field required option. After that, an asterisk should appear near the field's name:
8. 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 article Creating a password-protected page.

9. 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.
10. 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.
11. To set value from a URL parameter, add a UTM tag to the appropriate field.
Tip: The article Collecting UTM values with a hidden field in a contact form will help you to understand how to use hidden fields and configure UTM tags.

12. To remove a field from the form, click on the trash can icon next to it:
13. 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 article Actions of a contact form when it is submitted.


    • Related Articles

    • Customizing the Style of a Contact Form

      The contact form that you add gets adjusted automatically to the overall site style. If you're not happy with the way it looks, you can always change the style of the button and the form fields. Tip: To set a contact form on your site, check the ...
    • Adding a Contact/ Lead Generation Form

      The contact (also lead generation, call-to-action) forms serve as a way of getting in touch with the business owner right through the site — for support, sales questions or for inquiries in general. With the help of contact forms, you can collect ...
    • Accessing Contact Form Replies

      With the help of the form replies feature you don’t need to worry anymore if submits from your contact forms might be lost or the integration may not go successful. Form replies feature gathers all replies from the contact forms on your website in ...
    • Using hidden fields in forms to collect additional data

      Hidden fields in contact forms allow website owners to collect and transfer additional information to third-party services, thus helping to segment users who have filled out this form. Hidden fields can transfer both set values and values obtained ...
    • Adding an exact value to a field in the contact form

      You can add a specific field to the contact form that will force the visitor to enter the exact value. This feature can be useful for various purposes — for example, to create your own anti-spam, conduct basic polls, or even protect a page with the ...