Custom/Self-Hosted – How to Track HubSpot Form Submissions

Why track HubSpot forms?

• Measure lead-gen conversion rates directly inside Humblytics

• Attribute submissions to campaigns, traffic sources, A/B tests

• Preserve a cookie-free, privacy-compliant analytics stack—no banners required

---

Prerequisites

• Your pages already load the global hmbl.min.js script (36 kb, async).

• You have the standard HubSpot embed snippet for your portal & form IDs.

---

Step-by-Step Setup

1 · Embed the HubSpot form

Paste the HubSpot embed wherever the form should render (HTML template, CMS block, component):

htmlCopyEdit<!-- HubSpot form 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>

Publish / deploy your site.

---

2 · Hook into the submission event

Add the onFormSubmit callback inside the same snippet (or in a new <script> block directly after it):

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

Use a descriptive label—e.g., "pricing-demo-request"—if you track multiple HubSpot forms.

---

3 · Verify in Humblytics

1. Submit the form once on the live site.

2. Open Dashboard → Conversions / Forms.

3. Locate hubspot-lead (or your custom label). Data appears within ~30 s.

---

Key Benefits

Benefit	Detail
Cookie-free	No consent banners or CMP required
Real-time	Submissions populate dashboards instantly
Works on every plan	Lite tier and up support custom events
Zero extras	No GTM, plugins, or additional libraries

---

Optional Enhancements

• Funnels: use the label as the final step to see pre-submit drop-off.

• Experiments: set the label as your success goal to A/B-test form placement, copy, or CTA design.

---

For advanced use cases—multi‑step HubSpot forms, hidden UTM fields, or offline events—email [e-mail] and we’ll guide you through.