> 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/framer-how-to-track-hubspot-form-submissions.md).

# Framer – How to Track HubSpot Form Submissions

Embed a HubSpot form in Framer and add a short snippet so Humblytics can see each submission.

{% hint style="info" %}
**You need:** the Humblytics script installed on your Framer site. See the [Framer install guide](/how-to-get-started/framer.md).
{% endhint %}

**Why the extra snippet?** Framer runs code from an **Embed** component inside its own frame, separate from your page. The snippet passes HubSpot's "form submitted" signal up to your page, where Humblytics records it.

## 1. Add the HubSpot embed and the snippet

1. In HubSpot, open your form and click **Share → Embed code**, then copy it.
2. In Framer, click **Insert**, add an **Embed** component where the form should go, and set its type to **HTML**.
3. Paste the HubSpot code, then paste the matching snippet directly below it in the same Embed.

**If your code contains `hbspt.forms.create`:**

```html
<script>
  // Passes HubSpot's submit signal to your page so Humblytics can record it
  window.addEventListener("message", function (event) {
    window.parent.postMessage(event.data, "*");
  });
</script>
```

**If your code contains `hs-form-frame`** (HubSpot's newer forms):

```html
<script>
  // Runs when the form is submitted and tells your page about it
  window.addEventListener("hs-form-event:on-submission:success", function () {
    window.parent.postMessage(
      { type: "formSubmission", formName: "Hubspot Form" },
      "*"
    );
  });
</script>
```

You can change `Hubspot Form` to a more specific name, like `demo-request`.

<mark style="background-color:pink;">ADD GIF HERE</mark>

## 2. Publish and test

1. Click **Publish**.
2. Open your live site in a private window and submit a test entry.
3. In Humblytics, go to **Observe → Analytics → Forms** and look for **Hubspot Form** (or the name you chose) within a minute or two.

**Not showing?**

* Test the published site, not the Framer editor or preview.
* Make sure you used the snippet that matches your embed code, and that it's in the **same** Embed.
* Add only one snippet per Embed. Adding it twice counts each submission twice.
