CMS Development

EddyVinck
Participant | Elite Partner
Participant | Elite Partner

hbspt.cta object missing, HubSpot smart CTA not loading

Hi. I have a question related to the HubSpot CTA embed code. I was developing Smart CTA's on my local development environment and everything worked fine. When I tested it on the testing environment I noticed that the Smart CTA's were not working. 

I inspected the JavaScript console and I noticed the following error: "Uncaught TypeError: Cannot read property 'load' of undefined"

I looked into it and I noticed that the hbspt object has a child object called "cta" on my local development environment, but that child object is missing in our test environment and also on the live website for some reason. I looked online and I cannot find why the cta child object is missing.

 

I would like to note that regular CTA's seem to be working fine.

 

Notice the cta objectNotice the cta objectSchermafbeelding 2018-06-13 om 14.59.50.png

 

 

 

4 Replies 4
EddyVinck
Participant | Elite Partner
Participant | Elite Partner

hbspt.cta object missing, HubSpot smart CTA not loading

This is the testing website. Notice howthe quiz image CTA at the bottom is loading, but the smart CTA with the text "find out which SEM system..." is not loading.

 

This is strange because they both use the same method.

hbspt.cta.load

I have also tested the CTA by putting it after the functioning CTA in the DOM, but that does not make a difference.

tjoyce
Recognized Expert | Elite Partner
Recognized Expert | Elite Partner

hbspt.cta object missing, HubSpot smart CTA not loading

@EddyVinck

I had a nice response typed out for you but it didn't post 😕 So, here it goes again. 

I see there is definitely code missing in your CTA embed. I don't see the 

<script charset="utf-8" src="https://js.hscta.net/cta/current.js"></script>

code that should appear right before 

<script>hbspt.cta.load(2005984,'f0f4b548-2b19-4132-9600-e92983efc820',{});</script>

I also think that console.log(hbspt) is leading you down the wrong debugging path because the last embedded item you have in your page is the form which is taking over the hbpst namespace in javascript. Just try copying your embed code from your HS portal again and dropping it into a wysiwyg or your template. When I did it through chrome console, it worked fine for me.

<span class="hs-cta-wrapper" id="hs-cta-wrapper-f0f4b548-2b19-4132-9600-e92983efc820"><span class="hs-cta-node hs-cta-f0f4b548-2b19-4132-9600-e92983efc820" id="hs-cta-f0f4b548-2b19-4132-9600-e92983efc820"><!--[if lte IE 8]><div id="hs-cta-ie-element"></div><![endif]--><a href="https://cta-redirect.hubspot.com/cta/redirect/2005984/f0f4b548-2b19-4132-9600-e92983efc820"><img class="hs-cta-img" id="hs-cta-img-f0f4b548-2b19-4132-9600-e92983efc820" style="border-width:0px;" src="https://no-cache.hubspot.com/cta/default/2005984/f0f4b548-2b19-4132-9600-e92983efc820.png" alt="Every SEM is different.  Ask our expert which one is right for you.  Get SEM advice"/></a></span><script charset="utf-8" src="https://js.hscta.net/cta/current.js"></script><script>hbspt.cta.load(2005984,'f0f4b548-2b19-4132-9600-e92983efc820',{});</script></span>

 


tim@belch.io

0 Upvotes
EddyVinck
Participant | Elite Partner
Participant | Elite Partner

hbspt.cta object missing, HubSpot smart CTA not loading

I will test to see if it works when I have time. Quite busy right now with other work. Thanks a lot.

tjoyce
Recognized Expert | Elite Partner
Recognized Expert | Elite Partner

hbspt.cta object missing, HubSpot smart CTA not loading

I had a nice response typed out for you but it didn't post 😕 So, here it goes again. 

I see there is definitely code missing in your CTA embed. I don't see the 

<script charset="utf-8" src="https://js.hscta.net/cta/current.js"></script>

code that should appear right before 

<script>hbspt.cta.load(2005984,'f0f4b548-2b19-4132-9600-e92983efc820',{});</script>

I also think that console.log(hbspt) is leading you down the wrong debugging path because the last embedded item you have in your page is the form which is taking over the hbpst namespace in javascript. Just try copying your embed code from your HS portal again and dropping it into a wysiwyg or your template. When I did it through chrome console, it worked fine for me.

<span class="hs-cta-wrapper" id="hs-cta-wrapper-f0f4b548-2b19-4132-9600-e92983efc820"><span class="hs-cta-node hs-cta-f0f4b548-2b19-4132-9600-e92983efc820" id="hs-cta-f0f4b548-2b19-4132-9600-e92983efc820"><!--[if lte IE 8]><div id="hs-cta-ie-element"></div><![endif]--><a href="https://cta-redirect.hubspot.com/cta/redirect/2005984/f0f4b548-2b19-4132-9600-e92983efc820"><img class="hs-cta-img" id="hs-cta-img-f0f4b548-2b19-4132-9600-e92983efc820" style="border-width:0px;" src="https://no-cache.hubspot.com/cta/default/2005984/f0f4b548-2b19-4132-9600-e92983efc820.png" alt="Every SEM is different.  Ask our expert which one is right for you.  Get SEM advice"/></a></span><script charset="utf-8" src="https://js.hscta.net/cta/current.js"></script><script>hbspt.cta.load(2005984,'f0f4b548-2b19-4132-9600-e92983efc820',{});</script></span>

 


tim@belch.io

0 Upvotes