Intercom Chat Event Listener
How to track Intercom Chat Interactions with google tag manager
Intercom is used in providing excellent customer support to your website visitors, but tracking how users interact with the chat widget will help enhance your measurement data.
To implement this, the easy way, you can use Google Tag Manager and the Intercom chat event listener javascript code.
Create a custom HTML tag type, paste the javascript code you copied, but you have to make some customization to the event listener for it to work.
You’ll have to change the app_id value, which you can find at the beginning of the code, to your account app ID.
<script type=”text/javascript”>
window.intercomSettings = {
app_id: “<app_id here>”
};
</script>
Save the custom HTML tag and add a Pageview or DOM Ready trigger (Recommended for all cases)
💡PRO TIP: use the DOM ready if you implemented Intercom chat through Google Tag Manager
What happens is the Intercom event listener fires 2 events for the intercom open and close chat widget;
[intercomOpened] –> for when the user opens the Intercom Chat Widget
[intercomOpened] –> for when the chat widget is closed
Create the custom events in Google Tag Manager, and attach them to the appropriate analytics tag (Google Analytics, Heap, Mixpanel, etc.)
Once you’re done with this, you should debug to test and then you can publish your GTM container.
<script type="text/javascript"> window.intercomSettings = { app_id: "<app_id here>" }; </script> <script type="text/javascript"> (function() { var c = window, a = c.Intercom; if ("function" === typeof a) a("reattach_activator"), a("update", intercomSettings); else { var e = document, d = function() { d.c(arguments) }; d.q = []; d.c = function(b) { d.q.push(b) }; c.Intercom = d; a = function() { var b = e.createElement("script"); b.type = "text/javascript"; b.async = !0; b.src = "https://widget.intercom.io/widget/xe395ivj"; var f = e.getElementsByTagName("script")[0]; f.parentNode.insertBefore(b, f) }; c.attachEvent ? c.attachEvent("onload", a) : c.addEventListener("load", a, !1) } })(); </script> <script type="text/javascript"> window.Intercom("onShow", function() { window.dataLayer.push({ event: "intercomOpened" }) }); window.Intercom("onHide", function() { window.dataLayer.push({ event: "intercomClosed" }) }); </script>