I have experienced that it’s not possible to create a standard pop-up form without it being an iframe, therefore tracking on the form is not possible. Have i missed something in regards to this?
Thanks in advance.
I don’t think you’ve missed anything obvious.
From what I’ve seen, HubSpot pop-up forms don’t give the same level of tracking flexibility as a standard embedded form, so if that’s what you need, it would likely require a workaround or a different setup.
Hi @Jakobv and welcome, it’s a pleasure to have you here!
Thanks so much @UlianaV for confirming that standard forms in the current forms editor don’t have a non-iframe/raw HTML version. That option is indeed only available for legacy forms.
Here is a similar thread with a workaround that might help “hsFormCallback for hubspot form embedded in Pop-up CTA”.
I’d love to consult our Top Experts: Hi @danmoyle, @trevordjones and @rebeccatravels can you think of other workarounds or ideas to help @Jakobv, please?
Thanks so much and have a lovely day!
Bérangère
Welcome to the Community @Jakobv! You’re right: HubSpot’s standard pop-up forms (legacy pop-up forms and pop-up CTAs) always load inside an iframe, and you cannot create a non-iframe pop-up form using HubSpot’s native pop-up tool. This iframe design blocks standard third-party tracking (like GTM’s default form-submit triggers) from the parent page due to cross-origin browser security restrictions. If you’re tracking in HubSpot, HubSpot tracks everything so you’re good to go there. There are some workarounds I found suggested if you’re working with Google Tag Manager. I’ll share that here, but to be clear I have not personally used this workaround so I cannot confirm that it’s what you need.
This is for “GTM with postMessage listener”
Add this Custom HTML tag in GTM (trigger on All Pages) to listen for HubSpot’s submission message:
window.addEventListener('message', (event) => {
if (event.data.type === 'hsFormCallback' && event.data.eventName === 'onFormSubmitted') {
window.dataLayer = window.dataLayer || [];
dataLayer.push({
event: 'hubspot_form_submit',
formId: event.data.id,
inputs: event.data.data.submissionValues
});
}
});
Then create:
- A Custom Event trigger for hubspot_form_submit
- Data Layer Variables for form fields
- Your GA4/Google Ads/Meta tags fired on that event
Hopefully that helps!