Embed code loads blank form

Marketing & Content Hub Lead Capture Tools
1

I am trying to embed a form on an external website. I am using the standard embed code, like this:

<!--[if lte IE 8]>
<script charset="utf-8" type="text/javascript" src="//js.hsforms.net/forms/v2-legacy.js"></script>
<![endif]-->
<script charset="utf-8" type="text/javascript" src="//js.hsforms.net/forms/v2.js"></script>
<script>
hbspt.forms.create({
region: "na1",
portalId: "PORTALID",
formId: "FORMID"
});
</script>

(Obviously I’m using actual values instead of PORTALID and FORMID.)

The script runs just fine and creates an iframe on the page, but the markup inside the page is empty:

<html><head></head><body data-autofill-highlight="false"></body></html>

There are no errors in the console nor failed requests in the network tab.

I have tried with several forms and get the same results each time. The forms are published and the preview page loads just fine from within HubSpot itself.

I have tried this on its own in a plain HTML file and get the same results, so it’s not some other scripts on the website interfering.

I wondered if there could be options somewhere which limit the domains this can run on, but wasn’t able to find such options - and would expect an error to be thrown if that were the case anyway.

Any help would be greatly appreciated.

2

Hi @BFranklin9

Thank you for reaching out.

Could you share the external website page?

I want to tag some of our experts on this - @Kevin-C @Jake_Lett @Brownstephen101 do you know what could be happening here?

Thank you!

Best

Tiphaine

3

Hi @TitiCuisset,

The page is at https://cpg-softlaunch.quba.co.uk/en-gb/talk-to-us/. I have realised that the form works just fine on Chrome, but not on Firefox (even with Enhanced Tracking Protection off). If I hit F5 a bunch of times it will occasionally load, maybe 1 out of 5 times.

Thanks,

Ji

4

If I use the raw HTML option instead of iframe this seems to work fine - and as I’m wanting to style it up with custom CSS this is the right option for me anyway.

5

Not sure if this is the issue, but Firefox has some unique security/privacy features that might block the iframe content. But if you can use the Raw HTML vs iframe that would be ideal because it gives you more control of what happens on the page.

https://support.mozilla.org/en-US/kb/enhanced-tracking-protection-firefox-desktop#w_what-enhanced-tracking-protection-blocks

6

Yes I wondered about that and did try switching off Enhanced Tracking Protection but this didn’t seem to have any effect. Perhaps there are other security features blocking it - although it’s odd that it would still work occasionally.

7

Try editing your embed code to include a target div with a unique ID. This will tell the script to load the form in the div. I have had issues loading forms in wordpress sites and the target ID fixed the loading issue. If this doesn’t work, another thing you could try is wrapping the form embed code with a on window load. This will run the code after everything else on your page is done loading.

window.addEventListener('load', (event) => {
 // paste your form embed code in here
});
8

Thanks for the suggestions @Jake_Lett, but unfortunately neither solved the issue. If it helps, this is only a problem on Firefox - see my other reply.