Google Content Experiments integration

From ClickTale Wiki
Jump to: navigation, search
`
ClickTale Wiki
The instructions on this page are intended for self service accounts.
Enterprise customers should contact their account managers for integration support.

ClickTale has updated the integration method for Google Content Experiments (formerly Google Website Optimizer), please make sure you choose the correct integration method based on the type of test you are running.


Google Content Experiments in Split test (A/B testing) mode, will redirect your entry page to a different page based on your configuration. While this is active you will not be able to play or do a report on your entry page in ClickTale.

How the integration Works

No special integration with ClickTale is needed.

GCE experiments contain test versions that are each on a different URL. All you need to do is filter by the URL of the version or compare the two URLs of the versions you want to compare in side-by-side heatmaps, for example.

GCE fix

The following fix prevents any errors in recording or playback for customers using both ClickTale and GCE.

Just surround your existing Google Content Experiment code (on the "original" page) with tags, as shown here:

<!-- ClickTaleExcludeBlock -->
 
<!-- Google Content Experiments code -->
<script>function utmx_section(){}function utmx(){}(function(){var
k = 'XXXXXXX-X', d = document, l = d.location, c = d.cookie;
if(l.search.indexOf('utm_expid='+k)>0)return;
function f(n){if(c){var i=c.indexOf(n+'=');if(i>-1){var j=c.
indexOf(';',i);return escape(c.substring(i+n.length+1,j<0?c.
length:j))}}}var x=f('__utmx'),xx=f('__utmxx'),h=l.hash;d.write(
'<sc'+'ript src="'+'http'+(l.protocol=='https:'?'s://ssl':
'://www')+'.google-analytics.com/ga_exp.js?'+'utmxkey='+k+
'&utmx='+(x?x:'')+'&utmxx='+(xx?xx:'')+'&utmxtime='+new Date().
valueOf()+(h?'&utmxhash='+escape(h.substr(1)):'')+
'" type="text/javascript" charset="utf-8"></sc'+'ript>')})();
</script><script>utmx('url','A/B');</script>
<!-- End of Google Content Experiments code -->
 
<!-- EndClickTaleExcludeBlock -->

Note: The ID in the code varies per test and needs to be changed to the ID you have been provided by from Google Content Experiments.
This will run Google Content Experiments A/B testing in any normal use of the page and not run it when doing ClickTale playback.

Google Website Optimizer

Users of Google Website Optimizer, click the Expand link below for instructions.

 

Google Website Optimizer for Multivariate testing

Website Optimizer has been integrated with Google Analytics as Content Experiments.

On August 1, 2012, Website Optimizer will no longer be available as a standalone product.

Multivariate testing feature has been removed from Google Content Experiments at the moment so the below information is deprecated as of August 1, 2012.

When using GWO Multivariate testing and ClickTale without correct code customization, the playback of the recorded pages and aggregation reports will not be accurate and will probably not display the combination that the user saw.

With the following integration, you will be able to see the correct variation for each visitor and also aggregate each variation separately in Heatmaps or Form Analytics reports.

Introduction

Let's assume we are integrating with a page that has 3 sections and 2 variations for each section.

Finding your GWO experiment ID

The experiment ID is the alphanumeric string immediately following experiment=. For example, in the URL:

https://www.google.com/analytics/siteopt/mv_prepare_install?experiment=AgAAAIuElaplZk1wAusMbP0ZUYo&account=00000001

The experiment ID is AgAAAIuElaplZk1wAusMbP0ZUYo.

Accessing specific combinations by using special URL params

To view a specific combination you can append the following string to your test URL:


#utmxid=Experiment_ID;utmxpreview=Combination_number

Combination_number should look similar to this. In our case: 1-0-1 (2nd variation in first section, 1st variation in second section and 2nd variation in third section)

For more information please see http://www.google.com/support/websiteoptimizer/bin/answer.py?hl=en&answer=63841

Adding customized code to you page

This is done to save the combination that the user sees on the page to be used later for playback.

There are two different scripts depending on whether you have one multivariate test running on your site, or multiple tests running simultaneously.

With one multivariate test on your site

Note: This script can be part of the bottom script that is injected to the page in case you are using a ClickTale integration module.

Add this JS code right after the ClickTale bottom part script: (replace the Experiment_ID with your experiment ID)

<!-- ClickTale-Recording integration start -->
<script type="text/javascript">
	 if (typeof ClickTaleField == 'function' && utmx("combination_string"))  {
   		ClickTaleField('CT.InitialLocationParams', "#utmxid=Experiment_ID;utmxpreview=" + utmx("combination_string"));
   		ClickTaleTag('GWO: ' + utmx("combination_string"));
   	}
</script>
<!-- End Clicktale-Recording Integration End -->

Note: It’s best to keep the experiment ID in a config file along with the unique identifier for the experiment that you can see in the control script (....var k='2376510756',d=....). This way you will not need to copy paste it from page to page and so it will be convenient to use the same code for more than one multivariate experiment running at the same time on different pages.

With multiple multivariate tests on your site

If you have more than one multivariate test on your site and you are using ClickTale integration module or if you don’t want to change the tracking code each time you create another test please use the method explained below:

By using the code below you can define all the experiment IDs for all the MVT testing in your site. You will not need to change the code on the page if this is populated for example from your config file.

Add this JS code at the top part of the page (best place is to put it next to the ClickTale top script):

<!-- ClickTale-MVT experiment ID declaration start -->
<script type="text/javascript">
var Id2ExperimentId={'k1':'ExperimentID1','k2':'ExperimentID2'};
</script>
<!-- ClickTale-MVT experiment ID declaration end -->

Add this JS code right after the ClickTale bottom part script:

Note: This script can be part of the bottom script that is injected to the page in case you are using integration module.

<!-- ClickTale-Recording integration start -->
<script type="text/javascript">
var detectk = "";
    try {
   	 for (var i=0; i<document.getElementsByTagName("script").length; i++) {
   		 var scr = document.getElementsByTagName("script")[i];
   		 var content = scr.innerHTML;
   		 if (content.indexOf("k='") > -1)  {
   			 var match = /\(function\(\){var k='(\d+)',d=document,l=d\.location,c=d\.cookie;/.exec(content);   
   			 if(match && match.length >= 2) {
   				 detectk = match[1];
   			 }
   		 }
   	 }
    }
    catch (e) { detectk = ""; }
    if (detectk != "") {
   	 if (typeof ClickTaleField == 'function' && utmx("combination_string"))  {
   		 ClickTaleField('CT.InitialLocationParams', "#utmxid=" + Id2ExperimentId[detectk] + ";utmxpreview="+utmx("combination_string"));
   		 ClickTaleTag('GWO: ' + utmx("combination_string"));
   	 }
    }</script>
<!-- End Clicktale-Recording Integration End -->