The Entrepreneur Forum | Startups | Entrepreneurship | Starting a Business | Motivation | Success

[GUIDE] How to track everything you want with Analytics without coding - introducing GTM

Remove ads while supporting the Unscripted philosophy...become an INSIDER.

diegorueda

Bronze Contributor
Read Millionaire Fastlane
I've Read UNSCRIPTED
Speedway Pass
Feb 20, 2016
106
284
176
36
Barcelona, Spain
I’m creating this post due to some questions in the thread What adding value actually looks like (real stats)... related to Google Tag Manager (GTM).

This is not going to be a comprehensive guide. There is a lot of good tutorials in internet about GTM (see some of them at the end of the post). Instead, I want to introduce you in this fantastic tool for marketers and developers.

This guide will guide you in all the important and tricky things, not in the very basics of internet navigation. I mean: I’m not going to guide you like to a grandpa doing an internet course, telling you everything about each form field and which button you have to click. If I say “Create a new account” it means “look for the button that says 'Create account, click on that, and fill the form with the guidelines the form itself is giving you”.

Also keep in mind that I’m not an expert in the tool, but I’ll try to find a solution or a reference for your questions anyway.

Ok. Let’s get started...

What the hell is GTM?
Putting it simple, is a tool that you install in your site copying and pasting its code (like you do with Analytics) and gives you the ability to manage all kind of tags (tracking codes) from Google or other third parties. That includes site analytics, remarketing, conversion tracking, user’s live recordings and a lot more of fun. All that without touching any code.

It works like a container. You paste the GTM tracking code in your website and then you can remove every other tracking codes you have (Analytics, for example). All of them will be installed inside GTM. That is, once you have GTM installed, you can extend it with new tools without modifying your site code, just activating it in the GTM admin panel.

*** Disclaimer ***
Most of the events you can track in Analytics or any other tracking tool can be done from GTM. However, some times is necessary some HTML update, or some javascript is required. It’s very basic btw and a lot of times you can paste this code in GTM instead of your site. I will share some useful free recipes ready to go (not coded by me).
***

You can benefit from using GTM if...
… you are a developer with a live site and you want to install and manage several tracking codes without updating your site with each one. Less updates are less time and less problems.
… you are a marketer or business owner who want to use Analytics or other tracking tools for your website and you find it difficult to track some events in your page without bother your developer.
… you have a website, mainly :D

Less chatting and more doing!

Getting GTM up and running
First of all, go to Sign in - Google Accounts and sing up with the google account you want to use. You can create new users later for the same account.

Once you are logged in, the administration page is showed. Create a new account with the website you want to install. I have created a demo site using this forum as example.



Once you have created your account, clicking in it will load the WORKSPACE in which you will manage your tags. In your first visit a modal will tell you how to install GTM in your site. You need to copy that code and paste in you site, in all pages! Just follow the instructions, or give it to your developer.



*** IMPORTANT: Once you copy the GTM code in your site, you must to remove the Analytics tracking code if you are going to manage it with GTM. Not doing this could cause duplication of data in Analytics. ***

You can create several accounts, each of them for a different site. It is also easy to export the configuration from one account to another. So if you need to manage several websites, avoid creating each container from zero. You can find this options in the ADMIN tab in top of the page.





https://image.ibb.co/g07Zwv/gmt_export.jpg


The WORKSPACE
What is important to know about this section? Let's see…



First of all, a workspace is like a draft of a blog post. Or a development environment. All the changes you made here will not publish in your site until you click that blue SUBMIT button in the top-right of the page. Never forget to publish when you have all your changes in place! But avoid to publish if you are still working in the draft.
If you don’t see the changes in your web, or your new data in Analytics, please check if you have publish your changes.

You can create several workspaces if you need to work in parallel with another person. But be careful if both of you are touching the same parameters.

Come on, give me a TAG!
A tag is a piece of code that sends information to a third party, such as Google Analytics. (from the GTM docs)

So how to install Analytics in your site to see track of page views? It couldn’t be easier, but you need to have an Analytics account first. If not, go and create one, I’ll wait here… Once you come back, get your Analytics Tracking ID at hand (usually something like UA-000000-2).

Click the New Tag button in the workspace…



Name your tag with an appropriate name like “Analytics – Page Views” or “GA – Page Views", choose the tag type “Universal Analytics” and choose the trigger “All pages”. Don’t click Save yet…

I will explain what triggers, variables, etc mean below, but for now, click on Tag Configuration to see what options are available. You will see two dropdowns.

The first one allows you select the kind of tracking you want (Page View, Event…). Keep it in Page View for now.

In the next one you must to enter your Analytics Tracking ID creating a new Variable.



Not rocket science here. But again, name it properly! Follow the steps and click Save (NOTE: the Save button is always in the top-right of the page. Sometimes Material design makes things difficult to see).

Congratulations! Now you will have your page views in Analytics managed from GTM.

Now let’s explain briefly what a trigger or a variable means in the context of GTM. You can create and manage variables and triggers with the options in the left menu.

- Variable: this is a chunck of text or code that you can reuse along your tags. This are some variables I have in my site:




- Trigger: as it names suggest, this will fire the execution of a tag whenever a defined event occur. For example: the Page View trigger you have used when creating your first tag means that each time a page is loaded, the event Page View will occur and all the tags containing that trigger will execute. This are some triggers I have in my site:




And this is how the tags list in my site looks like:




Adding other third party tags
It’s easy to install tags for Google products. You also have a lot of third party integrations ready to go. But, what happens if you need to install a third party tag that is not listed? You can do it with the option New tag -> Choose tag type -> HTML Code. Just copy and paste here the tracking code of your third party tool (like Hotjar, ClickTale, etc).

Tracking of specific events/buttons/forms…
Create a tag for Page Views in Analytics is easy. But what if you want to track the clicks in a specify button, or the submits of a form? That was the question that originates this post. So @amp0193, here is the answer.

If you are tracking an Ajax form or a click that send data via Ajax, it can be a little tricky. But here is where the magic occurs. GTM has a great feature that allows you to import recipes from others, i.e. code and configuration that other advance users have done to solve specific problems like this one. Do you remember the capability to export your configuration to share it between sites that I mention in the beginning? Well, you can share that configuration publicly. This are recipes, and they include tags, variables and triggers… ready to use.

So I recommend you one of the best I have found. The recipes by LunaMetrics: http://www.lunametrics.com/labs/recipes/

You can install the Complete Pack, the one that includes Ajax listeners, or you can go with the jQuery AJAX Listener Recipe alone. Scroll down to see all the recipes available, and mentally send good karma to LunaMetrics people :)

The instructions are very clear in its website, so follow the steps. Just in case you don’t notice it, there is a link with a tutorial in the page: http://www.lunametrics.com/blog/2015/08/26/import-container-google-tag-manager/

NOTE: you need jQuery installed in your site for this recipe to work. It’s very common to have it, but if you are not sure, check it with your developer. You can install it from GTM also! Place the code from the last version in jQuery CDN in a Custom HTML Tag with an All Pages. It will trigger load jQuery on every page of your site. But be sure first you don’t have it already in your site. Code duplication is not funny when dealing with javascript.

Once imported, a new tag has been added along with new variables and triggers (depending of your recipe of your choice). The Ajax Listener Recipe comes with this tag:




Now let's track that bitchy Ajax form!
Create a new tag. Name it correctly (something like "GA - Landing suscribe form". I can stress enough the important of good naming to keep order in your lists...).

Select Universal Analytics and in Tag Configuration select Event in the first dropdown. You can fill the blanks in the form selecting variables by clicking the lego piece button in the field, or you can fill it manually (for now is enough).

This fields are the data you will find later in Analytics. You can read about what Category, Label, Action and Value means in About Events - Analytics Help

The other two fields are:

- Non-hit interaction: this usually affects to bounce rate. If false, your event will make a “hit” in the page, so the visit will not count to bounce rate. I.e. You may want that a “suscribe" ajax form submission counts as a conversion and not as a bounce if user leaves your site after viewing only this page. If true, an visitor who launch this event (i.e. suscribe, click) still will count as a bounce if leaves in this page.

- Google Analytics settings: select the variable with your GA tracking ID.

Selecting the trigger
Now is when LunaMetrics jQuery Ajax Listener Recipe will do the work for us.

Choose as trigger type Others -> Custom Event.

As Event Name write “ajaxComplete”. This is the name of the event that the LunaMetrics Ajax Recipe will launch, so this name links the trigger with the event.

Check “This trigger fires on Some Custom Events” and select the conditions you need. This conditions are related to the Ajax response (or the HTML element who recibes the click if you are tracking a click in some part of the web).

For this example, select the variable DLV - attributes.url to trigger the event when the url of the form match with the last field. Select the type of condition in the second field (I recommend “contains”) and write in the last field the url of your Ajax form. You can find it looking at the code of the page and looking for the “action” attribute of the <form> element. Or you can ask your developer.

If your url is something like https://yoursite.com/subscribe-form, use only “subscribe-form”. One image is better than a thousand words:



Save the changes in the tag.

That’s all, I think. All you have to do now is to publish the changes in your WORKSPACE clicking in the SUBMIT button on top-right of the page.

You can (and must) enter in PREVIEW mode prior tu submit. That will allows you to enter in your website from the same browser you have activate PREVIEW mode and see the site in test mode. Open your site in another tab and look for the Tags Fired On This Page that you will see in the Summary on the bottom of the screen. It will look like this:



Did you notice that "GA – Form Sub – Share Deal from Detail” Tag that appears as not fired on the site? This is my Ajax event. If I submit my Ajax form, that block will change its place to the Tags Fired On This Page section. If yours behaves the same, it works!



If you want to learn more advanced stuff about GTM, a good resource is GTM tips - Simo Ahava's blog

I remind you that I’m not an expert, so probably this blog will have answers that I don’t have.

Feel free of play with the different tags, triggers… once you understand the basics, everything will be very straightforward. And probably you will need to configure it once and then forget about it. The changes of the workspaces don’t be published until you click the Submit button, so you can test a lot of stuff in the Preview mode.

Good luck!
 

Don't like ads? Remove them while supporting the forum. Subscribe.

amp0193

Legendary Contributor
EPIC CONTRIBUTOR
Read Millionaire Fastlane
I've Read UNSCRIPTED
Summit Attendee
Speedway Pass
May 27, 2013
3,251
14,449
2,804
United States
This is a monster post, and I don't have time to digest it all right this second... but watching and bookmarked so I can come back to it later next week.

Thanks for taking the time to do this!
 

diegorueda

Bronze Contributor
Read Millionaire Fastlane
I've Read UNSCRIPTED
Speedway Pass
Feb 20, 2016
106
284
176
36
Barcelona, Spain
This is a monster post, and I don't have time to digest it all right this second... but watching and bookmarked so I can come back to it later next week.

Thanks for taking the time to do this!
My intention was keeping it short, by I failed miserably [emoji28]

Enviado desde mi MotoG3 mediante Tapatalk
 

diegorueda

Bronze Contributor
Read Millionaire Fastlane
I've Read UNSCRIPTED
Speedway Pass
Feb 20, 2016
106
284
176
36
Barcelona, Spain
There's something I forgot to include and can be useful...

GTM already comes with some handy built-in variables. But not all of them are visible at first. You can select which ones you want to use in Variables -> Built-ins -> Configure.

Captura de pantalla 2017-09-10 a las 18.44.14.png

Select the variables related with Forms and Clicks, and any other you can consider useful in your case. This will allow you, among other things:

- Configure triggers based on forms IDs, CSS classes or action URL.

- Get the text/ID/CSS classes from a HTML element when tracking an event. When filling in the event Category, Label, etc you can choose this variable and it will place the actual value in it.

Let's see an example:
What if I have a forum whose subscribed users has a banner below their names that says "FASTLANE INSIDER", and I want to track how many people click on that banner? If I track it and the number is high enough, I could consider to put a link there.

Captura de pantalla 2017-09-10 a las 19.03.45.png

I can do it creating an event for Analytics in GTM.

First, I create the trigger. I will use the distinct CSS classes that the banner has: ".userText .bannerOrange.insider" (in CSS jargon that means: an element with the css classes 'bannerOrange' and 'insider' which have a parent with a css class 'userText'). This trigger will fire whenever an element that matches that css selection is clicked.

Captura de pantalla 2017-09-10 a las 19.11.02.png

And now the tag:

Captura de pantalla 2017-09-10 a las 19.16.33.png

I must to say that in this specific case (the click on the user INSIDER banner), the text probably will be always empty. Because the text is in a <strong> element inside the element I have target. The correct css selector will be ".userText .bannerOrange.insider strong", but that only will track the clicks on the word FASTLANE INSIDER and not in the outer element, the yellow banner.

Anyway, you can choose another variable for your event Label or Value than Element Text. Just keep that in mind and test it ;)
 

Mike Partee

(Formerly UnrealCreative)
FASTLANE INSIDER
Read Millionaire Fastlane
I've Read UNSCRIPTED
Summit Attendee
Speedway Pass
Sep 20, 2016
834
3,834
876
23
San Juan
@diegorueda It took a bit to wrap my head around it, but was successfully able to set up conversion tracking for Adwords using a trigger in GTM. Can definitely see this being a very powerful tool. Thanks for posting this!
 

Sponsored Offers

  • Sticky
MARKETPLACE You Are One Call Away From Living Your Dream Life - LightHouse’s Accountability Program ⚡
This program helped me to triple my revenue over 7 months while also moving to a new city in the...
  • Sticky
MARKETPLACE Fox Web School "Legend" Group Coaching Program 2020
Hi Fox, After reading your threat and watching some of your youtube I have several query ? 1...
  • Sticky
MARKETPLACE Lex DeVille's - Advanced Freelance Udemy Courses!
If you read the last message then you know I'm removing my courses from Udemy next month. You...
  • Sticky
MARKETPLACE Grow Your Business With a Book (An Unorthodox Marketing Strategy That Built One of the Largest...
PS. what do you think about the idea of setting up live Busking experiences on Air BNB? I could...
  • Sticky
FEATURED! Introducing... WEALTH EXPO$ED, A Short Story By MJ DeMarco
Hi Mj, I just bought it. And reading it. I think is a great idea to write using the stories to...
  • Sticky
MARKETPLACE Kill Bigger Incubator
@Kak Thanks for the reply. Whats interesting is that I have an idea that's been cooking which...



Forum Sponsor

sponsor

Fastlane Insiders

View the forum AD FREE.
Private, unindexed content
Detailed process/execution threads
Monthly conference calls with doers
Ideas needing execution, more!

Join Fastlane Insiders.

Top Bottom