Integrating HubSpot contact forms into third-party websites

[sophialee92]

I’m trying to add a HubSpot form to my website but running into issues. I followed their guide and added the required scripts:

<!--[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>

Then I’m using this code to generate the form:

hbspt.forms.create({
  portalId: '3456789',
  formId: 'abc123def-45gh-67ij-klmn-opqrstuvwxyz'
});

The form isn’t showing up anywhere on my page. Do I need to specify a target container or element? The documentation seems incomplete. Has anyone successfully implemented this and can share what I’m missing?

[SparklingGem]

same headache here last month! you’re right about the target div, but double-check that your hubspot form is published, not stuck in draft mode. i wasted hours debugging code when the form just wasn’t live yet. check the form status in your hubspot dashboard first.

[mikechen]

Yeah, you need the target container for sure, but here’s another gotcha I ran into with HubSpot forms. Your JavaScript has to load AFTER the HubSpot scripts finish loading, or you’ll get undefined errors everywhere. I either wrapped my form code in window.onload or just stuck it at the bottom of the page after all scripts. Also, triple-check your portal ID and form ID - even one wrong character makes the form fail silently with zero error messages. You can grab the correct IDs from your HubSpot account in the form settings. Fixed the loading order and everything worked perfectly.

[alexr1990]

for sure! you gotta specify a target div. try adding something like <div id="hubspot-form"></div> and then include target: '#hubspot-form' in your hbspt.forms.create() setup. ran into the same issue and it worked for me!

[Samuel87]

Same exact frustrating thing happened to me setting up forms for a client. Besides the target container issue others mentioned, I found that some CMSs and page builders mess with HubSpot’s form rendering. WordPress with certain caching plugins was the worst - form worked perfectly in dev but vanished once I turned caching on. If you’re running caching or optimization plugins, disable them temporarily and see if that fixes it. Also check your browser’s dev console for JavaScript conflicts - other plugins can stop HubSpot’s code from running even when everything looks right.

[Isaac_Cosmos]

The missing target container is your main issue. HubSpot loads the scripts but can’t place the form elements anywhere without it. I ran into this exact problem when I first integrated their forms a couple years back. You need to add a target parameter pointing to a div on your page - something like target: '#my-form-container' in your create function. Then make sure you’ve got a div with that ID. What tripped me up was the form won’t throw console errors when the target’s missing - it just silently fails. Also check your network tab to make sure the scripts are actually loading from HubSpot’s CDN.