Track chat interactions and users’ messages preceding a conversion

Google+Tweet about this on TwitterShare on FacebookShare on LinkedIn

One of my clients wanted to know what percentage of live chat conversations resulted in a purchase conversion. In other words, the task was to get the number of conversions performed by the visitors who have interacted with live chat app installed on the site, before a conversion took place, to then compare it to the total conversion number.

Obviously, the solution was quite simple.

  1. detect first user chat interaction
  2. check if cookies are enabled
  3. write a cookie
  4. use the cookie as a value for a user-scoped custom dimension or event’s label in the conversion tag
  5. erase the cookie once the conversion data is sent to GA

But I wanted to go further and get more precise information on this. So, here’s my guide on how to track chat interactions and users’ messages in Google Analytics using Tag Manager.

Hopefully, your final outcome should look something like this:

track chat interactions and users' messages - result

 

The first value of the label is the number of chat interactions and the second one is the number of messages sent by a converted visitor.

Why do it?

The information concerning visitor’s chat interactions can stand you in good stead. From the perspective of your site’s goals, the increase/decrease of the number of interactions and/or user messages can be either a positive or a negative sign.

For example, after a slight redesign of your site’s funnel pages (cart/create order/order confirmed) you notice that the number of interactions on these pages has increased. This might imply that buyers are having problems with the new cart/order form interface.

Or, you notice that the total value of orders made by users who have previously interacted with the chat widget is larger than the value of orders made by those who haven’t wrote a single message. In this case, you would want to drive more visitor’s attention to the widget.

Chapters

  1. Tracking scenario
  2. API
  3. Widget container snippet
  4. Variables
  5. Tracking script
  6. Caveats
  7. Summary

Tracking scenario

Here’s a scheme that illustrates the configuration of the tracking set-up.

track-users-chat-interactions-messages-via-gtm-scheme2-min

Steps 2, 3, 4 are repeated with each user’s message sent to chat (this is what the double angle arrow indicates).

Now, here’s a detailed explanation:

  1. A user sends a message
  1. A check is performed whether this user has ever sent any messages OR the time elapsed after his/her last messages is more than the interaction timeout
  2. If any of the conditions above is true, set chatInteraction cookie.
  3. On each message set chatMessagesCount cookie
  1. Pass cookie data to GA once a conversion action is performed
  2. Erase cookie after conversion

Using this kind of data, not only can we adequately tell how many conversions involved users’ chat interactions, but also how many chat interactions and users’ messages were averagely required for this type of conversions.

API

First of all, since we’ll need some extra information concerning users’ behavior in chat, the solution below requires the usage of widget API. Therefore, before taking any actions, please be sure to get full access to the API’s JS object containing the necessary information.

track chat interactions and messages in google analytics: api

For example, here, to get the amount of time that elapsed from the time a user sent his/her recent message to the operator, I’m using the object property like:

track chat interactions and messages in google analytics: api example

Widget container snippet

First, we’ll need to edit the container snippet of the widget in order to understand when exactly object’s properties that are exposed to the global scope can be accessed during the page rendering.

The native snippet of my widget looks like this:

And here’s how I’ve changed it.

As it will be clear from the subsequent, these events are crucial for proper operation of the whole tracking set-up since all the below scripts and functions use them. So, be sure to have these events pushed to data layer once your widget and API’s object properties have been loaded.

track chat interactions and messages in google analytics: preview summary

Variables

Next, let’s set up the variables we’ll need. There are five of them – two 1st part cookie variables and three custom JS variables.

First, create two 1st party cookie variables and give them descriptive names. My variables here are named like “1PC – chatInteractions” and “1PC – chatMessagesCount”.

track chat interactions and messages in google analytics: cookies

Next, we’ll need three custom JS variables.

This variable is the easiest way to check whether cookies are enabled or not. If they are, it will return true. Otherwise, the value will be false. Name it CU – areCookiesEnabled. Please mind this method is NOT one hundred percent reliable, so be sure to read the caveats at the end of the post.

This variable checks if a user has interacted with the widget before or if it’s a new interaction since his/her last conversion. Name it like CU – isFirstInteraction.

Furthermore, here’s a variable containing a return function statement for deleting cookies.

Use it as a value for the hitCallback field of your UA Event tag which fires once the conversion action is perfomed.

track chat interactions and messages in google analytics: function

Additionally, you may also need a variable for the event’s label (see the result pic in the beginning of the post).

Tracking script

The following script is the core of the whole solution.

Though it may seem to be complicated, the logic behind it is simple:

  1. Get the values of cookies and isFirstInteraction. If cookies do not exist, both cint and cmcount variables will be of undefined type.
  2. If a cookie exists and its value is a finite number, use its value. If not, set the value to zero.
  3. If a message has been sent by a visitor (not operator) and isFirstInteraction is true, create (rewrite) the cookie containing the number of user’s chat interactions (cvalue1).
  4. Set a 5 minute timeout between interactions.
  5. With each visitor’s message create (rewrite) the cookie containing the total number of visitors messages (cvalue2).

You can use any value for the interaction timeout. This also concerns cookies’ exparation time. Use a Custom HTML tag for the script. Also, create a Custom Event trigger which will fire this tag on “API Ready” data layer event.

Caveats

Please do mind the following before setting things up.

  • As it’s been mentioned above, this will only work for those visitors with cookies enabled in their browsers.
  • Be sure to peruse the documentation of your widget’s API (functions, getters, methods etc). This will certainly help speeding up the process and avoiding mistakes.
  • Since all properties and methods of the API’s JS object that your widget provides definitely differ from those used here as example, my tracking script is not a ready-to-use solution that will seamlessly suit your requirements. Provide a working example showing how to track chat interactions and users’ messages in Google Analytics – that is its primary purpose.

Summary

As you probably already know, the usage of your widget’s API opens up great opportunities. You may track your operators by name and see who’s showing a larger profit. Or you may track the average time it takes for a certain operator to answer visitor’s message. It all depends on your business and site’s goals.

If you have any questions and/or improvement suggestions, sound off in the comments below.

Google+Tweet about this on TwitterShare on FacebookShare on LinkedIn