On this page, you can download a Google Tag Manager (GTM) Container that contains a Cookie Consent (opt-in) dialog box, and a set of triggers to use for “opt-in” and “opt-out” tags. No external scripts are needed for it to function.
For now, it’s a simple yes-no system, but with a bit of copying and pasting, you can easily extend it to multi-tiered permissions.
Check out a working demo here!
I’ll explain below how it works and what the features are.
Why ask for Cookie permission?
Well.. you should. It’s the law, at least here in Europe. In practice, you only have to ask it if you use third party tracking (e.g. Google Analytics tracking via Doubleclick) or if you place dozens of adnetwork cookies.
Anyway, you’re probably here with the intention of installing the thing, so here’s how it works.
How it works
The setup is pretty simple: I’ve created a 1st party cookie variable named: Cookiepermission – content.
When the cookie exists, it triggers either:
- The trigger: Cookiepermission – no (if the cookie has “no” in it)
- The trigger: Cookiepermission – yes (if consent was given, the cookie has “yes” in it)
When the variable is not set (there is no cookie), the “Dialog Tag” named Cookiepermission – ask loads via the trigger Cookiepermission – unknown. This tag does the following:
- Show an overlay with an option screen where a question is asked, along with two buttons:
- Option “No” button
- Option “Yes” button
- When clicked, the value “No” or “Yes” is stored in a cookie
- Finally, based on the choice made, a “firstpage” trigger goes off
- Trigger Cookiepermission – firstpage yes (if “Yes” was answered)
- Trigger Cookiepermission – firstpage no (if “No” was answered)
The last triggers makes sure tracking tags are sent on the first page as well, without having to reload the page.
Prefer a visual explanation?
This is the logic in a nice little diagram.
There are several GTM Variables that you can use to customize your setup:
- Question text – here you can configure the Question Text
- Yes text – the text on the “YES” button
- No text – the text on the “NO” button
- Cookie expiry – the number of days the cookiepermission cookie is valid
- Cookie name – the name of the cookiepermission cookie
Making it look good
For now, you’ll have to edit the Cookiepermission Dialog tag to edit or remove the styling.
Ofcourse, you can include your own stylesheet in the HTML of the page. The overlay and dialog box all have proper id attributes.
For all your tags that you need opt-in for, you should change the trigger. No more “Page Load” triggers without opt-in. Use the built-in triggers “cookiepermission – yes” and “cookiepermission – first page yes” for those tags.
I’ve also included “no” triggers in the container. This is not really needed per se, but might come in handy if you want to use it as an exception trigger.
Download and install
You can import this container into your own setup (please test it first – import it into a test container to configure it, then export-import it to your final destination).
All tags, triggers and variables are neatly organised into a folder, aptly named cookiepermission, for your convenience.
Need help? Contact me, either in the comments or send a tweet to @zjuul and I’ll guide you along. If you want me to do the actual work for you: use the contact page or send me an email.
Photo Credit: https://flic.kr/p/9Mcwzt