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/


Saturday, 29 December 2012

Introduction to Google Tag Manager


Ever had issues keeping track of which tracking codes go where? Whether it’s Google Analytics, Bing, AdWords or remarketing, the simple truth is that there are a lot of different snippets you need to keep track of these days. That’s where Google Tag Manager comes to help out! What’s the scoop? Google Tag Manager was launched back in October as a way to keep all of your tags in one place. Not only does this help keep source code cleaner (by being placed in the correct place), and theoretically speed up website loading times, it also means that multiple users can make remote changes to website codes without needing the help of a developer. This is great if you work with particularly unresponsive developers – it means you can handle all code changes quickly and easily without having to wait for a new release. It also means you can have different teams making changes remotely – such as your PPC agency, your in house content team, and your developer team, without having to go through complicated channels. Structure Overview: Once you sign up for Google Tag Manager you have the option to create new or see your existing accounts. If you work for an agency, you should have an account for each client whose GTM you manage.
Within each account you have buckets that Google calls ‘Containers’ – these are where you group similar sections of code. In the example shown below – we have an account for Hanapin Marketing, but separate containers for PPC Hero and for Hanapinmarketing.com. The reason for this is because we have separate Analytics codes for those two sites, and separate AdWords accounts and tracking codes, hence they need to be kept in separate buckets. If we had a subdomain such as blog.hanapinmarketing.com, we would keep that within the Hanapinmarketing.com container as some of our codes will still apply to that part of the site.
Once you have your containers set up, you might want to give access to other users. This is very straightforward and you can control permissions at the account and container level.
Adding Tags: Assuming you’ve set up your account and containers and added relevant users, you’ll want to start building out your list of tags. In our case that meant adding Google Analytics, Google AdWords conversion tracking, Google AdWords remarketing and Bing conversion tracking. This is actually pretty straightforward to do. Go into one of your containers and in the top right corner select ‘New Tag’.
From here you will see a drop down list of the tags Google is able to implement for you:
Select Google Analytics from the drop down and name your Tag something obvious like ‘Google Analytics’. Here is what you should see:
You’ll need to find your Analytics ID – you can find this by going into the Analytics admin tab and selecting the web property associated with your site. You’ll then need to set up a rule for when this code shows – in my case I’ve used the generic ‘all pages’ rule, but you might only want this particular code to show in a certain subdomain or on certain pages. To do that you simply need to create a new rule:
You can also add rules to block showing your code for – e.g. test areas of your site. In the ‘more settings’ drop down you have the option to block specific referrers or organic keywords from triggering your tag as well as a number of other features. The next tag I want to create is the Google AdWords conversion code. Again, Tag Manager has a default option to make this easier for you:
You can get your Conversion ID and Conversion Label by going into you AdWords account and looking at your existing code. As you can see, I’ve set up a rule for my AdWords code that it only appears on our ‘/thankyou’ confirmation page. If I were to add another conversion path in future with a new thank you page, it would be really easy to make this code fire there, simply by adding a new rule with my new URL. For Bing, things aren’t handed to you as prepackaged as they are for Google products, but it’s pretty simple to add your code in. Simply select custom HTML code and paste in your Bing conversion code.
Again, I’ve set this to only fire on the ‘/thankyou’ page. That’s the basics of adding tags sorted. Let’s talk a little bit more about rules and macros! As mentioned above, rules tell your tags when to fire. In Hanapin’s PPC Hero container you will see something like this:
The PPC Services Remarketing rule means that our remarketing tag will only fire on our PPC Services page. Pretty straightforward right? Using Macros enable you to do more advanced things with your tagging. For example you can use macros to look at certain data from your other javascript and determine whether a code should show. For an eCommerce client we set up a Macro to pull the transaction amount from their cart Javascript in order to include revenue data in Google AdWords’ conversion tracking.
The default Macros available are: URL – let’s you set rules depending on the URL of the page. Referrer – rules based upon the referring site (show specific remarketing codes to users who visited PPC Hero before visiting Hanapin Marketing etc) Event – rules based upon users who performed a specific on site event such as watching a video. Here’s how our list looks:
I recommend you check out the Google Tag Manager support section on Macros if you’re thinking of using them as they aren’t for beginner users. Finalizing Once you’re happy that you’ve got all the tags you need with the correct rules to show them – you can switch over to using Tag Manager. First, check that all your account settings are correct:
If you’re happy that’s all good, you’ll need to remove all your old tags (that you now have in GTM) and replace them with the Tag Manager code snippet.
You can find this in your settings menu, and you’ll have a different snippet per container in your account. You want to place this code immediately following the opening tag. And that’s it! Pretty straightforward really and should make things much easier for you in the long run. If any of you have positive or negative experiences with the Google Tag Manager let us know in the comments below! Source web page...http://www.ppchero.com/introduction-to-google-tag-manager/