Form Integration

HubSpot Forms + HYROS Tracking

Convert HubSpot forms to HYROS-compatible format. Works with any embed type.

You've completed 0 training pages

⚠️ The Problem with Standard HubSpot Forms

Default HubSpot embed codes use iframes, which block HYROS from accessing the email field. This breaks escalation signals and lead tracking.

✅ The Solution:

Use HubSpot's Developer Embed format (hs-form-html) which renders the form in the page DOM instead of an iframe. This lets HYROS read the email field.

🚀 Quick Start

1️⃣

Get Your HubSpot Form IDs

You need three values from your HubSpot embed code:

Portal ID - Your HubSpot account ID (usually 6-8 digits)
Form ID - The unique form identifier (usually UUID format)
Region- Usually "na1" (North America) or "eu1" (Europe)

// Example HubSpot embed formats that work:

// Format 1: iframe
<iframe src="https://js-na2.hsforms.net/...?_hsPortalId=123456&_hsFormId=abc-123...">

// Format 2: div with data attributes
<script src="https://js.hsforms.net/forms/embed/123456.js" defer></script>
<div class="hs-form-frame" data-form-id="abc-123" data-portal-id="123456"></div>

// Format 3: hbspt.forms.create
hbspt.forms.create({ portalId: "123456", formId: "abc-123", region: "na1" })

2️⃣

Use the Generator Code

Replace the placeholders in this template with your values:

<!-- HubSpot Form (Developer Version for HYROS Tracking) -->
<!-- The HYROS Universal Script on your site will auto-detect email inputs -->

<script src="https://js.hsforms.net/forms/embed/developer/{PORTAL_ID}.js" defer></script>
<div class="hs-form-html" data-region="{REGION}" data-form-id="{FORM_ID}" data-portal-id="{PORTAL_ID}"></div>

📝 Replace these values:

{PORTAL_ID} → Your Portal ID
{FORM_ID} → Your Form ID
{REGION} → Your region (na1, eu1, etc.)

3️⃣

Add HYROS Universal Script

Make sure the HYROS Universal Script is in your website's <head> section. This script will automatically detect the HubSpot form email field once the form loads.

No additional setup needed - HYROS will automatically track form submissions!

💡 Real Example

Before (Standard HubSpot iframe):

<iframe src="https://js-na1.hsforms.net/...?_hsPortalId=8675309&_hsFormId=abc-123-def"></iframe>

After (HYROS-compatible Developer Embed):

<!-- HubSpot Form (Developer Version for HYROS Tracking) -->
<script src="https://js.hsforms.net/forms/embed/developer/8675309.js" defer></script>
<div class="hs-form-html" data-region="na1" data-form-id="abc-123-def" data-portal-id="8675309"></div>

🌍 HubSpot Region Reference

na1 (Default)

North America

js.hsforms.net

eu1

Europe

js-eu1.hsforms.net

na2

North America (Secondary)

js-na2.hsforms.net

ap1

Asia Pacific

js-ap1.hsforms.net

💡 Pro Tip:

If you see js.hsforms.net with no region prefix, use na1 as your region value.

🔧 Troubleshooting

Common Issues

❌ Form doesn't appear

Check that:

Portal ID and Form ID are correct
Script URL matches your region
Script has defer attribute

❌ HYROS not tracking form

Verify:

HYROS Universal Script is in page <head>
Using hs-form-html class (not iframe)
Form email field is visible in DOM (inspect element)

❌ Wrong region error

Solution:

Check original HubSpot code for region hints
Look for js-{region}.hsforms.net in script URL
Try na1 if unsure

🔗

Use the Automated Generator

Paste any HubSpot embed code and get the HYROS-compatible version automatically. No manual extraction needed!

Open Generator Tool

📚 Related Documentation

→HubSpot Forms API Documentation →HubSpot Forms User Guide →HYROS Documentation

Questions about this implementation? Contact the development team.