Alright, now that we know what
Google Tag Manager is all about, let's start from scratch.
Setting it up. How do you get started with GTM?
Well, you first need to create your
account and then install Google Tag Manager onto your website.
Let's take a look at our options here.
So, the first thing that you want to do do on your browser is to go to tagmanager.google.com
this is the URL that you would need to remember and you might be logged
in right away into your Tag Manager account.
Or you might get a window to log into your Google Account.
First you need to have a Google Account
in order to utilize the service of Google Tag Manager.
Now, if you don't have a Google account, you can easily create one down here.
So once you are logged in, you might be greeted with this screen or
another screen where you set up your first account that you have access to.
The Google Tag Manager is
compartmentalized into accounts and then underneath those are containers.
You can have access to multiple accounts,
you can create multiple accounts, and underneath of each account you can put
in different containers, which are basically your websites.
So, to get started here,
I would say if you are creating something completely from scratch,
name the account name the best practice after your company.
So for example, we'll go through a demo and then you can choose the country.
And if you want you can share data with Google as well.
Then you come to the container name.
And here's where I would enter
the website, but it is not connected to your website in any way.
This is just the name of the account, so you could call it anything you want.
So for example, we'll go with demoshop.com
because that's where our website is installed.
Now here we have the target platforms
that we can install Google Tag Manager on, and we will go with web here.
But there are many different other
platforms that you can install Google Tag Manager on.
iOS, Android app, and also a server side instance.
But these are specialized and they don't
have the same interface or the same functionality even than the web interface.
But since we want to install our tracking on our website, we'll go with web here.
Let's create this.
Once you click the create button, you will be thrown into this interface
where you see your codes that you need to install onto your website.
So the question is, how do you now get these codes onto your website?
Well, it depends on the level of access that you have to the website itself.
And there's a whole range.
Sometimes you are not the administrator
of the website itself, you wouldn't need somebody else to install it for you.
Sometimes you can edit the code directly or sometimes you can install plugins.
So these are really the three methods that we can cover today.
So the first method would be.
Well, you don't have access to the website itself.
You might have a web development team
that is administering your website and they would do any kind of code changes.
Because we need to integrate Google Tag Manager on the code basis of our website.
The HTML needs to be edited and what needs
to be done here is to install this code here in the head section and then this
code here in the body section of your website.
Again, if you are not the administrator of website, you wouldn't even touch these
codes, but you would need to copy them out and send them to your developer.
What do you tell the developer once he sees these codes?
Well, we have a little template for you that you can utilize.
You can make a copy of this one.
We have the link in the description down below measureschool.com/gtmunstallation.
And you can get access to this little document where you have to swap out your
website here and your support questions and then your codes obviously here,
but otherwise everything is explained and also some links here for the developer
if they want to read about what needs to actually be done.
And then, hopefully, Google Tag Manager will be installed.
We'll go through the steps of actually
checking whether Google Tag Manager is installed correctly in this next step.
Because what I want to show you right now is the other end of the spectrum.
If you have total control of your website and you can edit the code and you are
somewhat familiar with editing codes on your website itself.
Now I realize there are many different
platforms out there that you can install Google Tag Manager on.
We have made a lot of videos already about
different platforms that you can install Google Tag Manager on.
So check out our playlist on that one.
But our website is running on WordPress right here.
And WordPress websites are governed by themes and themes are where you would
be entering any kind of code that you want to have installed on your website itself.
So I've logged into the back end here
of our website and I navigated over from appearance to theme file editor.
And then I chose for my theme right here the header PHP.
And this is where you would need to go for WordPress.
This is WordPress specific.
And here we can see the HTML and actually the opening head tag right here
and the closing head tag is something that is embedded in this PHP here.
But right underneath here,
or even above this one, we can place our Google Tag Manager code our first code.
So we have two codes here, one needs to be placed in the head
and the second needs to be placed in the body section.
So I'm going to copy this one and then head back here and paste my code.
And then in Google Tag Manager I will get the second code here.
And this needs to be immediately after the opening body tag.
So the opening body tag for our theme is right here.
And we'll add our code in like that.
Then we click Update File and Google Tag Manager should be installed.
How can we check this now?
Well, the first check is actually going to our website itself,
right clicking on the website and then going to view Page Source.
And here we should see the Google Tag Manager snippets.
So here we have Google Tag Manager installed.
And then if we look for the opening body
tag right here, we have our no Script tag installed as well.
So this should be installed correctly onto our website.
Now, normally we need to make sure
that this is the case for all the pages on our website.
So not just one website should be installed on.
You could obviously now click around and say, okay, I'm going to this next
website and then checking this one as well and seeing if your code is installed.
Yes, that's the case here.
So this is all great,
but we can also utilize the preview in debug mode of Google Tag Manager
that showed you already in the last lesson, because that can connect once
Google Tag Manager is installed to your website.
So you can go here to preview.
Then we enter our URL here and we connect.
That will open up a new browser.
You should see that little window here with this yellow dot.
Sometimes it's a different color,
but this will correspond to the yellow dot right here.
So if you have multiple tabs, open would have different colors.
And here we can see Google Tag Manager loaded correctly.
If you see this kind of thing happening
here, then Google Tag Manager is installed, at least on this page.
Let's go to this page and let's go over to this page.
Then let's add something to Cart and go over to the Cart and so on.
And in our tab here, we should see many different pages that were opened.
And we can always look at the URL that we are at right here.
And it seems to always load on these websites.
So Google Tag Manager seems to be installed on all of these pages.
So this is the second check that you can
do and see if Google Tag Manager is working correctly on the website itself.
The third part is through third party extensions.
So for example, the Tag assistant is one you can enable that you would need
to download it for your Chrome browser, enable it.
And then we'll reload this page and see what it says here.
Google Tag Manager is installed.
Don't care about the color as long as it's not red.
Everything is working just fine.
All right, so this is the second method.
If you have full access to the back end of your website to install the code,
you just need to find the right places in the code itself.
So it's actually in the theme files or
somewhere else in your back end system where you can insert these kind of codes.
Again, the first one needs to be in the head section,
and the second one needs to be right beneath the opening body type.
Now, just one word of caution here for the placement of the codes.
The earlier and the higher up you install Google Tag Manager, the better in the code
itself because the likelihood is higher that this code gets executed.
So just to show you here,
if you go to view Page source, this is pretty high up in the HTML itself.
So when the computer or the browser starts
rendering this page, it will start from top to bottom.
And if Google Tag Manager runs pretty early on the page,
it's more likely that your tags are fired and your tracking is working correctly.
If this code would be lower on the site, what could happen is that the page already
loads, but your codes have not yet been deployed.
And what the user can do, even before the page has stopped loading,
they can go to the next page, or the next page, or the next page.
And that might mean that your tracking codes don't fire.
So put your codes as high up as possible on the page.
Right, let's talk about the last methods or the in between method.
If you don't have maybe a development team
or you cannot install these directly in the code, there's a third option
that is quite popular, especially with WordPress.
These are plugins.
So if you have a back end system that is maybe developed by a third party and they
offer plug in support, there might be already a plug in out there
that you can utilize to install Google Tag Manager pretty easily.
So just to show you that, if I go back here to our backend system
and I'm just going to get rid of the codes that we have just installed so we don't
double install Google Tag Manager, which would also not be good,
let me get rid of this one and we'll get rid of this one.
We'll update the file.
So now Google Tag Manager should be not installed anymore.
And what we want to now do is go to our
plugin directory and we want to add a new plugin.
There's a pretty good one out there called Google Tag Manager for WordPress.
So let's just put in Google Tag Manager here.
Google Tag Manager for WordPress by Tomas Geiger.
And we can activate this one.
And now it should be installed in our WordPress plugins.
And all we need to do is go over
to Settings and then here is Google Tag Manager.
Now it has a field here to install Google Tag Manager for us.
So we need to get our GTM field right here.
I'll copy that and put this into this field here.
And then we want to have the container be deployed via this plug in,
and we can choose the different ways to install this.
There is an automatic mode so where you don't have to do anything.
You can place it in the footer.
I wouldn't recommend this one.
Or you can manually place the code by adding these into your Steam files.
Again, this plugin actually does more than
just install Google Tag Manager onto your website.
You can also install data layers with it as well.
So it's pretty useful plugin, especially if you work with WordPress.
So let's save these changes.
And again, you would need to go through
the steps and look if Google Tag Manager is correctly installed.
Go to View page source here.
And the placement might be slightly different than what we had before.
But here we go. We have our Google Tag Manager code.
And then also let's actually look
for Google Tag Manager here or our ID directly.
So this is the first code that needs to be installed in the head section,
and the second code actually doesn't get installed, apparently.
So that is a decision by the plug in maker.
I think it's because the second code is actually not that important.
It's a fallback for when JavaScript is not enabled on the browser, but nonetheless,
Google Tag Manager is installed on this website.
We can look at our tag analysis here.
It says that it's installed two times, but we already looked into the code.
It's just one time.
Sometimes this extension has some weird results.
So you can ignore this error right here and again, we could also then go
on to different websites and see if our Tag assistant connects here.
If our Tag Assistant connection is
servered, you can always go back and click on Preview again and then reload the whole
preview mode in order to reconnect to the website itself.
So just make sure that it's installed on all the pages.
And that's apparently also the case with this plug in.
All right, so there you have it.
This is how we can install Google Tag Manager onto our website
and check that it's actually working correctly.
Now, your website is probably quite different from our website.
That's the nature of the internet.
But we have a playlist for you that you can check out where we install
Google Tag Manager on many different other platforms.
Check it out right over here.
And now we are ready to get started
with Google Tag Manager and install our first tags.
That's what we're going to do in the next lesson.
And I'll also show you how we can check
whether our codes then are deployed correctly.
If this video to help you out, then please hit that thumbs up button so
it gets shared to many more people out on YouTube.
And then the next lesson is probably already available right over here.
So my name is Julian, and see you over there.