How to Pass Hubspot User Token ID from Webflow form to Hubspot via Napier

[JPolonis]

Hi guys,

Our site is running on Webflow and we would like to use our custom form. I can automatically pass leads from WF to Hubspot using Zapier and some custom mapping. So I can pass simple stuff like name/email/etc and hidden fields (like utm parameters). But how do I pass stuff that is collected in Hubspot tag? Like first page visited, last page visited, inbound source, etc.?

Is it possible to do? I've heard something about user tokens, maybe I could somehow pass user token ID and it would populate all the contact data?

[Teun · Accepted solution]

Hi @JPolonis ,

You need to pass the hubspotutk cookie value to HubSpot. I am not sure if this is possible through Zapier. 

You have a few options here:

1. Check if you can pass the hubspotutk value to HubSpot through Zapier.
2. You can try 'non-hubspot form tracking' instead. This makes Zapier unnecessary.

3. You can see if Webflow offers some way to hook into the form submission so you can write a custom API call to HubSpot using the form submission API.

4. You could try the Webflow 'HubSpot forms integration'

[Sweely · Accepted solution]

The short answer is:

You are correct that the key is the HubSpot user token, which is stored in a cookie named `hubspotutk`.

The reason you can't pass the historical data like first page visited or inbound source is that Zapier is only forwarding simple form fields, not the tracking cookie value.

While you could try to pull the `hubspotutk` cookie value on the front end and pass it as a hidden field through Zapier, a better, more reliable, and cheaper solution is to skip Zapier entirely and use the Webflow Forms API to send the form data directly to the HubSpot API.

This allows you to programmatically attach the `hubspotutk` cookie value, ensuring all the historical tracking data is automatically associated with the new contact record upon submission ✅

The long answer is:

The historical tracking data you're looking for - like original source, page view history, and session information - is not stored on your Webflow form.

It is tracked by the HubSpot tracking script and associated with the visitor's unique `hubspotutk` cookie.

When a visitor submits a standard HubSpot form, the system automatically detects this cookie and merges the form data with the tracking data.

When you use a custom Webflow form and Zapier, you break this seamless connection 🛑

The solution proposed by others - passing the `hubspotutk` value as a hidden field - is viable but requires front-end JavaScript work to read the cookie and insert it into your form, which can be complex and fragile.

A superior and more cost-effective approach that removes the Zapier subscription entirely is to use an API-based connection.

You would configure your Webflow form to post its data to a custom endpoint instead of Zapier.

This custom endpoint could be a lightweight function hosted on a platform like Stape or Google Cloud Platform.

When the form is submitted, this function receives the form fields, extracts the `hubspotutk` cookie value from the request headers, and then constructs a single, secure request to the HubSpot API's Forms endpoint.

This method is an excellent solution because the HubSpot API is specifically designed to accept the `hubspotutk` value in the request, which is the magic key that links the form submission to all the visitor's historical activity captured by the tracking code.

For better security and reliability, you can use Google Tag Manager to manage the script that captures the form submission event before sending it to your custom endpoint.

By leveraging the Webflow Forms API to trigger your custom code and the HubSpot API to handle the final submission, you ensure a direct, reliable data flow that correctly merges the contact and tracking information, all while saving the cost and complexity of a middleware service ✅

This comment was generated with the assistance of an AI tool, incorporating my expertise in integrations sm🙂

[Teun · Accepted solution]

Hi @JPolonis ,

You need to pass the hubspotutk cookie value to HubSpot. I am not sure if this is possible through Zapier. 

You have a few options here:

1. Check if you can pass the hubspotutk value to HubSpot through Zapier.
2. You can try 'non-hubspot form tracking' instead. This makes Zapier unnecessary.

3. You can see if Webflow offers some way to hook into the form submission so you can write a custom API call to HubSpot using the form submission API.

4. You could try the Webflow 'HubSpot forms integration'

[Teun]

And like @Jaycee_Lewis mentioned, you need the HubSpot tracking script enabled for the hubspotutk cookie to be set and collect any data you mentioned, so make sure it is in place 🙂

[Jaycee_Lewis]

Hey @JPolonis 👋. 

Great question 😊. Are you able to prove any more context or details? This can help the community better understand what resources might be a good fit.

Not 100% sure if you'd already looked at the Tracking Code API documentation so I'll add it here as well https://developers.hubspot.com/docs/api/events/tracking-code

I am going to loop in a community expert 🙌  Hey, @Teun do you have any thoughts here?

Thank you! – Jaycee