Reporting & Analytics

jamesthrasher
Participante

HubSpot Chat & Google Analytics Event Tracking

resolver

I've used both snippets below to push a GA event whenever a conversation is started, but neither seem to work. Can anyone tell me what I'm doing wrong here?

 

 

//Option A
<script type="text/javascript">
   window.HubSpotConversations.on('conversationStarted', payload => { ga('send', 'event', 'Beacon', 'chat-started', 'Hubspot'); });
</script>

//Option B
<script type="text/javascript">
window.HubSpotConversations.on('conversationStarted', function(payload){ ga('send', 'event', 'Beacon', 'chat-started', 'Hubspot'); });
</script>

 

 

2 Solução aceitas
Mike_Eastwood
Solução
Conselheiro(a) de destaque | Parceiro Ouro
Conselheiro(a) de destaque | Parceiro Ouro

HubSpot Chat & Google Analytics Event Tracking

resolver

Looks to me like the HubSpot Javascript is loading after your Javascript fires.

 

So, James added the On Load Event Listener so the Javascript fired after everything loaded.

 

<script type="text/javascript">
window.addEventListener("load", function(){
   window.HubSpotConversations.on('conversationStarted', payload => { ga('send', 'event', 'Beacon', 'chat-started', 'Hubspot'); });
});
</script>

Notice the line:

window.addEventListener("load", function(){

and it's closed with

});

 

Have fun

Mike

Exibir solução no post original

piersg
Solução
Conselheiro(a) de destaque

HubSpot Chat & Google Analytics Event Tracking

resolver

@AORourke @Rortega you can't use arrow functions (and other ECMA6 features) in JS that you use in GTM. @Mike_Eastwood's code was to put on your site to send an event straight to GA. To add it in GTM instead, change Mike's code to remove the arrow function, and also you would have to change the ga() call as that wouldn't work in GTM. Maybe make it a custom HTML tag that pushes a custom event to the dataLayer that you can then use as a trigger for to fire a GTM event that will send event data to GA.

 

<script type="text/javascript">
  window.addEventListener("load", function(){
	window.HubSpotConversations.on('conversationStarted', function(payload){
	    // ga('send', 'event', 'Beacon', 'chat-started', 'Hubspot');
		window.dataLayer.push({
			'event': 'hubspot-chat-started',
			'hs-chat-id': payload.conversation.conversationId
		});
	});
  });
</script>

 

 

 

 

Exibir solução no post original

10 Respostas 10
Djones
Participante

HubSpot Chat & Google Analytics Event Tracking

resolver

Hoping this helps someone.

 

I wrote an article here that breaks down how I track Hubspot chats as GA events  

kvlschaefer
Gerente da Comunidade
Gerente da Comunidade

HubSpot Chat & Google Analytics Event Tracking

resolver

Thanks for sharing, @Djones


Did you know that the Community is available in other languages?
Join regional conversations by changing your language settings !
EXWE-GmbH
Membro

HubSpot Chat & Google Analytics Event Tracking

resolver

Hey,

 

we also ran into some issues regarding the chat widget and tracking our conversions.

Our problem was, that we were using a CookieManager to fulfill German/EU DSGVO...
We found a solution where we first checked for the CookieConsent and later added the eventListeners for the widget, when ready. We wrote everything down in a small article:

English:
https://www.exwe.de/en/news/web-development/googleanalytics-hubspot-chat-tracking-with-cookiemanager...

Deutsch:
https://www.exwe.de/de/news/web-entwicklung/googleanalytics-hubspot-chat-tracking-mit-cookiemanager/


The main trick is to check the status:

              if (window.HubSpotConversations) {
                console.log('hubspot chat already running'); 
                onConversationsAPIReady();
              } else {
                console.log('hubspot chat awaiting'); 
                window.hsConversationsOnReady = [onConversationsAPIReady];
              } 

 

0 Avaliação positiva
piersg
Solução
Conselheiro(a) de destaque

HubSpot Chat & Google Analytics Event Tracking

resolver

@AORourke @Rortega you can't use arrow functions (and other ECMA6 features) in JS that you use in GTM. @Mike_Eastwood's code was to put on your site to send an event straight to GA. To add it in GTM instead, change Mike's code to remove the arrow function, and also you would have to change the ga() call as that wouldn't work in GTM. Maybe make it a custom HTML tag that pushes a custom event to the dataLayer that you can then use as a trigger for to fire a GTM event that will send event data to GA.

 

<script type="text/javascript">
  window.addEventListener("load", function(){
	window.HubSpotConversations.on('conversationStarted', function(payload){
	    // ga('send', 'event', 'Beacon', 'chat-started', 'Hubspot');
		window.dataLayer.push({
			'event': 'hubspot-chat-started',
			'hs-chat-id': payload.conversation.conversationId
		});
	});
  });
</script>

 

 

 

 

AORourke
Participante

HubSpot Chat & Google Analytics Event Tracking

resolver

Thank you.

Mike_Eastwood
Solução
Conselheiro(a) de destaque | Parceiro Ouro
Conselheiro(a) de destaque | Parceiro Ouro

HubSpot Chat & Google Analytics Event Tracking

resolver

Looks to me like the HubSpot Javascript is loading after your Javascript fires.

 

So, James added the On Load Event Listener so the Javascript fired after everything loaded.

 

<script type="text/javascript">
window.addEventListener("load", function(){
   window.HubSpotConversations.on('conversationStarted', payload => { ga('send', 'event', 'Beacon', 'chat-started', 'Hubspot'); });
});
</script>

Notice the line:

window.addEventListener("load", function(){

and it's closed with

});

 

Have fun

Mike

Rortega
Participante

HubSpot Chat & Google Analytics Event Tracking

resolver

Hello!

 

I want to tag the chat with tag manager but when I add your script I get and error: 

---

Hay un error en la línea 3, carácter 58: This language feature is only supported for ECMASCRIPT6 mode or better: arrow function.

---

Do you know how to solve it?

 

Best regards

AORourke
Participante

HubSpot Chat & Google Analytics Event Tracking

resolver

I got the same issue. Did you ever find a fix?
The closest related issues i can find is here but their fix does not work on the above code. https://stackoverflow.com/questions/48922855/javascript-compiler-error-in-google-tag-manager-this-la... 

0 Avaliação positiva
Mike_Eastwood
Conselheiro(a) de destaque | Parceiro Ouro
Conselheiro(a) de destaque | Parceiro Ouro

HubSpot Chat & Google Analytics Event Tracking

resolver

Sorry for the delayed reaction @jamesthrasher 

 

Do you see any errors in your browser's inspector when the page loads?

 

Are you able to share (by direct message) a link to the page you're testing?

 

Or ,did you work it out already?

 

Mike

JessicaH
Alunos da HubSpot
Alunos da HubSpot

HubSpot Chat & Google Analytics Event Tracking

resolver

Hi @jamesthrasher,

 

Thanks for reaching out.

I want to tag in some subject matter experts to see if they can assist with this.

Hi @derekcavaliero @Mike_Eastwood @MikeCormack, would you be able to share your thoughts with @jamesthrasher?

 

Thanks!

Jess   


Wusstest du, dass es auch eine DACH-Community gibt?
Nimm an regionalen Unterhaltungen teil, in dem du deine Spracheinstellungen änderst !


Did you know that the Community is available in other languages?
Join regional conversations by changing your language settings !