I’ve already covered one third-party tag in Google Tag Manager and today I’d like to cover the second one.

It’s the Mouseflow Tag. Mouseflow basically records and evaluate the actual mouse & click flow of your website visitors. It immensely useful in evaluating user experience on a qualitative level.

But the tag isn’t as straightforward to implement as I thought at first; at least not, if you want to have the tag, push some data into it (in my case A/B testing data), and get some data out of it (in my case, the Mouseflow id, which I want to have in Google Analytics).

As I learned those things are pretty standard in most enterprise level TMS (tag management systems) like Segment or tealium, but in GTM we have to do a little bit of work.

Implementing The Tag

You can find the tag by clicking “new tag” and then Choose tag type > Custom > Mouseflow.

The tag has the following options.

1. Is the so-called “Project ID” which is really your website id. You can find it in Mouseflow at your “Website Settings” (not the global settings.)

2. The HTML Delay is the time in milliseconds you want the recording to start after the tag is initialized.
3. The option called Path is actually quite important if you want to include A/B testing data. Otherwise, it’s just to clear up your Mouseflow data, like removing query parameters etc..
4. Custom Variables are also important if you either want to pass additional information or want to create “virtual” page views.

Getting A/B Testing Data Into Mouseflow

One thing you need for sure, if you are running A/B tests, is to get the variant id into Mouseflow. You do this by applying a little trick. You will rename the page from “/your-page” to “/your-page-variant-id”.

Make sure you are placing this code only on the “Experiment” pages, otherwise you will compromise your other data as the variant id is a value from the cookie and as thus always filled in.

Getting The Mouseflow ID (MFSID) Into Google Analytics

Why would you want to have the Mouseflow id in Google Analytics? Imagine you spotted a potential UX problem on your website, for instance, a form which seems to be ill-designed. How would you evaluate that hypothesis?

One way, to get qualitative input would be to spot sessions which did not submit your form. This you can do with the Mouseflow id. The advantage now is, once you got your sessions by their ids, you can actually head over to Mouseflow and watch the sessions as videos, checking what kinds of problems those guys had.

The MFSID is easy to retrieve, it’s a simple Javascript custom variable:

But make sure you are using this variable only after the Mouseflow tag has loaded. Before, this variable will be set to ‘undefined’. You can do this by defining a specific “Mouseflow Event” for Google Analytics and use that as a “clean up” after loading the Mouseflow tag we already implemented above. Let’s assume

• you already created some empty tag for this.
• you already created a custom dimension with the index “2” in Google Analytics to store the MSFID.

Now configure your Mouseflow tag from above additionally like this:

Then we fill in the details of this “UA – All Pages – Mouseflow Event” now using the MFSID.

And you are all set! Of course, you can also use the MFSID for all your other events, like form submissions etc., because the Mouseflow tag will usually already have loaded. However, the page view tag will usually not capture the MSFID.