javascripthtmlformshubspot

Embed script not loading HTML at the right position

We're embedding a 3rd party form (HubSpot Form) on our site and sometimes the HTML of the form isn't in the right place. It should be right after the script.

<script>hbspt.forms.create({ 
css: '',
portalId: '1552633',
formId: '6c551c1f-f5a6-453d-93d3-4169c8f563c0'});
</script>

and the HTML of the form should be after the script

<div class="hbspt-form" id="hbspt-form-1479681169480">

But sometimes, the HTML of the form appears below the footer of the page. The script is in the right place. Just the html that it generated is not.

Any ideas what may cause this?

enter image description here

Solution

  • I found a more specific solution to this issue.

    For any HubSpot users, what I did to solve the problem was added a class to the div where I wrapped the code in and then in the embed code, I added 

    target: '.class'

    This makes sure that the form loads within that class instead of somewhere else and that solved the issue.