Forms allow you to gather important information about your visitors and contacts. In HubSpot, you can easily create forms to add to your HubSpot pages or external site.
- In your HubSpot account, navigate to Marketing > Lead Capture > Forms.
- In the upper right, click Create form.
At the top of the form editor, click the pencil edit icon to edit the form name.
Add form fields
- In the left pane, search for form fields and add them to your form.
- Use the search bar too search for a field, or browse through your property groups. Drag and drop a field to the desired location on your form. Fields can be placed above, below, or next to other fields.
- You can also create new contact properties directly from the form by clicking Create new next to the search bar.
- By default, the Email field is required for form submissions to create contacts. Learn more about allowing form submissions without email addresses to create contacts.
Edit form fields
- To edit the display options of your form field, hover over the field and click the pencil icon.
- In the left pane, you can edit the following field options. The options you see may vary depending on the field property type:
- Label: the label that appears under the form field.
- Help text: add text beneath the field's label to help the visitor complete the field.
- Placeholder text: placeholder text for the form field. The text will disappear when the visitor enters a value in the field, and will not be submitted even if the visitor does not input a value.
- Default value: the value that will be placed in the form field by default. The value will be submitted unless the visitor changes the value.
- Field options: edit the form field options.
- Progressive field options: select the action to take if the field has been previously submitted. Learn more about progressive profiling in forms.
- Make this field required: make the field required for form submission.
- Make this field hidden: make the field hidden to pass certain values into contact properties.
You can also add rich text areas between form fields to add customizable text, create headers, or add spacing to your form.
Customize your form options
- After adding and editing your form fields, click the Options tab to customize the form options:
- What should happen after a visitor submits this form: choose to display a thank you message to your visitors or redirect them to another page after they submit the form.
- Follow-up options: select the Send submission email notifications to the contact's owner checkbox to automatically send a notification to the contact's owner.
- Send submission email notifications to: click the dropdown menu to select teams or individuals to send submission email notifications, regardless of contact ownership. Any recipients set here will be overwritten by recipients set in the form options on HubSpot landing pages.
- Form and error message language: select the language for default field labels and errors displayed to visitors who don't fill out the form correctly.
- Cookie tracking: HubSpot recognizes and tracks your contacts based on the cookies that are dropped in their browsers. In some situations, you may have multiple contacts filling out the same form on the same device (e.g., at a trade show). In these cases, you can disable cookie tracking so that each submission creates a new contact.
Cookie tracking is enabled by default. To disable cookie tracking, click to toggle the Cookie tracking switch off.
Please note: disabling cookie tracking will prevent analytics data from being recorded as part of the original contact submission. This option is designed for offline forms only. If a contact later reconverts organically with the same email address on a form with cookie tracking enabled, their cookie will be stored and historical analytics will be captured on their contact record.
- Pre-populate fields with known values: if a contact has previously visited your site and submitted a form (and HubSpot was able to store and track their cookies), any known field values can be pre-populated on the form. With this option enabled, visitors can save time filling out subsequent forms on your site.
This option is enabled by default. To disable this option, click to toggle the Pre-populate fields with known values switch off.
Style and preview your form
- After customizing the form options, click the Style & Preview tab to style, preview, and test the form.
- In the left pane, click the Style tab.
- Select one of four available themes. The form preview will update in the right pane.
- To change your form's colors and fonts, click Form settings. Learn more about customizing your global style settings for forms.
- In the left pane, click the Preview tab.
- Under Device types, select desktop, tablet, or mobile to view the form as it will appear on different devices.
- If you have progressive profiling enabled on the form, you can test the form to see how it changes for a visitor who has already filled in a progressive field or already has a value for the field. Learn more about testing progressive profiling.
- If you have dependent fields on the form, you can test the form by entering the value(s) that meet the criteria set up for the dependent field in the field it is dependent on. Learn more about testing dependent fields.
Publish your form
After you've previewed and made final modifications to your form, click Publish in the upper right to take your form live. Once the form is published, it will be available for use on your HubSpot pages or external site.