Capterra PPC Conversion Tracking

[casebook_brian]

Hey all! Long time listener, first-time caller 😉

I'm trying to set up click tracking with Capterra and I've run into some challenges. Their preferred method is to insert code on page load when redirected to the "thank you" page after conversion. My preference is not to redirect and instead just display the thank you message. 

They provide sample code for my preferred method: 

<script type="text/javascript">

    // Replace the text on the right hand side of the '=' with the id of your button.
    // Make sure you do not remove the single quotes.

    var buttonId = 'submitFormButton' // Change this

    // DO NOT CHANGE THE CODE BELOW
    function trackingListener() {
      var capterra_vkey = '5d2b6f627d0237c03299f0be0800f1c5',
      capterra_vid = '2141917',
      capterra_prefix = (('https:' == document.location.protocol)
        ? 'https://ct.capterra.com' : 'http://ct.capterra.com');

      var ct = document.createElement('script');
      ct.type = 'text/javascript';
      ct.async = true;
      ct.src=capterra_prefix + '/capterra_tracker.js?vid='
        + capterra_vid + '&vkey=' + capterra_vkey;

      var s = document.getElementsByTagName('script')[0];
      s.parentNode.insertBefore(ct, s);
    };

    var button = document.getElementById(buttonId);
    button.addEventListener(
      'click',
      trackingListener
    );
  </script>

I don't see a button ID and when I tried to use the form id on submit, I wasn't successful. Any suggestions on what other variable I could use? 

I should also note I'm using Google Tag Manager. 

Thanks in advance. 

-Brian 

[piersg · Accepted solution]

Hi @casebook_brian,

You could embed your form using the Hubspot HTML embed, which allows you to run scripts on submission. The documentation for that is here.

This might look something like this for you:

<!--[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({
  portalId: "[PORTAL ID]",
  formId: "[FORM ID]",
    onFormSubmit: function($form){
        var capterra_vkey = '5d2b6f627d0237c03299f0be0800f1c5',
        capterra_vid = '2141917',
        capterra_prefix = (('https:' == document.location.protocol)
          ? 'https://ct.capterra.com' : 'http://ct.capterra.com');

        var ct = document.createElement('script');
        ct.type = 'text/javascript';
        ct.async = true;
        ct.src=capterra_prefix + '/capterra_tracker.js?vid='
          + capterra_vid + '&vkey=' + capterra_vkey;

        var s = document.getElementsByTagName('script')[0];
        s.parentNode.insertBefore(ct, s);
    }
  });
</script>

As you said you are using GTM, you can also set up events that trigger on form submission through GTM, and then add the Capterra script as a custom HTML tag. There's a step by step guide to setting that up here. 

This is one event to track every Hubspot form submission in GTM and GA. However, the event doesn't get the name of the submitted form, just the GUID, so if you want the actual name of the form to appear in your events in GA you'll have to set up separate events for each form with the name in GTM. It's mostly the same process, just some extra steps.

[piersg · Accepted solution]

onFormSubmit is a method for Hubspot forms, not Meetings. However, you could try it the other way round: use a Hubspot form (with a start date field) with the above code from my comment, and create a meeting using the Engagements API in the onFormSubmit method.

[piersg]

@Vhuang the Engagements API is the one you want.

[Vhuang]

thanks @piersg ! I tried to play a bit with the Engagements API but it looks like there is no way to trigger the tracking code after the meeting is booked, like you suggested with the onFormSubmit function

[Vhuang]

Thanks for the answer @piersg  @sharonlicari

I'm also trying to trigger the Capterra tracking script to load but I would like the script to load after a Hubspot Meeting submission. I could not find any API documentation related to Hubspot meetings. 

Do you guys have any idea how I could do that ?

Thanks in advance,

Valentin

[piersg · Accepted solution]

Hi @casebook_brian,

You could embed your form using the Hubspot HTML embed, which allows you to run scripts on submission. The documentation for that is here.

This might look something like this for you:

<!--[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({
  portalId: "[PORTAL ID]",
  formId: "[FORM ID]",
    onFormSubmit: function($form){
        var capterra_vkey = '5d2b6f627d0237c03299f0be0800f1c5',
        capterra_vid = '2141917',
        capterra_prefix = (('https:' == document.location.protocol)
          ? 'https://ct.capterra.com' : 'http://ct.capterra.com');

        var ct = document.createElement('script');
        ct.type = 'text/javascript';
        ct.async = true;
        ct.src=capterra_prefix + '/capterra_tracker.js?vid='
          + capterra_vid + '&vkey=' + capterra_vkey;

        var s = document.getElementsByTagName('script')[0];
        s.parentNode.insertBefore(ct, s);
    }
  });
</script>

As you said you are using GTM, you can also set up events that trigger on form submission through GTM, and then add the Capterra script as a custom HTML tag. There's a step by step guide to setting that up here. 

This is one event to track every Hubspot form submission in GTM and GA. However, the event doesn't get the name of the submitted form, just the GUID, so if you want the actual name of the form to appear in your events in GA you'll have to set up separate events for each form with the name in GTM. It's mostly the same process, just some extra steps.

[sharonlicari]

Hey @casebook_brian 

Thank you for the information provided.I'll tag a few experts that can share their experience with you.  

Hey @Kevin-C @prosa @piersg any thoughts you would like to share with @casebook_brian ?   

Thanks

Sharon