Google Analytics integration

From ClickTale Wiki
Jump to: navigation, search


About the ClickTale®-Google Analytics Integration


Google Analytics excels at demonstrating how people navigate between pages. However, sometimes it can be difficult to visualize how visitors navigate within a given webpage and what affects their behavior.

The ClickTale and Google Analytics integration brings together the most valuable qualities of both analytics solutions, combining the conversion metrics of Google with ClickTale’s visual Heatmaps, Session Playback and segmentation capabilities.

GA CT.png

In case you are using Google Universal Analytics, please see this wiki article

This document is also available as a PDF file Adobe reader.jpg

Values of the Integration

The integration of ClickTale with Google Analytics will enable you to:

  • Improve site usability and customer satisfaction by analyzing the way different visitor segments behave inside the pages of your website
  • Boost conversion rates of landing pages, online forms and shopping carts by watching recordings and analyzing heatmaps of visitors who are not converting
  • Leverage existing investments in your Google Analytics reports to learn more about visitor usability and in-page behavior
  • Maximize ROI from existing marketing channels by uncovering what visitors from each campaign are looking for, and what would improve their online experience


Quick and Easy Setup



To integrate ClickTale with Google Analytics:

1. Add a small snippet of code to capture the ClickTale Visitor IDs as a custom variable in Google Analytics.

2. Use Google Analytics to extract the relevant ClickTale Visitor IDs to search for specific recordings or use in aggregate with ClickTale reports.

GA-CT integration.png


Integration Instructions

This section provides the instructions for integrating ClickTale and Google Analytics.

Step 1 - Importing ClickTale's IDs into Google Analytics

Every time a new visitor comes to your site, they receive a ClickTale User ID (CTUID). When integrating ClickTale with Google Analytics, each new ClickTale User ID that is created is imported into Google Analytics as a custom variable called CTUID.

ClickTale supports two types of tracking code - Balkan and Atlas. The implementation instructions for Google Analytics vary depending on the type of ClickTale code you have deployed.

To find the ClickTale code type your project uses, click here.


Balkan-Type Tracking Code

This section describes how to implement the ClickTale Balkan tracking code with Google Analytics' asynchronous and traditional codes.

A) GA’s Asynchronous Tracking Code (Default)

You should already have the following code as part of your ClickTale code. The text marked by comments is the text that you should add.

<!-- ClickTale Bottom part -->
 
<script type='text/javascript'>
 
// The ClickTale Balkan Tracking Code may be programmatically customized using hooks:
//
function ClickTalePreRecordingHook() {
 
window.ClickTaleOnRecording = function () {
 
<!-- GA-CT integration code begin -->
      if (window['_gaq']) {
     _gaq.push(['_setCustomVar', 1, "CTUID", ClickTaleGetUID(), 1]);
     _gaq.push(['_trackPageview']);
     }
<!-- GA-CT integration code end-->
 
     }
}
//
// For details about ClickTale hooks, please consult the wiki page http://wiki.clicktale.com/Article/Customizing_code_version_2
 
document.write(unescape("%3Cscript%20src='"+ (document.location.protocol=='https:'?
"https://clicktalecdn.sslcs.cdngc.net/wwwcc/ptc/xxxxxx-xxxx-xxxx-xxx- xxxxxx.js":
"http://cdn.clicktale.net/wwwxx/ptc/xxxxxx-xxxx-xxxx-xxx- xxxxxx.js")+
"'%20type='text/javascript'%3E%3C/script%3E"));
 
</script>
<!-- ClickTale end of Bottom part -->


NOTES:

  • If you are already using custom variables in Google Analytics, you may need to use a different key (in the above code, key 1 is used).
For more information, visit the Google Analytics Developers website.
  • If you are already calling trackPageView in another location, then you can specifically remove that line in the code above. Otherwise, this code might duplicate your page count in Google Analytics.
  • If you are implementing with Google Tag Manager, then you will be pasting in an asynchronous version of our tracking code. In this case, the same Google Analytics code will still be implemented within the ClickTalePreRecordingHook function.


B) GA’s Traditional Code Version

You should already have the following code as part of your ClickTale code. The text marked by comments is the text that you should add.

<!-- ClickTale Bottom part -->
 
<script type='text/javascript'>
 
// The ClickTale Balkan Tracking Code may be programmatically customized using hooks:
//
function ClickTalePreRecordingHook() {
 
window.ClickTaleOnRecording = function () {
 
<!-- GA-CT integration code begin -->
window.ClickTaleOnRecording = function () {
  if (window['pageTracker']) {
  pageTracker._setCustomVar(1, "CTUID", ClickTaleGetUID(), 1);
  pageTracker._trackPageview();
     }
  }
 
<!-- GA-CT integration code end-->
 
}
//
// For details about ClickTale hooks, please consult the wiki page http://wiki.clicktale.com/Article/Customizing_code_version_2
 
document.write(unescape("%3Cscript%20src='"+ (document.location.protocol=='https:'?
"https://clicktalecdn.sslcs.cdngc.net/wwwcc/ptc/xxxxxx-xxxx-xxxx-xxx- xxxxxx.js":
"http://cdn.clicktale.net/wwwxx/ptc/xxxxxx-xxxx-xxxx-xxx- xxxxxx.js")+
"'%20type='text/javascript'%3E%3C/script%3E"));
 
</script>
<!-- ClickTale end of Bottom part -->


NOTES:

  • If you are already using custom variables in Google Analytics, you may need to use a different key (in the above code, key 1 is used).
For more information, visit the Google Analytics Developers website.
  • If you are already calling trackPageView in another location, then you can specifically remove that line in the code above. Otherwise, this code might duplicate your page count in Google Analytics.
  • If you are implementing with Google Tag Manager, then you will be pasting in an asynchronous version of our tracking code. In this case, the same Google Analytics code will still be implemented within the ClickTalePreRecordingHook function.


Atlas-Type Tracking Code

This section describes how to implement the ClickTale Atlas tracking code with Google Analytics' asynchronous and traditional codes.

You should already have the following code as part of your ClickTale code. The text marked by comments is the text that you should add.

A) GA’s Asynchronous Tracking Code
<!-- ClickTale Bottom part -->
 
<div id="ClickTaleDiv" style="display: none;"> </div>
 
<script type="text/javascript">
if(document.location.protocol !='https:')
document.write(unescape("%3Cscript%20src='"
+'http://cdn.clicktale.net/www/' + "WRe2.js'%20type='text/javascript'%3E%3C/script%3E"));
</script>
 
<script type="text/javascript">
if(typeof ClickTale=='function')
ClickTale([project id],[recording ratio %],["partition #"]);
 
<!-- GA-CT integration code begin -->
function ClickTaleOnRecording()
{
if (window['_gaq']) {
     _gaq.push(['_setCustomVar', 1, "CTUID", ClickTaleGetUID(), 1]);
     _gaq.push(['_trackPageview']);
    }
  }
<!-- GA-CT integration code end-->
 
</script>
 
<!-- ClickTale end of Bottom part -->

NOTES:

  • If you are already using custom variables in Google Analytics, you may need to use a different key (in the above code, key 1 is used).
For more information, visit the Google Analytics Developers website.
  • If you are already calling trackPageView in another location, then you can specifically remove that line in the code above. Otherwise, this code might duplicate your page count in Google Analytics.
  • If you are implementing with Google Tag Manager, then you will be pasting in an asynchronous version of our tracking code. In this case, the same Google Analytics code will still be implemented within the ClickTalePreRecordingHook function.


B) GA’s Traditional Code

You should already have the following code as part of your ClickTale code. The text marked by comments is the text that you should add.

<!-- ClickTale Bottom part -->
 
<div id="ClickTaleDiv" style="display: none;"></div>
<script type="text/javascript">
if(document.location.protocol !='https:')
document.write(unescape("%3Cscript%20src='"
+'http://cdn.clicktale.net/www/' + "WRe2.js'%20type='text/javascript'%3E%3C/script%3E"));
</script>
<script type="text/javascript">
if(typeof ClickTale=='function')
ClickTale([project id],[recording ratio %],["partition #"]);
 
<!-- GA-CT integration code begin -->
function ClickTaleOnRecording()
{
  if (window['pageTracker']) {
  pageTracker._setCustomVar(1, "CTUID", ClickTaleGetUID(), 1);
  pageTracker._trackPageview();
    }
  }
<!-- GA-CT integration code end-->
 
</script>
 
<!-- ClickTale end of Bottom part -->

NOTES:

  • If you are already using custom variables in Google Analytics, you may need to use a different key (in the above code, key 1 is used).
For more information, visit the Google Analytics Developers website.
  • If you are already calling trackPageView in another location, then you can specifically remove that line in the code above. Otherwise, this code might duplicate your page count in Google Analytics.
  • If you are implementing with Google Tag Manager, then you will be pasting in an asynchronous version of our tracking code. In this case, the same Google Analytics code will still be implemented within the ClickTalePreRecordingHook function.


Step 2 - Creating a Report in Google Analytics

User IDs are imported as a custom variable, which are available when setting up a report in Google Analytics.

Setting up the report:

  • Go to "Standard Reporting"
  • Click to Audience >> Custom >> Custom Variables
  • Click the CTUID variable that appears in the variable list.

You will be presented with a list of ClickTale visitor IDs.


1

GA integration CTUIDs.png

  2
GA New2.png
3
GA New3.png


Step 3 - Viewing ClickTale Reports and Session Playbacks

  • To view recordings for a specific User ID, simply log into your ClickTale account, copy the CTUID from GA and use it to filter recordings or reports.
You can paste multiple CTUIDs into the filter box. To do this easily, export the report data to CSV or Excel and copy all the CTUIDs you need.


GA New CT1.png   GA New CT2.png