20.Jul.17

Pantaley Stoyanov

Pantaley Stoyanov

Adding tracking code snippets for Google Analytics, Google Tag Manager and Google Optimize.

Utilizing Google Analytics (GA) will give you data, but without context.

With Google Tag Manager (GTM) and its advanced tagging, your data will have meaning.

But with Google Optimize (GO) and its A/B tests, you will leave nothing to chance.

Most of us are using Google Analytics already. If we decide to use Google Tag Manager, the recommended way is to:

  • remove GA code snippet
  • add GTM code snippets
  • connect GA account via GTM tag

But if we connect Google Optimize through GTM and start tests with DOM elements changes, visitors will see content flickering on page load.

The following steps are how to combine all services and minimize the content flickering.

How to combine all 3 services

There is pretty good chance that you are using already two of the services, combined in GTM code snippet to be precise. For this case, there will be some additional steps at the end.

First you need to get your GA and GTM code snippets.

For Google Analytics:

  1. Sign in to your Analytics account.
  2. Click Admin.
  3. Select an account from the menu in the ACCOUNT column.
  4. Select a property from the menu in the PROPERTY column.
  5. Under PROPERTY, click Tracking Info > Tracking Code.

Additional reading

The snippet looks like this:

For Google Tag Manager:

  1. In Google tag Manager, click Workspace.
  2. Near the top of the window, find your container ID, formatted as "GTM-XXXXXX".
  3. Click your container ID to launch the Install Tag Manager box.

Additional reading

The snippets look like this:

For Google Optimize

  1. Go to your Experiments page.
  2. Locate the Container information panel (on the right side of the page).
  3. Click Install Optimize snippet.
  4. Click the blue VIEW SNIPPET button.

Additional reading

The snippet looks like this:

ga('require', 'GTM-XXXX);

And it needs to be inserted into the Analytics code:

Additional steps if you are using GA and/or GA through GTM

For Google Analytics:

  1. In Google tag Manager, click Workspace.
  2. Select Tags
  3. Delete your GA Pageview tag from the list.
GA tag 

This tag enables you to receive pageview data from your Google Tag Manager to your Google Aanalytics. If you leave it all your data will be doubled as the information will be coming also from your GA snippet:

ga('send', 'pageview');

For Google Tag Manager

  1. In Google tag Manager, click Workspace.
  2. Select Tags
  3. Delete your GO tag from the list.
GO tag 

This is the tag that connects your Google Optimize with your Google Analytics. This is not needed as we already connect these services in the GA code snippet:

ga('require', 'GTM-XXXX);

This is the better approach because the flicker effect will be minimized when you are changing the DOM with Google Optimize.



Need consulting on this topic?

Yes No

Thank You! We will be in touch.