Google Tag Manager Setup - Gatheringapp/SEO GitHub Wiki

This document will explain firstly, what Google Tag Manager is and the benefits of it. Secondly it will specify actions required to implement and fully migrate to Google Tag Manager from Google Analytics.

Just like a content management system (CMS) is used to control the content on your website, a tag management system (such as Google Tag Manager), manages the tags on your site. Tags are pieces of JavaScript that you install on your site, examples of this are the Google Analytics (GA) tracking code or the Google Adwords conversion/remarketing code.

Google Tag Manager provides a web based interface to choose, edit, manage and debug tags as well as pick where you want them to trigger. Examples of triggers could be on some/all pages of your site or when someone clicks on a specific element of your site.

• There is no need to make changes to the source code of the site or it’s templates to add a JavaScript tag.
• You can keep track of and organise tags to avoid duplication and mistakes.
• There is built-in debugging, testing and preview tools to make sure the tags you are adding do not adversely affect the site.
• You can use version control to keep track of changes and roll back changes if necessary.
• There are multiple levels of permissions to view, edit and publish tags.

There are two components to GTM:

• A web based interface to manage tags.
• A container script that is placed within your sites HTML that loads the tags you add in the web based interface.

Below are the steps that will be carried out throughout this migration:

1. Google Tag Manager installation and initial setup
2. Google Analytics pageview tracking tag and migration
3. Google Analytics standard ecommerce tracking
4. Google Analytics event tracking
5. Custom scroll tracking tag
6. Custom outbound link tracking tag
7. Custom YouTube video tracking tag
8. Custom file download tracking tag

1. Alligator Storage need to setup a Google Tag Manager (GTM) account here https://tagmanager.google.com/?hl=en#/admin/accounts/create (you will need to have a Google Apps account)
2. Enter an account name, optionally select the checkboxes to enable sharing data anonymously with Google and others and click Continue.
3. Enter a container name when prompted in the Setup Container dialog, select the container for Web and click Create.
4. Review the Terms of Service and click “Yes” if you agree to those terms.
5. When your new container first loads, you will be prompted with the container installation code snippet mentioned earlier. Copy this code.
6. Instruct your developers to add this code snippet just after the opening

tag of every page of the website. 7. Whilst the developers are doing this, Alligator Storage need to click continue on the website in the bottom left of the container code popup. 8. Click on “Accounts” in the top navigation. 9. Click on the three dots next to your account name, then click on “User Management” 10. Click the red “New” button to add a new user to your account. 11. In the “Email” field type “[email protected]”. 12. Under the “Container Permissions” section you should see the name of your newly created container. Click on the dropdown and change the permissions to “View, Edit, Delete, and Publish”.

When moving a site over to use Google Tag Manager that has an already existing GA implementation we need to migrate it without causing any disruptions with the data collection in Google Analytics. Here is the process we will follow when migrating:

1. We will create a new property in Google Analytics. This will be a temporary property for testing, which can be deleted after the migration is complete.
2. Next we will implement a Google Analytics pageview tag via Google Tag Manager using the new test property ID.
3. Then we will refine the implementation until the test property replicates the existing Google Analytics implementation.
4. Lastly, at the same time we do these two things: a. Remove all existing GA code from the website. b. Switch the property ID in the GA tags for Google Tag Manager from the test property to the existing property.

Whilst this is not currently implemented on the site, we recommend to implement Google Analytics ecommerce tracking. This will allow us to track sales on the site. The code to do this needs to be added on the order confirmation page customers are sent to after they have placed an order, it will need to contain all the information about their order that will need to be pulled from the site’s data. To implement tracking like this, Google Tag Manager supports something called the data layer. This is basically a JavaScript array that contains and stores information that will then be sent to the Google Tag Manager container. After it is sent to the container we can then do something with that information, such as sending it to Google Analytics as a custom dimension or for ecommerce tracking. The script will need to be added above the Google Tag Manager container script.

You can find more information on implementing this in the Google article here. You will notice in the article that it is dataLayer.push, we do not need this as this is only necessary if there is already an existing dataLayer set up and we want to append to it. Once this has been implemented please let us know so we can set up Google Tag Manager to send this information to Google Analytics.