Integrating Optimizely with Google Universal Analytics

Last updated:

This article will help you:

  • Integrate Google Universal Analytics to read data from Optimizely
  • Add Google Universal Analytics integration code to your page
  • Track GA metrics as experiment goals
  • Create custom dimensions and reports in Universal Analytics to track and report on Optimizely data
  • Understand issues with .setDomainName, multiple trackers, and objects other than_gaq

If you use Google Analytics (GA) to monitor your site's traffic, you can view the results of your Optimizely experiments alongside the rest of the data that GA collects. In this article, we'll walk through how to implement Google Universal Analytics, and we'll cover some common troubleshooting issues.

 

Tip:

Are you looking for a different Google Analytics Integration? If so, check out our article on implementing Google Analytics Classic or Google Analytics for iOS.


Begin by going to the Integrations tab on the Home page. Select Universal Analytics and toggle the button to ON in the details sidebar to the right.

To enable Google Analytics for an individual experiment, go to that experiment in the Editor, then click Options > Integrations.

 

Tip:

Implementing Optimizely and Google Analytics in a tag manager? Read the tag manager section of our article on implementing Optimizely to find out more about how this will affect your GA tracking code.

If you are using Google's new Universal Analytics for analytics on your website, you may wish to view analytics details for the visitors who have seen a given variation in your Optimizely experiment. 

Prerequisites

  • In order to integrate Optimizely with Universal Analytics, you must have an available Custom Dimension (note: this refers to a Custom Dimension in Google Analytics, not the Optimizely feature) to populate with Optimizely experiment data.
  • You will use the number (index) of the Custom Dimension to configure your Optimizely experiment to send data to.
  • See below to learn how to access your list of Custom Dimensions in Universal Analytics and create one for Optimizely if needed.
  • Optimizely strongly recommends using one Custom Dimension per concurrently running experiment so that their experiment names/variations don't overwrite each other. 
 

Tip:

Check out the Optimizely Academy lesson on integrating with analytics platforms. The Academy is a great place to learn and practice your Optimizely skills and web optimization strategy, from beginner to advanced.

 

Note:

As long as you're testing on the same domain and Optimizely is implemented on the experiment page, you can track session-wide goals in GA.

 

Enable Universal Analytics Integration

Optimizely uses Universal Analytics' "Custom Dimensions" to tag your visitors with the experiments and variations to which they've been added. Configuring Optimizely to begin sending this information to Universal Analytics requires three steps:

  1. Add the following JavaScript code to your site wherever the Universal Analytics code exists after the ga('create'...) function fires and before the Universal Analytics ga('send','pageview') function fires and the tracking call is made (see details in the next section):

     // Optimizely Universal Analytics Integration
     window.optimizely = window.optimizely || [];
     window.optimizely.push("activateUniversalAnalytics");
    
  2. In the Optimizely Editor, go to Options > Integrations then click the Universal Analytics checkbox to enable the integration.



     

    Important:

    By enabling this integration, you actually replace the need to include the UA setDimension code on your page. If you include the ga('set', 'dimension1', dimensionValue); code on your site, you may actually end up overwriting the Optimizely/UA integration.

  3. Select a "Custom Dimension" you'd like Optimizely to use. This Custom Dimension should not already be in use by another part of your site, or by another currently-running Optimizely experiment.

  4. Specify a "custom tracker" if you are using a custom event tracker other than the default. This will change Optimizely's integration call to use the custom tracker rather than the default. For example, if your website is using the call:
    ga('tracker2.send', 'pageview');
    then you would enter tracker2 into the Specify a custom tracker field, and Optimizely would integrate with tracker2 instead of the default tracker.
 

Note:

The Optimizely API call in step #1 will set custom dimension values for all active Optimizely experiments that are configured to use the Universal Analytics integration and is safe to make even if no experiments are currently configured to use it.

Essentially, you can add this code sitewide, once, and never have to change it again.

The only exception is if you have experiments using manual or conditional activation. If you're using these activation modes, you may need to re-activate UA (step 1) and send a second GA pageview call after the experiment is activated.

Place the API Call

We recommend adding this code to your site as the last call that is made before the pageview, especially if you are using the cookieDomain function.

The latest tracking code can be obtained from Google Analytics by navigating to the Admin tab, then clicking Tracking Info > Tracking Code

A sample setup might look like this:

<html>
  <head>
    <script src="//cdn.optimizely.com/js/XXXXXXX.js"></script> 
  </head>
  <body>
    ...
    <script type="text/javascript">
// Universal Analytics Setup
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o), m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m) })(window,document,'script','//www.google-analytics.com/analytics.js','ga');

ga('create', 'UA-40337519-1', 'www.mysite.com');

// Optimizely Universal Analytics Integration code
window.optimizely = window.optimizely || [];
window.optimizely.push(['activateUniversalAnalytics']);

ga('send', 'pageview'); </script> </body> </html>

 

Create a Custom Dimension

In order to integrate Optimizely with Universal Analytics and view reports based on the integration data, you must configure a Universal Analytics custom dimension first. This dimension, and the name you give it, will be used to create reports that leverage your Optimizely integration data for filtering.

  1. While logged in as an Admin, click the Admin tab at the top and you should be brought to a page like this:



  2. Click the Custom Definitions link under the middle Property column and then select Custom Dimensions. You should be brought to a tab like this: 



  3. If the Custom Dimension you want to integrate your Optimizely experiment with is listed on this tab (the 'dimension number' is shown in the Index column), then you can just take note of the name for that Dimension and don't need to add one.

  4. If the Custom Dimension is not listed on this tab, you'll need to create a new Custom Dimension for use with Optimizely. To do this, click the New Custom Dimension button and give the New Dimension a name and a Scope. Optimizely strongly recommends using the Session level scoping, which is defined by Google as "value is applied to all hits in a single session."


     

    Note:

    While our recommended integration is scoped at the session level, you can also configure your integration to be scoped at the user level. Our default integration uses session scope to minimize the possibility of overwriting your experiment data sent to Google Analytics, but if you're tracking complex conversions that span multiple sessions, you may prefer to scope at the user level. For more information, see Google's documentation on scoping.

    If you do this, just be cautious of reusing Custom Dimensions in GA, and for consistency between GA and Optimizely's Results page, set GA's reporting range to the duration that your experiment ran.

  5. Click Create and your new Custom Dimension will be available for integrating with Optimizely experiments.

Create a Custom Report

Now, you'll need to see reporting on your experiment within Universal Analytics.

  1. Log into your Universal Analytics account and click the Customization tab at the top. You should see a Custom Reports list that looks something like this: 



  2. Set up a Custom Report for each experiment you have integrated Universal Analytics with. To do this, click New Custom Report. Then give the report a title and add the metric groups you wish to view in the report.

  3. To filter this report for only your Optimizely experiment, choose the Custom Dimension you set up previously as one of the Dimension Drilldowns. See the below image for an example.

  4. Add this dimension in the Filters section and use a Regex match on the experiment ID for the experiment you want to filter. This will ensure that only Universal Analytics data for that particular experiment is shown in your report:



     

    Important:

    Make sure to leave Filters empty when creating a custom report for an iOS experiment.

     

  5. Click Save. You'll then be able to access your report and update the date filter if you wish:

Troubleshooting Google Analytics integrations

Integrating your Optimizely experiments with Google Analytics (GA) is as easy as enabling the GA integration in the experiment and choosing a custom slot to populate the data in.

However, if your site has a non-standard or custom GA implementation, there are several ways that the standard integration described above could integrate inconsistently or not at all. This section will explain the method in which the Optimizely integration works and help you understand why it may need to be customized for your GA implementation.

How Integration Works

In Google Analytics, custom variable slots are used to pass information along with a tracking call to specify additional information about the visitor. The Optimizely GA integration utilizes one of these custom variable slots to pass along the Experiment Name and Variation Name that the visitor is currently bucketed into (if any). For example, a custom variable slot might contain a value like this:

"Optimizely_HomepageTest_Variation1" 

This integration allows you to leverage all your existing reports in GA with the additional option to separate each report by the contents of the custom variable slot, showing you a different row of data for each variation used in your experiment. 

The standard configuration of this integration is simply enabling it in the Optimizely Editor and choosing a slot for Optimizely to pass the data through.

When Optimizely runs at the top of your page, it immediately adds this custom value to the _gaq object (which is the default GA object on your page). When the GA code runs later on the page, it picks up this value and sends it along with the tracking call to GA's servers.

Basic troubleshooting

By default, GA uses a JavaScript object on the page called _gaq, which is simply an empty array when its declared. Because GA always checks to see if _gaq exists before it runs, Optimizely can safely add a custom variable to _gaq and trust GA to find it and send it off with the tracking call.

However, if your site has any type of custom implementation of GA, its possible for that custom code to overwrite the value that Optimizely puts in _gaq after Optimizely runs, preventing the Optimizely integration value from being passed to GA.

Because Optimizely runs first and creates _gaq, it's very important for any custom implementation of GA to make sure it checks for the existence of _gaq before it runs, and if _gaq exists (because Optimizely created it and added a custom variable), make sure to include that value when the custom implementation runs.

The line of code to do that looks like this:

var _gaq = _gaq || [];


This effectively says:

"If _gaq has already been declared on the page, use that array. Otherwise, set _gaq to be an empty array and proceed"

Advanced troubleshooting

If you're having an issue with your Optimizely GA integration, there are a few technical details that may help you investigate whats going on.

The Code - When the Optimizely snippet loads on a page, it evaluates every experiment that is running to see if it has GA integration enabled. If it does (and the user is bucketed into a variation), Optimizely runs a single line of code to perform the integration, calling the _setCustomVar function in GA, for example:

_gaq.push(["_setCustomVar", /*SLOT*/ 5, "Optimizely_HomePage", "Variation #1", /*SCOPE*/ 2]);

The 2nd, 3rd, & 4th parameters in the function indicate the GA custom slot being used, Optimizely Experiment Name, and Variation name that the visitors is bucketed into.

This example is using custom slot #5 and the visitor is in Variation #1 of the Homepage experiment.

This means that if a subsequent _setCustomVar call on your site also uses slot #5, the Optimizely integration will be overwritten.

The Timing - When the Optimizely snippet loads on a page, it is able to make the _setCustomVar call immediately, as this is safe to do as described above.

However, if you are loading Optimizely asynchronously, there is a potential for the _setCustomVar call to happen after the GA tracking call is sent off, which would prevent the integration from working correctly.

In this case, it is best to delay the GA tracking call until after Optimizely has finished loading, most commonly done with a callback function that waits to be triggered by another script finishing.

Redirect Experiments

When you are experiencing that the _setCustomVar is not set on the tracking call for a redirect variation, please make sure that the redirect variation has _optimizely_redirect-comment as a first line to indicate a redirect:

/* _optimizely_redirect=http://custom */
 

Tip:

Have a question about integrating Optimizely with your Analytics Platform? Head over to the Optimizely Community to post a discussion and see what others are talking about.

Comments

Please sign in to leave a comment.