> For the complete documentation index, see [llms.txt](https://docs.humblytics.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.humblytics.com/how-to-track-custom-form-submissions/hubspot-forms/webflow-how-to-track-hubspot-form-submissions.md).

# Webflow – How to Track HubSpot Form Submissions

### Why track HubSpot forms?

* Measure lead‑gen conversion rates directly in Humblytics
* Attribute submissions to campaigns, A/B tests, and traffic sources
* Maintain a cookie‑free, privacy‑compliant stack—no banners required

***

### Prerequisites

| Requirement                                     | Check |
| ----------------------------------------------- | ----- |
| HubSpot Marketing account with an existing form | ✔︎    |
| Webflow project with Humblytics tag installed   | ✔︎    |

If the Humblytics script isn’t on your site yet, follow the Webflow installation guide first.

***

### Step‑by‑Step: Track HubSpot Submissions in Webflow

#### 1 · Embed the HubSpot form

In Webflow Designer:

1. Drag an **Embed** element where you want the form.
2. Paste your HubSpot embed code. It typically looks like:

```
<!-- HubSpot Embed -->
<script src="//js.hsforms.net/forms/v2.js"></script>
<script>
hbspt.forms.create({
  region: "na1",             // confirm your region
  portalId: "YOUR_PORTAL_ID", // replace with your portal ID
  formId: "YOUR_FORM_ID"      // replace with your form ID
});
</script>
```

3. Publish the site.

#### 2 · Hook into the submission event

HubSpot’s Forms API supports an `onFormSubmit` callback. Add the callback just below the create block:

```
<script>
hbspt.forms.create({
  region: "na1",
  portalId: "YOUR_PORTAL_ID",
  formId: "YOUR_FORM_ID",
  onFormSubmit: function($form) {
    window.Humblytics.trackFormSubmission("hubspot-lead"); // choose any label
  }
});
</script>
```

`trackFormSubmission()` logs a custom event named **hubspot‑lead** in Humblytics.

> Tip: Use descriptive labels like `pricing‑demo‑request` if you embed multiple HubSpot forms on the same site.

#### 3 · Verify in Humblytics

1. Submit the form once on the published site.
2. Open **Dashboard → Conversions → Forms**.
3. Look for **hubspot‑lead** (or your chosen label). Data appears within \~30 seconds.

***

### Benefits of this setup

* Cookie‑free tracking—no consent banners required
* Works on every Humblytics plan, including Lite
* No additional JavaScript libraries or tag managers
* Real‑time visibility in dashboards, heatmaps, and funnels

***

### Optional enhancements

* **Funnels:** Add the form label as the final step to measure pre‑submit drop‑off.
* **A/B tests:** Use Humblytics Experiments to compare form placements, copy, or CTA buttons.

***

For advanced use cases—multi‑step HubSpot forms, hidden UTM fields, or offline events—email **<support@humblytics.com>** and we’ll guide you through.
