How to set up Google Tag Manager

by | Aug 7, 2019 | Design & Dev, How-to

how to use google tag manager

How to setup Google Tag Manager

Using Google Tag Manager is a good idea for anyone who owns a website. Setting it up and using it correctly can be a bit difficult at first, but it pays off in the long run. In this article, we will run through the steps to set up your account along with one practical example of how to use it with Facebook adverts.

 

Introduction

Google Tag Manager is a powerful program developed by Google to manage the marketing tags on your website without having to dive into the code of your website.  It also lets you test if your implementation is done correctly.

Tags are snippets of code that are supplied to you by a third party to track activity.

Let us understand this with an example. We are going to look at the Facebook tag, known as the Facebook Pixel. When you have an ads account with Facebook they will supply you with a pixel. (Click here to read our article about setting up a Facebook campaign where I cover more about the Facebook Pixel) We need to install this Pixel on every page of our website and check that it is working, this is where we look to Google Tag Manager.

If you need to know how to set up Facebook Pixel, check out this article instead.

 

How to use Google Tag Manager?

First, go to Google’s tag manager website and set up your own account. You will be asked to input the name of your account, country, name of the container, and the target platform. If you have more than one website you will want to make a container for each one. So place the name of the full account. For example, for Digital Lime Green’s website, it will be DLG Holdings (account) and the container will be dlg.digitallimegreen.com (the website). We will select ‘Web’ for the target platform as we are wanting to install this on a website.

Second, you will then be asked to install some code on your website in the <head> and <body>. If you don’t know how to do this, please send this to your developer or webmaster. This will be the last time you need to do this. You can click here to view how to install this code using WordPress and the Divi theme.

Google Tag Manager is now installed and ready for us to play around in.
On the right-hand side you will see the following information:

  • Overview
  • Tags
  • Triggers
  • Variables
  • Folders
  • Templates

 

Example: Google Tag Manager with Facebook Pixel

We need to install this Pixel across all the pages, so let’s click Tag on the right-hand side of the page then select ‘New’.

A box will open with Tag Configuration and Triggering within it. Firstly select Tag Configuration.

Another box will open and ask you to select a configuration. For Facebook, we will need to select ‘Custom HTML’

You will then be able to add the Facebook Pixel code. You can also name the Tag. I have named mine ‘Facebook Pixel’.

We will now scroll down to Triggering and select. Another box will open and there will be one line named ‘All Pages’. Triggering is when Google Tag Manager will send information back to Facebook. We want to fire this tag on all pages so you can select this line.

You can select ‘Add’ and then ‘Save’. You will now see your Pixel in your Workspace. We are now ready to test that everything is set up correctly. In the top right-hand corner select ‘preview’. The page will refresh and you will see an orange banner at the top of the page.

Now you can open your website. Google Tag Manager has put your browser in a special state which allows you to see which tags from Tag Manager have been fired. When you open your website you will see a box open at the bottom of the screen showing you which tag has fired. You can also use the Facebook Pixel Helper for Chrome to check if your pixel has been fired correctly. To download the Pixel Helper for Chrome, click here.

You will see that the pixel has been fired. We are now ready to ‘Submit’ the tag. You can exit preview mode by click on ‘leave preview mode’. You can click on ‘Submit’, another box will open and ask if you would like to add some version notes.

Yet another box will open and ask you to confirm your changes. You can select ‘continue’.

Finally, it will bring up the version that has been published.

 

We can help you!

Need further assistance? Feel free to connect with Digital Lime Green on our portal and get assured quality assistance from our team!