Rich-text Reply

[Tip from the Technical Support Team] Google Tag Manager, Google Analytics, and Optimizely

Gary 09-30-14

[Tip from the Technical Support Team] Google Tag Manager, Google Analytics, and Optimizely

[ Edited ]

You guessed it (or read today’s title) - let’s discuss using Google Tag Manager (GTM) with Google Analytics (GA) and Optimizely.

 

There are a LOT of different installations of the Optimizely Snippet out there.

 

I most frequently see questions on the integration setup of Google Analytics (both Classic and Universal) and because the Optimizely Snippet is installed differently, each user’s setup requires a bit of checking. If you’ve ever done this for your own site, I’m bet you’ve been frustrated.

 

   --------------------------    

   --------------------------

I will separate my discussion into two sections, based on two different styles of implementation:

 

1.) Optimizely with Google Tag Manager

 

Generally, we don’t recommend using Google Tag Manager to implement the Optimizely snippet. GTM (by default) will not guarantee a script execution order, and the Optimizely script may be run later in your pageload sequence than desired, resulting in ‘flashing.’

That said, we have a workaround if placing the Optimizely Snippet in your GTM is an absolute must. The workaround is walked through in this article, and it utilizes a datalayer variable and a custom HTML tag to prioritize the firing of the Optimizely Snippet to be first. I recommend very diligently following the steps outlined there, as it will either work perfectly or not at all.

 

   --------------------------    

   --------------------------

 

2.) Optimizely, Google Analytics, and Google Tag Manager

 

GA is asynchronous and is perfectly happy to run inside GTM. Optimizely doesn't have a stance on whether using GA with or without GTM is better or worse. Honestly, we don’t mind!

 

Regardless of HOW you choose to implement GA and Optimizely (with or without GTM), the following must happen for the GA Optimizely Integration to work:

 

     A. Optimizely MUST run BEFORE GA

     B. If you're using Universal Analytics, you must add an Optimizely call for 'ActivateAnalytics' just prior to GA firing it's pageview request (as discussed here)

 

For case number 1 here, if Optimizely and GA are inside GTM, we cannot guarantee that Optimizely runs first, which is when the GA and Optimizely integration might fail. This is where the workaround discussed above comes in - it will specify to run Optimizely first!

 

To be honest, the workaround will take some developer resources/time whereas it’s easier to avoid this altogether and place the Optimizely Snippet on the page directly. Though, after speaking with many clients there are reasons this is not possible

 

   --------------------------  

 

 

To recap, the ideal situation is having the Optimizely Snippet directly on your page in the <head> tag and any functional build of GA after that is fine by us.

 

What do you think? How do you use Optimizely and GA?

 

- Gary
Optimizely - Turning the World's data into action
Optimizely

Amanda 10-01-14
 

Re: [Tip from the Technical Support Team] Google Tag Manager, Google Analytics, and Optimizely

Thanks for sharing, Gary! This will be very useful.
Optimizely
ChicagoCRO 11-07-14
 

Re: [Tip from the Technical Support Team] Google Tag Manager, Google Analytics, and Optimizely

Gary, I have a questions about item 2B above:

 


Gary wrote:

 

2.) Optimizely, Google Analytics, and Google Tag Manager

 

GA is asynchronous and is perfectly happy to run inside GTM. Optimizely doesn't have a stance on whether using GA with or without GTM is better or worse. Honestly, we don’t mind!

 

Regardless of HOW you choose to implement GA and Optimizely (with or without GTM), the following must happen for the GA Optimizely Integration to work:

 

     A. Optimizely MUST run BEFORE GA

     B. If you're using Universal Analytics, you must add an Optimizely call for 'ActivateAnalytics' just prior to GA firing it's pageview request (as discussed here)

 



I went to the link from item B and the code example shown says you have to place the call for ActivateAnalytics after ga('create') but before ga('send'). The problem with that is that when you GTM to load the UA code, you can't actually edit the UA code and insert something in the middle of it. 

 

I can add a separate custom HTML tag in GTM that has the ActivateAnalytics snippet, but there's no way to place it right between ga('create') and ga('send').

 

Does ActivateAnalytics have to meet that exact firing order or will it work if it fires before both ga('create') and ga('send')?

 

 

Gary 11-07-14
 

Re: [Tip from the Technical Support Team] Google Tag Manager, Google Analytics, and Optimizely

[ Edited ]

Hey there, ChicagoCRO!

Great question.

From what other customers have been telling me, not being able to edit the GTM add on for GA (UA or classic) is common. Unfortunately, this means you will need to do what you identified - add a separate custom HTML tag in GTM that has the ActivateAnalytics snippet, but also add in the entire UA code so that you can place it between ga('create') and ga('send').

If you do not place the 'ActivateAnalytics' call between ga('create') and ga('send'), then you will not get data from optimizely into GA. It has to be in this exact order for the following reasons:

- If the Activate call is before the 'create' call, then you will overwrite the Optimizely information.
- If the Activate call is after the 'send' call, then your information will not be sent to UA.

Does this help?

- Gary
Optimizely - Turning the World's data into action
Optimizely
ChicagoCRO 11-11-14
 

Re: [Tip from the Technical Support Team] Google Tag Manager, Google Analytics, and Optimizely

Gary, I loaded the UA pageview tag as a custom HTML tag in GTM and inserted the Optimizely code where it needed to go. This did the trick, thanks!

360training 04-08-15
 

Re: [Tip from the Technical Support Team] Google Tag Manager, Google Analytics, and Optimizely

Hi,

 

So  for Case #2 - to put it plainly - my optimizely snippet has to placed above the google tag manager code? (does the placement matter?)

 

I need to figure out how to integrate optimizely into GA properly. 

 

 

Thanks!

Ehsan 04-09-15
 

Re: [Tip from the Technical Support Team] Google Tag Manager, Google Analytics, and Optimizely

Hi 360training, 

 

That is correct, placement does matter.  The Optimizely snippet should be above the google tag. Check out this article in our Optiverse titled Integrating Optimizely with Google Universal Analytics for all the details.

Optimizely
360training 04-13-15
 

Re: [Tip from the Technical Support Team] Google Tag Manager, Google Analytics, and Optimizely

Hi Ehsan,

 

Our site is implementing Optimizely hard-coded on the site in the <head> section. Google Analytics is in the <body> section inside a Google Tag manager script.

 

I used Google Analytics Debugger to see if the sequence is correct.

and, it seems to be correct.

 

However, I am still unable to see data passed through GA from optimizely.

I have attached a screenshot of the GA debug consule.

 

You can view the page source here: view-source:http://www.meditec.com/connect/military-education-grants/


ga debug 1.png
ga debug 2.png

Re: [Tip from the Technical Support Team] Google Tag Manager, Google Analytics, and Optimizely

Thanks for the extra info, @360training!

 

I took a look at http://www.meditec.com/connect/military-education-grants/ and it seemed like Google Analytics may be getting added before Optimizely (screenshot attached). Would you or your development team know of a way we could get the Optimizely snippet to come before the GA snippet? Alternatively, please clarify if the line higlighted in the screenshot below is not your GA snippet along with pointing me in the right direction of where the GA snippet actually is. I'd be more than happy to take another look, but we'll want to make sure the Optimizely snippet comes first.

 

Looking forward to helping get everything up and running smoothly for you!

 

Derek

 

elements_panel

360training 04-17-15
 

Re: [Tip from the Technical Support Team] Google Tag Manager, Google Analytics, and Optimizely

Hi Derek,

 

A team member pointed out that the best way to look at the structure was through view source.

 

It seems that GTM is loaded just after internal scripts.

 

<script type='text/javascript'>

var googletag = googletag || {};

googletag.cmd = googletag.cmd || [];

(function() { var gads = document.createElement('script'); gads.async = true; gads.type = 'text/javascript'; var useSSL = true;gads.src='https://www.googletagservices.com/tag/js/gpt.js'; var node = document.getElementsByTagName('script')[0]; node.parentNode.insertBefore(gads, node); })();

</script>

 

Optimizely before closing head tag.

 

<link href="https://plus.google.com/+Learn2serve" rel="publisher"/>

<script src="//cdn.optimizely.com/js/2677050388.js"></script>

</head>

 

---

 

Does this mean I need to move the optimizely snippet about this code? 

 

Thanks!

Ehsan 04-17-15
 

Re: [Tip from the Technical Support Team] Google Tag Manager, Google Analytics, and Optimizely

[ Edited ]

Hi @360training,

 

Yes, the Optimizely snippet needs to be above all of the google scripts, and ideally the first script that loads onto the page.

 

While viewing the source code is a great way to see the static html that has been developed, the elememts tab in developer tools lets you see how the final order of operations plays out.  And as we can see in the attached screenshot, the Google scripts are being loaded above the Optimizely script.  There may be logic in your Tag Manager that is causing this, because through view source GTM is at the bottom of the body, far below Optimizely.

 

Once you're adjustments land the Optimizely snippet above the Google scripts, you should be all set!

Screen Shot 2015-04-17 at 10.14.34 AM.png
Optimizely