# 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.


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.humblytics.com/how-to-track-custom-form-submissions/hubspot-forms/webflow-how-to-track-hubspot-form-submissions.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.