Easily build and embed forms on your site. Try HubSpot Forms for free.  

How to create a form for your landing page

Last updated: March 7, 2018

Available For:

Marketing: Basic, Pro, Enterprise
Sales: N/A
Service: N/A
HubSpot forms help you gather new contacts for your company and obtain additional information from your existing contacts.

Go to the forms tool

In your HubSpot Marketing BasicProfessional, or Enterprise account, navigate to Contacts > Forms.

Create a new form

From the forms dashboard, click Create form at the upper right.

Please note: if you have a Marketing Professional or Enterprise account, you might choose to reuse forms with progressive profiling across multiple landing pages. To learn more about progressive profiling, click here.

Name your form

At the top of the form editor, you'll be able to name your form. Hover over the form name and click the pencil icon to edit.

HubSpot Help article screenshot

Please note: the form name is internal and not visible on your live form.

Add fields to your form

In the Add form field section on the left, you'll be able to search for form fields and add them to your form.

From your available fields, either search for the field you're looking for, or search property groups to find the fields you want to use. Click, drag and drop the property 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 the Create new button in this section. To do so, follow the instructions here.

Mark required fields

If you've included fields that should be required upon submission, hover over the field and click Edit.

On the left-hand side, scroll down to Make this field required and check the box next to it.

Please note: an email address is required to create a contact, so the Email field will always be marked as required on your forms.

Remove a field from your form

If there is a field on your form that you wish to remove, hover over the field and click Delete.

Add a rich text area between your fields

You can use a rich text are to add rich text, build headers, or add spacing above field rows. Learn how to do so here.

Edit your form field's display names and options

To edit the display options of your form field, hover over the field and click Edit.

Change label

On the left-hand side, look for the Label field. Change this to what you wish to appear on the form for this field.

Edit other property options

You may want to select other property options to apply to your form field. For example, you can make the field hidden to pass certain values into contact properties. Learn how to do so here.

If you choose to have both placeholder text and a default value, keep in mind that the default value will override the placeholder text.

Configure your form options

When you're done editing your form fields, click the Options tab at the top of your form editor. Here, you have the following options: 

  1. What should happen after a visitor submits this form: If you would like your visitor to remain on the page after they submit the form, select Display a thank you message, then type your message into the text box that appears. If you would like your visitor to be redirected to another page, select Redirect to another page, then select a page from the dropdown.
  2. Follow up options: If you would like the contact's HubSpot owner to receive an email notification that their contact submitted the form, check Notify contact's HubSpot owner of their submission.
  3. Send submission email notifications to: Select user email addresses that should receive form submission email notifications from the dropdown menu. You can also specify team(s) from the dropdown menu.
  4. Error message language: Select the language to display your error messages in for visitors if they make an error filling out the form, such as not filling out a required field.
  5. Cookie tracking: Toggle this option on or off depending on your cookie preferences. This option is turned on by default, as HubSpot deduplicates contacts based on both cookie and email address. To learn more about creating non-cookie tracking forms, check out this article.
  6. Pre-populate fields with known values: Choose if fields with known values should be pre-populated. This reminds the visitor that they've already visited your site and filled out this information, in addition to verifying that their information is up-to-date.

Save your form

Once you're happy with your form, click Save form at the upper right. This will save your changes in the form editor.

Test your form

Before publishing your form, you can click the Test tab to see what your live form will look like, as well as test submitting it. If you have progressive profiling enabled, you can also click Preview form behavior to see how the form changes for a visitor who has already filled certain fields in.

Publish your form

After you've tested and made final modifications to your form, click Publish at 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.
HubSpot Help article screenshot

Link your form to your landing page

When editing your landing page, you can select your form from the Form dropdown in the Form module options.

Please note: your landing page must contain a form module in order to add a form. Learn how to add a module to your page template here.

What happens when a visitor hits the submit button?

When a visitor submits your form, the next step is to give them access to the content of your offer. In the form module options, select Redirect to another page to redirect visitors to a thank you page, or Display an inline thank you message to add a message that will be shown upon submission.

How do I change the style of the form and the form submit button?

After adding your form to your landing page, you may want to change the look of your form. The following articles will help you to customize your form:

New Call-to-action

Was this article helpful?

Previous article:

Next article: