CTA and Google analytics event tracking

[lincé]

Hi,

I've seen a message about this problem, but I haven't understood the solution.

So I try to find help with this new message.

I've found the solution for the GA event tracking on embedded forms but this is not working for my CTA.

For embedded forms in another web site, I've used this solution which works perfectly in GA :

<!--[if lte IE 8]>
<script charset="utf-8" src="//js.hsforms.net/forms/v2-legacy.js"> </script>
<![endif]-->
<script charset="utf-8" src="//js.hsforms.net/forms/v2.js" type="text/javascript"></script>
<script type="text/javascript">hbspt.forms.create({
	portalId: "portalId",
	formId: "#formId" ,
        onFormSubmit: function($form){
	ga('send', 'event', 'category', 'action', 'label');
},
});</script>
<style scoped="scoped" type="text/css">.hbspt-form, .hs-form .stacked {display: -webkit-flex;}
.hs-form-required {display:none;}
.hs-button {background-color:#3498db;border:none;padding:5px 10px;color:#fff;float;left;}</style>

But for a CTA, isn't it possible to add the GA tracking code directly in the hubspot script as I did it for the form ?

I've tryed this code wich doesn't work at all (GA doesn't detect any event when I or anybody else click on the CTA) :

<!--HubSpot Call-to-Action Code -->
<span class="hs-cta-wrapper" id="hs-cta-wrapper-ID">
<span class="hs-cta-node hs-cta-ID" id="hs-cta-ID">
<!--[if lte IE 8]>
<div id="hs-cta-ie-element"></div>
<![endif]-->
<a href="https://cta-redirect.hubspot.com/cta/redirect/ID/ID"  target="_blank" onClick="ga('send', 'event', 'pdf', 'download', 'label');" ><img class="hs-cta-img" id="hs-cta-img-ID" style="border-width:0px;" height="164" width="300" src="https://no-cache.hubspot.com/cta/default/ID/ID.png"  alt=""/></a>
</span>
<script charset="utf-8" src="https://js.hscta.net/cta/current.js"></script>
<script type="text/javascript"> hbspt.cta.load(ID, 'CTA ID', {}); </script>
</span>
<!-- end HubSpot Call-to-Action Code -->

What can I do else to track event with GA ?

I've seen a solution with a jQuery but didn't understand where and how to add it

Thanks for your help 🙂

[lincé]

Hi,

I've seen a message about this problem, but I haven't understood the solution.

So I try to find help with this new message.

I've found the solution for the GA event tracking on embedded forms but this is not working for my CTA.

For embedded forms in another web site, I've used this solution which works perfectly in GA :

<!--[if lte IE 8]>
<script charset="utf-8" src="//js.hsforms.net/forms/v2-legacy.js"> </script>
<![endif]-->
<script charset="utf-8" src="//js.hsforms.net/forms/v2.js" type="text/javascript"></script>
<script type="text/javascript">hbspt.forms.create({
	portalId: "portalId",
	formId: "#formId" ,
        onFormSubmit: function($form){
	ga('send', 'event', 'category', 'action', 'label');
},
});</script>
<style scoped="scoped" type="text/css">.hbspt-form, .hs-form .stacked {display: -webkit-flex;}
.hs-form-required {display:none;}
.hs-button {background-color:#3498db;border:none;padding:5px 10px;color:#fff;float;left;}</style>

But for a CTA, isn't it possible to add the GA tracking code directly in the hubspot script as I did it for the form ?

I've tryed this code wich doesn't work at all (GA doesn't detect any event when I or anybody else click on the CTA) :

<!--HubSpot Call-to-Action Code -->
<span class="hs-cta-wrapper" id="hs-cta-wrapper-ID">
<span class="hs-cta-node hs-cta-ID" id="hs-cta-ID">
<!--[if lte IE 8]>
<div id="hs-cta-ie-element"></div>
<![endif]-->
<a href="https://cta-redirect.hubspot.com/cta/redirect/ID/ID"  target="_blank" onClick="ga('send', 'event', 'pdf', 'download', 'label');" ><img class="hs-cta-img" id="hs-cta-img-ID" style="border-width:0px;" height="164" width="300" src="https://no-cache.hubspot.com/cta/default/ID/ID.png"  alt=""/></a>
</span>
<script charset="utf-8" src="https://js.hscta.net/cta/current.js"></script>
<script type="text/javascript"> hbspt.cta.load(ID, 'CTA ID', {}); </script>
</span>
<!-- end HubSpot Call-to-Action Code -->

What can I do else to track event with GA ?

I've seen a solution with a jQuery but didn't understand where and how to add it

Thanks for your help 🙂

[ralphioooo]

We have just created a HubSpot APP called Analytics Amplifier that will also help you do this + push offline events to Google Analytics when they happen.

Check it out here:
https://ecosystem.hubspot.com/marketplace/apps/marketing/analytics-data/google-analytics-amplifier-2...

[lincé]

Thank you,

I've noticed that GA doesn't detect the latest CTA I've integrated on an external page. I've used the same method than before wich was working well but now when we click on the CTA, no event is detected by GA.

And hubspot doesn't seem to detect the CTA is used in an external web page, not even seen or clicked.

Thnks for you help.

[lincé · Accepted solution]

I've finally found the solution!!!

<!--HubSpot Call-to-Action Code -->
<span class="hs-cta-wrapper" id="hs-cta-wrapper-ID">
<span class="hs-cta-node hs-cta-ID" id="hs-cta-ID">
<!--[if lte IE 8]>
<div id="hs-cta-ie-element"></div>
<![endif]-->
<a href="https://cta-redirect.hubspot.com/cta/redirect/hs-account-ID/hs-CTA-ID"  target="_blank"><img class="hs-cta-img" id="hs-cta-img-ID" style="border-width:0px;" height="164" width="300" src="https://no-cache.hubspot.com/cta/default/hs-account-ID/hs-img-ID.png"  alt=""/></a>
</span>
<script charset="utf-8" src="https://js.hscta.net/cta/current.js"></script>
<script type="text/javascript"> hbspt.cta.load(#hs-account-id, '#hs-cta-id', $(document).ready(function() {
    $('#hs-cta-id').click(function() {
        ga(‘send’, ‘event’, ‘category’, ‘action’, ‘label’, value);
    });
}); </script>
</span>
<!-- end HubSpot Call-to-Action Code -->

Now I can see the event in Google Analytics !