Back

Analytics, Google Tag Manager, SEO

Create & Set Cookies with Google Tag Manager to Track User Behaviours

Colin Differ

By Colin Differ

04 March 2019

It's nice to share:

For advanced users of Google Tag Manager, there will be times when you’ll need to create a Cookie and trigger it to fire on a site without the use of a developer. There are various reasons for this, but the most common one is to capture some information from a user on particular part of the site, and to release and record that information elsewhere on the site; this will allow you to track your visitors’ online behaviour.

 

Specific examples are:

 

In this post we will discuss how to record the value of a Tracking Parameter.

 

6 Steps to creating & setting a Cookie in GTM:

  1. Create the variable that will be recorded by your Cookie (optional)
  2. Create a Custom HTML Tag which holds your Cookie JavaScript
  3. Create a Trigger which fires the Cookie
  4. Create a 1st Party Cookie variable to import the Cookie value back into GTM
  5. Test and debug your Cookie Tag
  6. Publish

 

Create the variable that will be recorded by your Cookie (optional)

 

Whilst it might not always be necessary to store a variable in your Cookie, more often than not it is; the first thing you should do (if you haven’t already!) is to create the variable you want to be stored in the value of the Cookie. In this case, we’re storing the Query Key ‘Source’:

 

 

 

Create a Custom HTML Tag which holds your Cookie JavaScript

 

Paste the code of your Cookie into a Custom HTML tag in Tag Manager.  Your Cookie code will depend on what you are recording, although it should look something like this:

 

<script>
 
var cookieName  = "website_source"; 
var cookieValue = "{{URL - Query - Source}}";			//pull in the value from a variable or constant here, true, false etc
var cookiePath  = "/";

var expirationTime = 86400;                          	//time the cookie should expire in seconds
expirationTime = expirationTime * 1000;                 //Convert expirationtime to milliseconds
 
var date = new Date();                                  //Create new date
var dateTimeNow = date.getTime();                       //What is the current time in milliseconds

date.setTime(dateTimeNow + expirationTime);             //Set expiration time

var expirationTime = date.toUTCString();                //Convert milliseconds to UTC time string

document.cookie = cookieName+"="+cookieValue+"; expires="+expirationTime+"; path="+cookiePath;  //Set cookie

</script>

 

And it should look like below:

 

 

 

Create a Trigger which fires the Cookie

 

Now that you have the core of your Cookie created, you need to tell GTM when to fire it. In our example, the Cookie should fire when the URL contains ‘source=’ in the parameter query string, for example:

https://www.propellernet.co.uk/?source=otherwebsite&medium=…

 

 

 

Create a 1st Party Cookie variable to import the Cookie value back into GTM

 

Although GTM has created the Cookie, it cannot extract the value of the Cookie unless you create a 1st Party Cookie Variable. This is a built-in variable that returns the value for the first browser Cookie with the name you specify in the Cookie Name field.

 

 

 

Test and debug your Cookie Tag

 

As with every tag you publish in Tag Manager, you should always test it before publishing. To do this, click ‘preview’ in GTM, head over to your site and make the trigger fire the tag you created. For cookies, you should be able to check if it has worked in one of these two ways:

 

 

 

 

 

Publish

 

Once you’ve followed the steps above, publish your container and boom, you can now track your visitors behaviour in the browser.

 

Propellernet offer Google Tag Manager Training and Google Analytics Training in Brighton and London. Please contact us for more information