HubSpot is great at tracking leads, but getting web form data into HubSpot can be messy if your site is static or spread across multiple stacks. The fastest path is to use a form endpoint that captures submissions and forwards clean payloads to HubSpot.
This guide shows a simple, repeatable setup that works for HTML, React, Next.js, and any CMS.
What You Need
- A HubSpot account with access to CRM properties
- A form endpoint from Flowqen
- Your website form (any framework)
Step 1 - Create a Form Endpoint
In Flowqen, create a new form and copy your endpoint:
https://flowqen.com/api/f/YOUR_FORM_IDUse this URL as the action on your form. Your site stays static, but submissions flow to Flowqen.
Step 2 - Connect HubSpot
Open your form in Flowqen and go to Integrations. Select HubSpot and authorize your account. Then map fields:
- email -> Email
- name -> First Name + Last Name (split if needed)
- company -> Company name
- message -> Notes
Tip: keep your web form field names simple and stable. This reduces mapping errors over time.
Step 3 - Add Hidden Metadata
Hidden fields help you segment leads in HubSpot. Add UTM or campaign tags directly in your form markup:
<input type="hidden" name="utm_source" value="blog" />
<input type="hidden" name="utm_campaign" value="hubspot-integration" />These values are sent to Flowqen and forwarded to HubSpot with each submission.
Step 4 - Validate and Test
Submit a test entry and confirm the contact appears in HubSpot with the correct fields. If a property does not exist, create it in HubSpot first and re-map.
Common Mapping Mistakes to Avoid
- Using different field names across pages
- Passing a phone number to a text property without formatting
- Forgetting to map custom fields (industry, budget, timeline)
Optional - Trigger HubSpot Workflows
Once data reaches HubSpot, you can trigger workflows automatically:
- Send a lead magnet email
- Assign owner based on region
- Create a deal for high-intent submissions
Checklist
- Form endpoint created
- HubSpot authorized
- Field mapping verified
- Hidden metadata added
- Test submission validated
Keyword Variants People Also Search
- hubspot website form integration
- send contact form to hubspot
- hubspot form for static site
FAQ
Do I need HubSpot embed forms?
No. You can keep your own HTML form and connect it through Flowqen.
Will this work for React or Next.js?
Yes. Any framework that can submit a form can send data to Flowqen, which then forwards to HubSpot.
Can I track UTM parameters?
Yes. Add hidden fields or append UTMs from your front-end script and map them in HubSpot.
Start with a free Flowqen form at flowqen.com/signup and connect HubSpot in minutes.