In this video, you're gonna learn about the top 10 variables you should use within Google
Tag Manager.
All and more
coming up.
Hey there measuregeeks.
Julian here
back with another video for you.
Today we want to talk about Google Tag Manager variables.
Now variables are like placeholders within Google Tag Manager that let us fill our tags,
triggers, and even other variables with this placeholder information.
They get resolved during the page load and can hold different values.
Now, I don't want to get too much into how variables actually work.
But I want to tell you about the 10 variables that I use most often within my Google Tag
Manager deployments.
So without further ado, we got lots to cover.
So let's dive in.
All right, our first variable is the datalayer variable.
If you have a nice datalayer on your page, you'll be able to pull out the data that is
stored in the value of datalayer and transferring this over to a datalayer variable right here.
To do this, simply go over to Google Tag Manager and create a new variable of the type datalayer
variable.
And what you would need to enter is simply the key that you want to pull out.
So in this case, we look at the datalayer and we want to pull out the value of our visitor
logged out, we will need to know the key which is written here in black, the visitor type,
just enter this into the data layer variable name field and you'll be able to then pull
this out of the data layer and store it in a variable.
Now there are a few other tricks to this data layer variable.
But we have a separate video on it that I'm going to link up down below if you want to
check it out.
Next up our auto event tracking variables.
Now if you haven't auto event trigger installed, so for example, the click trigger, or one
of the user engagement triggers, you will likely want to enable all your auto event
tracking variables.
What does this mean?
So for this click trigger, you go over to your variable menu and configure your built
in variables.
And here you will find certain auto event variables that you can enable, just click
them and they will be enabled for you in your account.
Then you can head back and try out your click trigger.
If it's already installed, we just head over to our page, reload this, click on the Add
to Cart button for example.
And then we should see in our variable menu, the enabled auto event variables right here.
And not all of them always get filled.
But if they get filled, they have some important information that lets us distinguish our different
cliques from each other.
And make sure our filter within our auto event trigger is correctly filled.
So for example, here the classes is transferred, or the add to cart, which is the click text
of our button.
And this is vital information that we can later use within our trigger, but then also
within our tech.
So definitely enable your auto event trigger variables if you are using an auto event trigger.
Number three, the Google Analytics settings variable.
Now when would a Google Analytics settings variable be useful?
Well, if you have Google Analytics installed through Google Tag Manager, and you have several
tags that are sending data over to Google Analytics, you might know the tech template
of Google Analytics where you have many different settings that you can choose right here.
And a settings variable is simply a variable that will fill out all these different fields
based on one variable.
So for example, here we have the tracking ID in here.
And this is something we would need to repeat all over again, in our other event tags, for
example.
So for convenience sake, we can simply build a new Google Analytics settings wearable that
will prefer this tracking ID field, who can go and build a new Google Analytics setting
circle, and filling our tracking ID once save this.
And Henceforth, we have it available here in our settings, terrible drop down and can
choose this.
And we will get rid of the Enable override settings and this tag.
So all the settings that would normally be put into these fields here are now governed
by one central variable, our Google Analytics settings terrible.
So it makes our lives easier because we know that this is all governed by one single variable,
our Google Analytics settings terrible.
It also makes it easy to expand our tracking, because we will be able to go into the settings
variable itself.
And let's say one or two sent a custom dimension with all of our patrons and events, we simply
wouldn't need to go into the settings terrible, and then choose the right dimension right
here.
So we'll add a custom dimension and can use another variable to fill this out.
The same is true if you had a setting that you want to set on all pages, like a humanized
RP to true or the cross domain
tracking settings
wants to find in the Google Analytics settings arable this will obviously also transfer to
all your tags that you have already installed.
So the Google Analytics area circle is essential working with Google Analytics and Tag Manager.
Next up the URL query variable.
Or this variable is particularly useful if you see any kind of query string in your URL.
And you would like to get this information for example, here would be the search term
that was entered into the search bar into some kind of tag or use it in your triggers.
So with the URL variable, you can easily pull this out, just go over and create a new variable
of the type URL, and then choose as the component type, the query type, then you just need to
know the query key.
And the key is whatever is in front of the equal sign of your desired value.
In our case, it would be simply s and give it all the name.
And we should now have it available
as a variable to us inside of our tax entries.
Next up
the referral variable.
This is a variable that is already built in and also enabled by default.
So you should be able to find it under your variable menu really easily, right here.
Now, what does this variable tell us, it's actually the URL that the user just came from,
before he entered this page.
And since the refer to this website, this can be quite useful if you just entered the
page.
So for example, right here, if I go on the search result from Google and come to the
page, our referral should have something to do with Google.
So let's look into the referral variables.
And here we go, we have a refer from google.com.
And we could utilize this to always fire a tag when somebody comes from google.com, for
example, or we could also utilize this in our other tags to send that data to our analytics
tools.
And our six variable is the first party cookie variable.
Oh, if you would navigate around with Google Tag Manager on your page, you know that the
preview mode reloads every time you go to a new page.
That also means the page you dumb ready and window loaded, appear new in your preview
mode, and the data layer gets filled with new data.
Unfortunately, Google Tag Manager cannot remember anything that was going on beforehand.
Each page load means a new loading of Google Tag Manager and web development, you can persist
the data.
And commonly there are cookies used to do this, you can set cookies with Google Tag
Manager.
But that's a topic for another video.
For now, we just want to view the cookies that are set on our browser will open up our
chrome menu here to go into the developer tools.
And here we get some useful information under the application tab.
And cookies right here we can see what data was set
through different code on our website.
Now in some cases, there's more useful information.
In other cases, it's unusable because you don't really know what it exactly means.
But as I said, you could actually also set your own cookies.
For example, this cookie here is this user newsletter subscriber was set to true probably
he came from a newsletter source.
And therefore we can identify this user and we have written this information to the cookie,
how can we make the useful now in Google Tag Manager, we can pull out this value from our
cookie.
By building a first party cookie variable, all you need to do is go over to Google Tag
Manager and under the user defined variables will choose a first party cookie variable
as our type.
And we need to have the nickname in our case, the cookie name is newsletter
subscriber
gives us all a name.
And the should now pull out the right value from our cookie.
And voila, here we go.
So maybe have a look in your cookies.
What useful information you could pull out with this first party cookie
variable.
Next up the DOM element variable.
Now what does Dom stand for it stands for the document object model.
This is how our site is marked up and we can simply right click on any element on our website
and click on Inspect Element and Chrome, which will open up the elements Fein here and give
us the visual representation of the document object model with the DOM element variable
will be able to pull out any kind of node that we are interested in and get either a
attribute or the text in between those elements.
So for example, here, if I wanted to pull out the card menu, and the amount of this
card menu, I would need to either know the ID or this element doesn't have an ID or the
CSS selector.
Luckily, there is a class of amount which we can utilize in our variable really easily.
So let's head over to Google Tag Manager.
And he under variables, we'll go into our new user defined variables and click on the
DOM element.
For variable.
The selector method is this time CSS selector because we don't have an ID, and we had a
class with red dot here and amount you need to know a little bit of a CSS selectors in
order to do this protectively.
And then we can choose the attribute that we want to pull out.
Since we want to pull out the text, we can leave this empty for now.
And let's give this all the name.
Save this.
And let's try this all out.
And here we go, we get the dumb card value of $48.
And it pulled it right out of the page.
Getting more advanced, we're gonna take a look at the lookup table variable lookup table
variable as different use cases.
But the easiest would be to simply rewrite an existing variable.
So for example, we have already had a variable that we created earlier, that will pull out
the value from our cookie new set of subscribers true.
Now if you use this inside of a event tech, for example, you would simply see true in
the action and you wouldn't quite know what this means.
So you would like to rewrite this variable into something more recognizable like subscriber,
this is easily possible with lookup table variable head, let's head over to Google Tag
Manager and build a new user defined variable.
And this time, we'll go with our lookup table.
lookup table really works like in if the standard statement, if what variable in our case, it
would be our cookie variable, and then we can add certain roles.
If the input is true, then we want to rewrite this into subscriber.
If the input is fault, rewrite us into non subscriber.
And the default value.
If something else happens, we can just say on identified.
Alright, let's try this out, give this first name and see what happens.
We'll go back to the page below this.
And our variable that we had before shouldn't change we have still have cookie newsletter
subscriber true, but rewritten, we should have this in our lookup table.
Here we go as subscriber.
Now what happens when this is actually false, let's change out around our cookie just to
simulate going to reload the page here.
And we should see our lookup table subscriber is now non subscriber and our cookie, just
state asphalt.
Now look up tables can be used for many different other circumstances.
And we have some videos linked up down below if you want to explore this more.
Next up the reg ex lookup table.
What you might have noticed is that when we created our lookup table subscriber variable
here, we need to be very precise with the names.
If I type in anything else, or put a white space in here, this wouldn't match up anymore.
And we'll just get an undefined in our field value.
Therefore, the matching option that we have in this first input column is similar to equal
to so the cookie new set of subscriber needs equals true in order for it to go into the
output subscriber.
But what we also have available is a variable type of reg ex lookup table.
Now what is reg ex reg stands for regular expression.
And if you're familiar with reg ex, you know that you can really get detailed in your search
query, which can be very powerful.
So for example, let's take a more advanced case, let's say we would like to classify
all product pages like this into a product category.
So we would like to have an output of product simply to classify our product pages.
And we can have one for category pages as well, we can easily do this with a reg ex
table.
So you can come over here and say the input would simply be the page path.
And you can add here, if the page past contains anything like slash product, and I wouldn't
need to escape them, then the output should be product.
And if there's a category in there, then the output should be category probably also need
to match the spaces afterwards, right here and before.
So what I will do is around this by dots stars, which means everything multiplied.
So let's put this in the front and the back here and see if this works.
Let's save this, and refresh, refresh this page.
And and all variables.
We now see the next table has the name category beyond a category page, we're looking at the
URL right here or the URL path.
And this matches up.
And if you go to a product page,
we have the same result with the product now, because we looked at the URL again, and we
matched up this part that is in the side of the URL, I hope you understand that you can
be come more sophisticated reg x in this reg x table then you are with the normal lookup
table.
And this can be very valuable, for example, for content grouping and Google Analytics
or to look at the refer, you could be doing channel grouping really effectively, and centers
on to Google Analytics easily.
So reg, several, really an advanced feature, which can be quite powerful in Google Tag
Manager.
And we have come to the final the champion, the variable to rule them all, which is the
custom JavaScript variable.
Now, the custom JavaScript variable is probably the most versatile, but also the most complicated
to write yourself, or the easiest to use if you just copy code it.
But to be honest, the custom JavaScript variable could potentially be used to replace all the
variables that you have seen in this video, because JavaScript is the technology that
is powering Google Tag Manager, and therefore will be able to do everything a Google tag
manager does with JavaScript in this custom JavaScript variable.
So let's go with a little example.
Here.
In Google Tag Manager, I can simply go over to our user defined variables again, and create
a new custom JavaScript variable in here we need to adhere to some conventions.
One is to write an ominous function that returns a value.
So put this in right from the start in between, you can execute any kind of JavaScript code,
you obviously would need to know a little bit of JavaScript, and return a value.
Just as an example, let's go with the current time, which we can get by writing new date.
And let's return this time, who gives us all a name and say this is refresh, refresh our
page.
And see in the variables what the spit out, you see here, this gives us back a parable
of the type date with our actual current, date and time.
And this should dynamically change.
You see here at the second level, that some of these are changing, depending on when the
event loaded.
Again, with a little bit of more JavaScript, a little bit of more code, you could probably
make this quite useful, for example, to send in a custom dimension into Google Analytics
to have the exact timestamp of when a hit was sent over to Google Analytics, or to calculate
how long a user was on your site.
But I won't have time to explain to you right now, how this would work.
I just hope that you understand the potential of this custom JavaScript variable.
And luckily, we have tons of more videos on the custom JavaScript variable, which use
cases on this channel linked up down below.
Alright, so there you have it.
These are my top 10 variables that I use within Google Tag Manager.
There are more out there and there are also many other use cases for these specific variables.
And I leave it up to you to give me your tips down in the comments below.
I'd love to hear from you as always, and if you haven't yet, consider subscribing right
over there because we bring you new videos just like this one every week.
Now.
My name is Julian.
Til next time