Reporting & Analytics

cjsf2323
Participant

Tracking booked meetings through Google Tag Manager

Résolue

I'd like to track booked meetings using GTM. I had a solution that was working until about a month ago: https://integrate.hubspot.com/t/help-with-gtm-trigger-firing-on-the-meeting-form-submit/2874/22

 

It appears that something recently changed within HubSpot's back end that prevents this method from working.

 

I reviewed the following resources but wasn't able to work it out from them.

https://community.hubspot.com/t5/Reporting-Analytics/Tracking-form-submissions-through-Google-Tag-Ma...

https://www.3whitehats.com/knowledge/tracking-hubspot-forms-google-tag-manager/

https://community.hubspot.com/t5/HubSpot-Ideas/Allow-for-conversion-tracking-with-Meetings-in-HubSpo...

https://www.hubspot.com/product-updates/meetings-integrates-better-with-the-hubspot-platform

https://gist.github.com/thomas88/a6ce89ee577ee3f8f5e6f8ed599e5a23

 

Anyone successfully tracking booked meetings using Google Tag Manager? Ridiculous that this functionality doesn't natively exist.

1 Solution acceptée
derekcavaliero
Solution
Contributeur de premier rang | Partenaire solutions Diamond
Contributeur de premier rang | Partenaire solutions Diamond

Tracking booked meetings through Google Tag Manager

Résolue

@cjsf2323 

 

Actually, looking at that post - it does appear that the solution in there will work - though the message in the event listener has changed.

 

<script>
window.addEventListener( 'message', function(event) {
  if ( event.origin != 'https://app.hubspot.com' )
    return false;
  if ( event.data.meetingBookSucceeded ) {
    // Fire your misc tracking code here...
} }); </script>

Original credit to @antoinepotloc for the original idea.

 

The only difference between his and my code above is that the event data key changed from event.data.meetingCreated to event.data.meetingBookSucceeded.

 

A couple few things you need to be aware of:

  1. This event listener needs to be installed on the page where the embed code for the scheduler is implemented.
  2. The code above doesn't actually do any tracking, thats up to you 😄
  3. Window.postMessage() doesn't work in older IE (< 10) so depending on your demographic/industry that may still be a problem. But something is better than nothing. 
Derek Cavaliero
Director of Engineering

WebMechanix
www.webmechanix.com

Voir la solution dans l'envoi d'origine

33 Réponses
AraHarutyunyan
Membre

Tracking booked meetings through Google Tag Manager

Résolue

@derekcavaliero Thank you for your prompt reply. Appreciate it. 

From what I understood embedding the scheduling system is the best solution in this case. 

Many thanks, 
Ara

0 Votes
RLundstrom
Participant

Tracking booked meetings through Google Tag Manager

Résolue

@derekcavaliero First, thank you for your generous support on this. I've been through lots of threads and you seem to be the one most knowledgeable on this topic.

 

I'm hoping you have figured this out. 

 

But this solution is working to the extent that the events are firing, yes, but the data necessary to tune the algo's isn't being sent.

 

See here: https://share.getcloudapp.com/v1ujxgqQ

Have you been able to solve this problem yet? 

 

Sure appreciate any help. Thanks,

Russell

 

0 Votes
derekcavaliero
Contributeur de premier rang | Partenaire solutions Diamond
Contributeur de premier rang | Partenaire solutions Diamond

Tracking booked meetings through Google Tag Manager

Résolue

Hey @RLundstrom ,

 

There actually is a way to hack this together.

 

Basically what you need to do is build a custom hubspot module to embed a meeting into a page, but instead of using the default functitonality - you embed a hubspot form into the page to block access to the scheduler, that when submitted passes the field key:value pairs via a query string on the embed code. This will actually prefill the fields in the meeting tool, and you can then configure the meeting tool to automatically submit when the fields are all known (prefilled). 

So in order to capture the user data (which I assume you are using for enhanced conversions in either Google Ads and/or Facebook) you would need to use the onFormSubmit() callback and push the data into the dataLayer to access whenever the meeting booking trigger fires.

 

^ all of that is a decent amount of work, honestly HubSpot should expose the data submittted through the meeting ttool in the event payload unfortuntately I don't think we're going to get that anytime soon.

 

I have a working demo of this that I could show you, if you are interested.

Derek Cavaliero
Director of Engineering

WebMechanix
www.webmechanix.com
advaisorAG
Participant

Tracking booked meetings through Google Tag Manager

Résolue

Hi there

 

I believe I have followed all the demonstrated steps:

1. create a listener tag

hubspotmeetinglistener-tag.PNG

 

2. create a custom event trigger

hubspotmeeting-trigger.PNG

 

3. create  a variable

hubspotmeeting-variable.PNG

 

4. create a Google Analytics tag for the form submission

hubspotmeeting-tag-analytics.PNG

 

But for some reason, however, when I test this in preview mode it only fires the listener, but not the Google Analytics tag once the meeting form is submitted.

 

Do you know what the problem could be? Thanks a lot for your help on this!

0 Votes
derekcavaliero
Contributeur de premier rang | Partenaire solutions Diamond
Contributeur de premier rang | Partenaire solutions Diamond

Tracking booked meetings through Google Tag Manager

Résolue

@advaisorAG HubSpot's meetings tool doesn't return a value in event.data.id for the meetings tool.

 

Also - you need to make sure that you're using the HubSpot meeting embed and not manually iframing your hosted meetings page - tracking won't work that way.

 

Lastly - give the following script a try in place of yours. Since the meetings tool isn't a HubSpot form I created a separate GTM event 'hubspot-meeting-success'. You can create a trigger using that event. 

<script>
window.addEventListener( 'message', function(event) {
  
  // Note, you need to have the meeting scheduler embedded on a page where this event listener is also active. Take a look at the domain of the iframe the scheduler is embedded through and make sure it matches this conditional check.
  if ( event.origin != 'https://meetings.hubspot.com' )
    return false;
  
  // You'll need our GTM base code installed so that this dataLayer push triggers events to various platforms.
  if ( event.data.meetingBookSucceeded ) {
    window.dataLayer.push({
      'event': 'hubspot-meeting-success'
    });
  }
  
});
</script>
Derek Cavaliero
Director of Engineering

WebMechanix
www.webmechanix.com
0 Votes
advaisorAG
Participant

Tracking booked meetings through Google Tag Manager

Résolue

Hi Derek

 

Thanks a lot for your effort. Unfortunately, it still does not work. I have embedded the meeting code, tried your script for the listener and the new event name "event-meeting-success" for the trigger. 

Also the Hubspot tag is already active on the page (see screenshot)hubspot-tag.png

0 Votes
derekcavaliero
Contributeur de premier rang | Partenaire solutions Diamond
Contributeur de premier rang | Partenaire solutions Diamond

Tracking booked meetings through Google Tag Manager

Résolue

@advaisorAG Looking at your page it looks like you have the embed script inside another <iframe>

 

That won't work - you need to have the embed code directly implemented into the frame where your GTM container is loaded.

 

Screen Shot 2020-05-13 at 9.38.35 AM.png

 

Notice in the screenshot above that there is an <iframe> loading this url: https://www-advaisor-io.filesusr.com/html/8070f9_37321681de41cdf66e1586ac3637562f.html which is where the embed script is present.

 

This may be a Wix limitation - they do some pretty unconventional/unecessary things with their HTML markup. 

 

If Wix has an option to add a raw HTML block into a page - I'd try to implement the meeting embed code there instead of how you have it now.

Derek Cavaliero
Director of Engineering

WebMechanix
www.webmechanix.com
0 Votes
derekcavaliero
Contributeur de premier rang | Partenaire solutions Diamond
Contributeur de premier rang | Partenaire solutions Diamond

Tracking booked meetings through Google Tag Manager

Résolue

@advaisorAG could you provide a link to the page where you are embedding the scheduler? 

Derek Cavaliero
Director of Engineering

WebMechanix
www.webmechanix.com
0 Votes
advaisorAG
Participant

Tracking booked meetings through Google Tag Manager

Résolue
0 Votes
cjsf2323
Participant

Tracking booked meetings through Google Tag Manager

Résolue

Thanks @derekcavaliero.

 

For anyone who needs a more explicit walkthrough, here's my working GTM setup. First is a customer listener set to fire on your scheduling page

 

Screen Shot 2019-06-26 at 9.23.04 AM.png

 

I then have a Custom Event trigger

 

Screen Shot 2019-06-26 at 9.25.02 AM.png

 

that I use to trigger all my tags, e.g.

 

Screen Shot 2019-06-26 at 9.26.02 AM.png

 

Good luck!

hollis
Participant

Tracking booked meetings through Google Tag Manager

Résolue

I see you have this for Adwords, Google Analytics and Facebook do you know how to do this for Bing?

0 Votes
donparcellab
Participant

Tracking booked meetings through Google Tag Manager

Résolue

That worked for me! THANKS!

derekcavaliero
Contributeur de premier rang | Partenaire solutions Diamond
Contributeur de premier rang | Partenaire solutions Diamond

Tracking booked meetings through Google Tag Manager

Résolue

Thanks @cjsf2323 

 

I would suggest to let that event listener run on all pages of your site though - that way if you embed a scheduler elsewhere it will work. The listener won't hurt anything if it is set where the scheduler isn't embedded.

Derek Cavaliero
Director of Engineering

WebMechanix
www.webmechanix.com