Friday 19 June 2015

Beginners guide to Google Tag Manager V2



Google Tag Manager V2 or GTM V2 is the second and better version of Google Tag Manager.
Google is soon going to migrate all GTM accounts and containers to GTM V2 and the old GTM (or GTM V1) will no longer be available.
So if you are still using GTM V1, you have got around a month to get familiar with GTM V2 and start planning your migration, because things work little differently in GTM V2 and you don’t want to leave anything to the last minute.
GTM V1 is available at http://www.google.com/tagmanager .To access GTM V2 (still in beta) you need to go to: https://tagmanager.google.com/
If you are planning to create new GTM accounts and containers in the next couple of days/weeks then do it via GTM V2 and save yourself from the trouble of migrating to the new interface later.

What has changed in GTM V2?

1. GTM V2 has got a new and improved interface which makes working with Google Tag Manager a bit easier. The interface of GTM V1 is not very intuitive. So a user esp. a new one has little to no idea of what to do next in order to deploy a tag on his website. This is not the case with GTM v2 whose user interface is all about workflow.
2. It has got a new API and more 3rd party tag templates.
3. GTM rules have been renamed as triggers, macros have been renamed as variables and there has been some changes in the way triggers, macros and tags are supposed to be used.
4. The triggers are created little bit differently in GTM V2. The whole process has been broken down into two steps. In the first step, you select the trigger type and in the second step you apply filters.
5. The auto event listeners tags are no longer required in GTM V2.
6. Through the new API you can manage accounts, containers, permissions, variables, tags and triggers programmatically.
7. There is a new category of variables called built-in variables.
8. Google also announced new keyboard shortcuts for GTM (but I couldn’t find any so far).

GTM V2 Account and Container

Follow the steps below to create a new account and container in GTM V2:
Step-1: sign in to the GTM V2 https://tagmanager.google.com/, you will then see the home page which list all of the GTM accounts you have got access to:
GTM V2 home page
Home page of GTM V2
Each box on the home page of the new interface represents one GTM account. I have got access to several GTM accounts.
If you have got access to only one account or zero GTM account then your home page is going to look different (mostly blank) than my home page.
If you click on any one of the accounts listed on the home page,  you will get the following message:
account not migrated
The GTM account that you are currently using is the legacy account and it is not accessible in the new user interface (i.e. in GTM V2).
So if you try to access your current GTM account from the home page of GTM V2, you will be redirected to the user interface of GTM V1.
You need to manually migrate your account from GTM V1 to GTM V2 or wait for Google to auto migrate your old account.
You can also request Google to migrate your account for you by clicking on the ‘request’ link in the ‘Account Not Migrated’ dialog box as shown above.
But you don’t want auto-migration.
Remember what happened when Google auto migrated all Google Analytics account to Universal Analytics?
Ecommerce tracking stopped working. Event tracking stopped working. Lot of tracking issues and errors. If you carry out this migration on your own, you have a better chance of smooth and error-free migration.
If you let Google migrate your account, then best of luck.
Before you plan your migration, you need to first get familiar with how GTM V2 works, how you can move around and complete your tasks.
This guide is all about getting familiar with GTM V2.

Step-2:  
create new account
Click on the ‘create new account’ link on the home page. Generally only one GTM account is needed per company.
Note: You can create multiple GTM accounts from a single Google account.
Step-3:
add new account
Name your account (same as your company name), select the checkbox ‘Share data anonymously with Google and others’ (to enable benchmarking) and then click on the ‘continue’ button to setup container.
Step-4:
add a new account
Enter the name of your container (same as your website name), select ‘Web’ (as here I am going to use my container on a website) and then click on the ‘create’ button.
Step-5:
gtm terms of service
Accept Google Tag Manager Terms of service by clicking on the ‘Yes’ button. You have now created new GTM V2 account and container.
Step-6:
install google tag manager
Copy-paste the GTM code (aka container code) on every page of your website immediately after the opening <body> tag and then click on the ok button.
You will now see the new GTM interface:
new gtm interface
Pay special attention to the interface elements highlighted by red circle.

GTM V2 Tags

A tag is a bunch of JavaScript code which collects measurement and marketing data from a website/mobile app and then send the data to a 3rd party service like Google Aanalytics, Google Adwords, Facebook etc. 
choose tag
GTM V2 Tag Templates
Tag is used to collect and send information from your website/mobile app to a 3rd party service like Google Analytics, Google Adwords, Comscore, clicktale etc.
A tag template makes it easy to deploy a tag on your website. GTM V2 provides more tag templates than GTM V1.
If you want to create and use your own tag, you can do that via ‘Custom HTML Tag’ or ‘Custom Image Tag’.

GTM V2 Triggers

GTM triggers
Creating a new trigger through the ‘Triggers’ menu
Rules are known as triggers in GTM V2.
A trigger is a condition which must be met (must evaluate to true) for a tag to execute. A trigger tells GTM when the tag should fire.
Following is an example of a trigger:
 {{url}} matches abc.com/cart/thankyou.html // fire the tag when the URL of the currently loaded page matches abc.com/cart/thankyou.html

Trigger Events
A trigger event is one of the conditions when the trigger should fire/execute. Following are the various events when a trigger can be fired:
#1 Pageview – fire the trigger on pageview
#2 Click – fire the trigger when a click event occurs.
#3 Form – fire the trigger when the form submit event occurs.
#4 History Change – fire the trigger when the user’s current browser history changes.
#5 Custom Event – fire the trigger when the custom event occurs.
#6 JavaScript Error – fire the trigger when a javascript error occurs.
#7 Timer – fire the trigger after a given interval.
In GTM v2, triggers have been made an integral part of a tag creation process, so you can not create a tag without first creating corresponding trigger.
There are two methods of creating a trigger in GTM v2: one is while you are creating a new tag and one is through the triggers menu.
fire on
Creating a trigger while creating a new tag
More – click on this button to select an existing trigger or to create and select a new trigger.

Click Trigger

When you click on the ‘Click’ trigger button, you see an ‘Create trigger’ dialog box through which you can select trigger type: ‘click’ or ‘link click':
create trigger
If you select ‘Click’ from the drop down menu, your tag can fire on any click on your website, no matter which element a user clicks on.  If you select ‘Link Click’ from the drop down menu, your tag will fire only on clicks on a link(s).
Once you have selected ‘Link Click’ as trigger type, you will see additional fields: ‘Wait for Tag‘, ‘Check for validation‘ and additional filter field:
trigger link click
Select the checkbox ‘wait for tags‘ to delay the opening of the links until all dependent tags have fired or specified time (i.e. max wait time) has elapsed, whichever comes first.
Select the checkbox ‘Check Validation‘ if you want the tag to fire only when the link has actually being clicked i.e. the click on the link takes a user to another page.
You also need to set up filters to specify when your link click trigger should fire. For example, I want to fire a tag on the page whose URL contains ‘/shop/men/shirts/’ and when the ‘Click ID’ is ‘smshrt’. That’s why I set up the following filters:
url contains /shop/men/shirts
Click ID equals smshrt

Form Trigger


form trigger2

When you click on the ‘Form’ trigger button, you see a ‘Create trigger’ dialog box:
form trigger
If you select ‘All Forms’, your tag will fire on submit event for any form.
If you select ‘Some Forms’, your tag will fire on submit event but only for selected forms. While configuring your ‘Form’ trigger you get the option to select ‘wait for tags‘ and ‘check validation‘.
Select the checkbox ‘wait for tags‘ to delay the form submit until all dependent tags have fired or specified time (i.e. max wait time) has elapsed, whichever comes first.
Select the checkbox ‘Check Validation‘ if you want the tag to fire only when the form is successfully submitted. If you keep this checkbox unselected then the tag may fire even when a user is just trying to submit the form.
You also need to set up filters to specify when your form trigger should fire. For example, I want to fire a tag on the page whose URL contains ‘/shop/men/checkout’ because this page contains my form. That’s why I set-up the following filter:
form fire on
url contains /shop/men/checkout


GTM V2 Blocking Triggers

In GTM V2 you have two type of triggers: Firing triggers (commonly known as triggers) and blocking triggers.
A blocking trigger is a condition which must be met (must evaluate to true) for a tag tonot execute. A blocking trigger tells GTM when the tag should not fire.
blocking trigger
You can create a blocking trigger (or blocking rule) by clicking on the ‘Create Exceptions‘ link while creating your tag. The whole process of creating a blocking trigger is same as in the case of creating a regular trigger.
Note: If your trigger contradicts your blocking trigger then the blocking trigger takes precedence.
For example, if you set a trigger to fire tag on all pages of your website and then you set a blocking trigger which prevents the same tag from firing on the ‘order confirmation’ page then then your tag will not fire on the ‘order confirmation’ page even when the tag is supposed to fire on all pages of your website according to the firing trigger.

GTM V2 Variables

In GTM V2, macros have been renamed as variables.
A variable is used to store data that is used in defining a trigger and/or to pass information (like product price, google analytics account id etc) to tag(s) at runtime.
A variable tells GTM where to fire a tag.
For example,
{{url}} matches RegEx .* // fire the tag on any page that is downloaded by a user.
Here {{url}} is a predefined variable
A data layer passes information to container tag via variables. A variable can retrieve runtime information:
1. Through data layer (recommended)
2. Through javascript variables (not recommended)
3. Directly from DOM (not recommended)

In GTM v2, there are two categories of variables:
  1. Built-in variables (or predefined variables)
  2. User defined variables
Following are the examples of ‘built-in variables’ in GTM V2:
built in variables GTM v2Built-in variables are predefined variables. These variables make setting up tags and triggers easier.
When you first create a new container, you will find that few built-in variables (page URL, page hostname, page path, and referrer) are already enabled (i.e. selected by default).
You should select all the built-in variables of type clicks as they are frequently used.
Once a built-in variable is enabled, it is instantly available to be used while setting up various tags and triggers.
 You can get the complete list of the built-in variables and what each variable means, from here: https://support.google.com/tagmanager/answer/6106965
Following are the examples of user-defined variables in GTM V2:
user defined variablesAs the name suggest, the user defined variables are defined by people like me and you.

Setting up Universal Analytics via GTM V2

The purpose of this exercise is to make you familiar with the GTM V2 interface and help you in moving around with ease. You will learn to create a new tag, debug it and then publish it on a website.
Follow the steps below to set up Universal Analytics via GTM V2:
Step-1:Click on ‘Add a new tag’ link on the account ‘overview’ page of GTM V2:
add a new tag
Step-2: Name your tag ‘Universal Analytics Tracking Code’ and select ‘Google Analytics’ from the ‘Choose Product’ section because that is what I want to install on my website:

universal analytics tracking code
Step-3: Click on the ‘continue’ button and then choose ‘Universal Analytics’ as a tag type. I selected ‘Universal Analytics’ because I want to install Universal analytics on my website:
choose tag type


Step-4: Click on the ‘continue’ button and then configure your ‘Universal Analytics tag’ by entering your tracking ID:
configure tag
Step-5: Click on the ‘continue’ button and then select the trigger (aka rule) when the tag should be fired. I selected ‘All pages’ because I want my Universal Analytics tag to fire on all pages of my website:
fire on2

Step-6: Click on the ‘create Tag’ button to create your new tag.
You will now see your new tag listed:
new tag listed
Step-7:
publish tag google tag manager
Click on the drop down button next to the ‘Publish’ button and then on the ‘preview’ button to test your tag on your website. Once you have clicked on the ‘preview’ button, you will see a message like the one below:
now previewing version 1
 You are now previewing version 1 of your container.
Step-8: Now visit your website and look for a debugging window like the one below at the bottom of a web page:
tags fired on this page
This debugging window is telling you that if you publish your Universal Analytics tag on the live website, it will fire/execute.
Note: Make sure that not only the tag is firing but it is also not breaking the website design and/or functionality in any way.
Step-9: Head back to GTM V2  and click on the ‘Leave Preview Mode’ link once you have tested your new tag:
leave preview mode
Once you clicked on the link, you will see following dialogue box:
leave preview mode2
Click on the ‘ok’ button.
Step-10: Click on the ‘create version’ button:
create version button
You will then see a dialog box like the one below:
success
Click on the ‘Done’ button. You have now created a new container version.
Step-11: Click on the ‘Publish’ button:
publish button
 This will open a new dialog box:
publish now
Click on the ‘Publish Now’ button. You will then see another dialog box:
success2
Click on the ‘Done’ button. This task will install universal analytics on your website via GTM V2.

Step-12: Now remove the Universal Analytics tracking code from all of the web pages on your website. If you are already using GTM then remove the old GTM container code from all of the web pages.
However if you have additional tracking installed (like ecommerce trackingevent trackingcross domain trackingscroll trackingvideo tracking etc) on your website, then don’t remove the old container code for now.
That’s how you create new tags in GTM V2. If you have used GTM before, you now know that things work little differently in GTM V2.

How to migrate your account to Google Tag Manager V2

Now you have got two options for migrating your account from GTM V1 to GTM V2:
#1 Create a new account in GTM V2 and then manually create all the tags, triggers (or rules) and variables (or macros) all over again.

#2 Create a new account in GTM V2 and then import all of the configurations (tags, triggers, variables) to it from GTM V1.
Off-course I am going to explain the second option.
Follow the steps below to migrate your GTM V1 account to GTM V2:
Step-1: Go to your old GTM V1 account at http://www.google.com/tagmanager and then click on Import/Export > Export Container
export container
Step-2: Select the most recent container version from the ‘Choose Container Version’ drop down menu:
choosen container version drop down menu
As soon as you select a container version, you will see a code window like the one below:
code windown GTM V2
Click on the ‘download’ button to download the container to your hard disk.
Note: The container file is a JSON file and has got the extension .json
Step-3: Go to GTM V2 at https://tagmanager.google.com/ and then create a new account there.
Step-4: In the new GTM V2 account, click on the ‘Admin’ link and then click on the ‘Import Container’ link as shown below:
GTM V2 Admin
Step-5: Select your container file by clicking on the ‘Choose Container file’ button. Make sure that ‘Overwrite’ button is selected and then click on the continue button:
choose container file
Step-6: Preview your import by clicking on the ‘view detailed changes’ link:
view detailed changes linkpreview and confirm your import
Step-7: Click on the ‘Confirm’ button to start the import. Once the import is complete, you can see all of your tags, triggers and variables in the new GTM V2 account.
Step-8: Remove the old GTM V1 container code from all of the web pages on your staging website and replace it with the new GTM V2 container code.
Step-9: Test and publish the new container.
Step-10: Once everything is working as intended, then remove the old GTM V1 container code from all of the web pages on your live website and replace it with the new GTM V2 container code.
Step-11: Test and publish the new container.

Article Source is from http://www.optimizesmart.com/beginners-guide-google-tag-manager-v2/


1 comment: