Google Analytics Integration
Google Analytics is a popular tool in a Marketer’s toolkit. It serves as a single source of truth for managing website traffic, engagement, and conversion data.
Discovering emerging customer trends and having the right data to visualize marketing campaigns' performance is crucial when the Marketing team decides to invest in different channels. Google Analytics enables data-driven decisions with its inherent capabilities and some help from friends (Google Tag Manager, Google Adwords, and Insent).
Insent enables you to integrate with Google Analytics by adding a few lines of code to the Insent Javascript that you have added to your website.
Benefits of Integrating with Google Analytics
- Setup ROI tracking in Google Analytics by pushing website activity and chat conversion data from Insent.
- Visualize your chat conversion metrics such as greeting messages clicked, emails captured or meetings booked in Google Analytics.
- Optimize your Ad spend by driving traffic to pages with conversational experiences that have high conversion rate.
Here is the list of events that you can send from Insent to Google Analytics:
Event | Event Code(Camel Case) | Description |
The visitor started a conversation | startConversation | This event fires when a visitor interacts with the Greeting message or the widget icon and starts a conversation (active and minimized states). |
Email collected in chat | emailCapture | This event fires when a visitor submits an email in the ‘Email’ form field in the ‘Capture user data’ step during live chat. |
Phone number collected in chat | phoneNumberCapture | This event fires when a visitor submits a phone number in the ‘Phone Number’ field in the ‘Capture user data’ step during live chat. |
Meeting booked in the native calendar | calendarBooked | This event fires when a visitor books a meeting through the 'Book a meeting' step during live chat. This event describes the meetings booked to the Microsoft and Google calendars. |
Calendar link clicked | calendarLinkClicked | This event fires when a visitor clicks on a calendar URL shared in the ‘Show a calendar link’ step. |
Button clicked in the widget | buttonClicked | This event fires when a visitor clicks any button shown in the chat widget. |
Greeting message closed | greetingMessageClosed | This event fires when a visitor closes the greeting message popup by clicking the 'x' mark on the chat widget's top right corner. |
Initialize the Insent Widget
The Insent event function indicates that the Insent chat widget is available for use. It contains a single argument, the event object that can be pushed to Google Analytics.
JavaScript - Sample Event Tracking Script
<script> if(!window.insent) window.insent = {}; // We initialize the window.insent value if the script does not load first. window.insent.eventName = function(event){ console.log(event); } </script>
event is a JSON object that describes widget metadata for all tracked events in the widget. The next section describes the list of all events you can add to the Insent JS.
Widget Events tracked by Insent
Insent allows you to push tracking data to other platforms by adding scripts for each tracked event.
JavaScript - Widget events
<script> if(!window.insent) window.insent = {}; window.insent.startConversation = function(event){ // We initialize the window.insent value if the script does not load first. console.log("Conversation Started"); console.log(event); } window.insent.emailCapture = function(event){ console.log("Email Captured!"); console.log(event); } window.insent.phoneNumberCapture = function(event){ console.log("Phone Number Captured!"); console.log(event); } window.insent.calendarBooked = function(event){ console.log("Calendar Meeting Booked"); console.log(event); } window.insent.calendarLinkClicked = function(event){ console.log("Calendar Link Clicked"); console.log(event); } window.insent.buttonClicked = function(event){ console.log("Button Clicked"); console.log(event); } window.insent.greetingMessageClosed = function(event){ console.log("Greeting Message Closed"); console.log(event); } </script>
Note: You can choose to push tracking data only for specific events. You can do this by including JavaScript snippets for the events you would like to push to Google Analytics.
E.g.: To record only emailCapture and phoneNumberCapture event data, include scripts for the emailCapture and phoneNumberCapture events.
JavaScript Snippet for select events
<script> if(!window.insent) window.insent = {}; window.insent.emailCapture = function(event){ console.log("Email Captured!"); console.log(event); } window.insent.phoneNumberCapture = function(event){ console.log("Phone Number Captured!"); console.log(event); } </script>
Sample Google Analytics Configuration Script with all widget events
Here’s how your final configuration script to send data to Google Analytics will look like. You will need to add this below the Insent Javascript code on web pages where Insent is live.
Please refer to this article on the Insent JavaScript setup process if you are configuring Insent on your website for the first time.
JavaScript - Sending data to Google Analytics
<script> if(!window.insent) window.insent={}; window.insent.startConversation = function(event) { ga('send', { 'hitType': 'event', 'eventCategory': 'Insent Chat', 'eventAction': 'CONVERSATION_STARTED', 'eventLabel': window.location.href }); } window.insent.emailCapture = function(event) { ga('send', { 'hitType': 'event', 'eventCategory': 'Insent Chat', 'eventAction': 'EMAIL_CAPTURED', 'eventLabel': window.location.href }); } window.insent.phoneNumberCapture = function(event) { ga('send', { 'hitType': 'event', 'eventCategory': 'Insent Chat', 'eventAction': 'PHONE_NUMBER_CAPTURED', 'eventLabel': window.location.href }); } window.insent.buttonClicked = function(event) { ga('send', { 'hitType': 'event', 'eventCategory': 'Insent Chat', 'eventAction': 'BUTTON_CLICKED', 'eventLabel': window.location.href }); } window.insent.greetingMessageClosed = function(event) { ga('send', { 'hitType': 'event', 'eventCategory': 'Insent Chat', 'eventAction': 'GREETING_MESSAGE_CLOSED', 'eventLabel': window.location.href }); } </script>
You are now ready to push widget event data to Google Analytics and attribute prospect conversions through conversational chat in Insent.
Using Google Tag Manager to push widget events to Google Analytics
To track Insent chat widget events in Google Analytics through the Google Tag Manager, you will need to do the following:
- Add the Insent event tracking script from Google Tag Manager in a Custom HTML Tag with a custom event trigger, This would help set up the Insent event listener script on your target webpages.
- Create dataLayer variables in Google Tag Manager to accept eventCategory, eventAction, and eventLabel values for events dynamically. (User-Defined Variables → dataLayer variables)
- Send Event data collected in GTM through the Google Analytics Event tag.
- Deploy the Insent event tracking script live on your web pages through Google Tag Manager (Publish).
To track the Insent chat widget interactions in Google Analytics using Google Tag manager, add the script below in a GTM Custom HTML Tag with a custom event trigger where the event equals gtm.dom
The Insent event listener custom HTML tag listens for the Insent JavaScript events on pages where you have an active Insent JavaScript and pushes data about each Insent widget interaction to the GTM dataLayer.
The Event data in the GTM dataLayer can then be pushed to Google Analytics through GA events in the Google Tag Manager.
Note: The GA events will be captured in Google Tag Manager through dataLayer variables that listen for eventAction, eventCategory and eventLabel. This requires additional setup described later in this article.
Script to push Insent widget events to GTM (as a custom HTML)
<script> if(!window.insent) window.insent={}; window.insent.startConversation = function(event) { dataLayer.push({ 'event': 'Insent', 'eventCategory': 'Insent Chat', 'eventAction': 'CONVERSATION_STARTED', 'eventLabel': window.location.href }); } window.insent.emailCapture = function(event) { dataLayer.push({ 'event': 'Insent', 'eventCategory': 'Insent Chat', 'eventAction': 'EMAIL_CAPTURED', 'eventLabel': window.location.href }); } window.insent.phoneNumberCapture = function(event) { dataLayer.push({ 'event': 'Insent', 'eventCategory': 'Insent Chat', 'eventAction': 'PHONE_NUMBER_CAPTURED', 'eventLabel': window.location.href }); } window.insent.buttonClicked = function(event) { dataLayer.push({ 'event': 'Insent', 'eventCategory': 'Insent Chat', 'eventAction': 'BUTTON_CLICKED', 'eventLabel': window.location.href }); } window.insent.greetingMessageClosed = function(event) { dataLayer.push({ 'event': 'Insent', 'eventCategory': 'Insent Chat', 'eventAction': 'GREETING_MESSAGE_CLOSED', 'eventLabel': window.location.href }); } </script>
Create Data Layer Variables in GTM
The dataLayer variables that are used in the Insent Event Listener tag need to be added to GTM.
You need to create dataLayer variables for eventCategory , eventAction , eventLabel.
- To create a data layer variable in GTM, go to Variables → User-Defined Variables.
- Click New and Choose the Data Layer Variable type.
- Add the dataLayer variable name and ensure the dataLayer version is Version 2
These dataLayer variables will be used in the Google Analytics Event Tag to track the Insent widget events dynamically.
Google Analytics Event Tag for Insent in GTM
We will next need to set up a Google Analytics Event Tag to send Insent chat widget events captured in Google Tag Manager to Google Analytics through Event tags.
Go to the Tags section and select Universal Analytics Google Analytics. In the Track Type drop-down select Event.
Then add {{eventCategory}}, {{eventAction}}, {{eventLabel}} to the Category, Action and Label Event Tracking Parameters.
For each type of Insent widget interaction (startConversation , emailCapture, etc), the values for dataLayer variables (eventCategory, eventAction, and eventLabel) will be dynamically populated in the Google Analytics Event Tag based on the visitor interaction with the Insent chat widget.
Deploy the GTM script on your webpages
Finally, deploy the Insent event tracking script live on your web pages through Google Tag Manager by clicking Publish on Google Tag Manager. You can set up configurations to include this script on specific pages of your website.
In Google Analytics
You can find all Insent events in the Behavior → Events tab.
You can track all event values through the Event Label parameter.
You can also track events in real-time as your website visitors are active on your website and interact with the widget or submit data through the bot form, in the Realtime → Events section.
You are always welcome to contact our Customer Success team at success@insent.ai or reach out to us through the Insent widget for any further clarifications or questions!