3 custom variables for working with cookies and Web Storage API in Google Tag Manager

Google+Tweet about this on TwitterShare on FacebookShare on LinkedIn

Here’s a quick tip on how to deal with browser storages (local and session storages) and/or cookies in Google Tag Manager. In this post I will show you three functions helping you to easily create, delete cookies in GTM and set/remove items from session or local storages of users’ browsers. Off we go!

Create a cookie

Use this function to create cookies in Google Tag Manager

The function has three arguments – name, value and options. While the first two arguments obviously do not require an explanation (name is the name of the cookie you want to create, value is a string (!) used as a value for it), the third one deserves a few extra words.

Option is an object, containing all necessary settings for the cookie you want to create. For instance, path or domain or security status. Let’s have a look on examples to make it clear.

Usage

Create a custom JS variable and paste the code above in it. Call this variable to create cookies in Google Tag Manager, say, in a custom HTML tag without specifying any options (in other words, the code below creates a session cookie).

And this is how you create a cookie with a specified path, domain expiring in one hour.

Read values of cookies in Google Tag Manager

As you surely know, getting values of cookies in Google Tag Manager by their names is super easy. Just create a 1st party cookie variable and use its name as a value for it.

cookies in google tag manager

Delete cookie

Use this function to delete cookies in Google Tag Manager

This function also has three arguments, the last two of them are optional (path and domain). They are required to use when a cookie you want to delete has a specified path and domain settings.

Usage

Yet again, create a custom JS variable with the below code and call this variable (returning a function) whenever you need to delete cookies in Google Tag Manager:

Create items in session/local storages

Local and session storages can be very useful when it comes to choosing a method to maintain users’ information.  I’d say in most cases concerning GTM usage it is even more preferable to use session or local storage than cookies in Google Tag Manager. And here is why.

So, the following function allows you to create an item in local/session storage.

Type – define the type of the storage you want to use, local or session.

Name – name of the item

Value – item’s value

Usage

You know it. Create a custom JS variable and paste the code above in it. Call this function whenever needed. Here are examples:

PLEASE NOTE!

When the third argument, item_value, is not defined, the item will have value of undefined.

Summary

Don’t forget to pay enough attention to functions’ arguments while playing with them in Google Tag Manager. Remember, you can easily use other GTM variables as arguments.

As always, should any questions arise, let me know in the comment section!

Google+Tweet about this on TwitterShare on FacebookShare on LinkedIn