HubSpot Forms
Overview
Capture website leads instantly without requiring a traditional form. Simply add our JavaScript snippet to your header tag to begin collecting visitor responses. See below for more instructions
HubSpot Forms are used by customers like: Runway & Spot AI!
Implementation
Step 1: Connect your Webform
Connect your webform
Go to Navigation > Forms > Webforms. Select the Connect your Webform option.
Step 2: Select HubSpot Form
Select HubSpot form
Choose HubSpot as your form type and copy the provided snippet. Your engineering team will need to add this snippet to the <head>
section of your webpage.
Your snippet should look something like this:
Step 3: Identify your Form
Identify your form
Specify how you’ll identify the form on your webpage by choosing one of these methods:
-
Adding the unique identifier to your
<form>
tag. -
Adding the code to your form wrapper.
-
Place a
<div>
around your form.
Then select “I have my form identification.”
Step 4: Test Connection
Test connection
Test your setup by submitting a sample response through your web form. After submission, map all required fields to complete the configuration.
Step 5: Map Form Fields
Map form fields
Map the email
field from your form submission when prompted. This is a required field for all forms.
Other fields (e.g. Company Name, First Name, Last Name) can be mapped to Default lead attributes.
Note: Not all fields will be mapped to a Default field attribute. This is expected.
HubSpot Form Examples
Runway
Spot AI
FAQs
FAQ: Multiple forms on the same page
How does Default pick up on my primary form if there are multiple on the page?
FAQ: Multiple forms on the same page
How does Default pick up on my primary form if there are multiple on the page?
-
During the form connection process your submission sends us a
form identifier
. This is expected to be unique for each form. -
We store this
form identifier
under a<meta>
tag on our end, and when submissions are sent, match it to the stored identifier. -
By default, our snippet only tracks a single form on the page based on the criteria in the first two bullets.
With that being said, if you want to send all form submissions on page to a single workflow in Default, you can pass in strict mode = true
in your snippet from Step 1.
FAQ: Adding fields post-publish
How does Default check for new fields?
FAQ: Adding fields post-publish
How does Default check for new fields?
On any webform (including a HubSpot form) you have the option to update fields. When you do so, you will be asked to follow the steps and submit a new response from your public-facing form to Default.
Default will automatically listen for new form fields, and omit any fields that were removed.