To effectively use Google Tag Manager and Cookie First you can use the following guide to implement the banner and to configure Google Consent Mode for your website.
We assume you already have knowledge of GTM and have created a website container to configure tags for your website.
Enable Google Consent Mode for your cookie banner
Open your Domain settings and go to the tab "Banner settings". Enable the option Google Consent mode and save your configuration.
1. Install over GTM gallery
Go to your container, then under templates click add variable template from gallery. Look up Cookie First and you'll find the template to add to your container. Or go here and add it to your workspace. https://tagmanager.google.com/gallery/#/owners/cookiefirst/templates/gtm-template
2. Add the Cookie First banner to your site
Login to Cookie First and obtain the API key under the "Embed scripts" section for the domain you're editing.
- Add a new Tag to your GTM - give it a name eg. CookieFirst Config
- Click "Tag Configuration" and on the panel select under "Custom" the Cookie First template.
- Add the api key you copied from your Cookie First backend and paste it in the API key section.
You can also enable additional settings:
Pass Ad click information through URLs: When a visitor lands on an advertiser’s website after clicking an ad, information about the ad might be appended to the landing page URLs as a query parameter.
Redact Ads Data: When ad_storage is denied, new cookies will not be set for advertising purposes. Additionally, third-party cookies previously set on google.com and doubleclick.net will not be used. Data sent to Google will still include the full page URL, including any ad click information in the URL parameters.
2.1. Set the Default Consent State (Google Consent Mode)
In the next section of the template you can configure the default google Consent Mode settings for your tags. If you want to use them. You can also still use our legacy GTM configuration for your tags.
In this section you configure which Categories of Cookies and Scripts will be granted or denied before a user submits his/her consent. You can set defaults for specific regions. For a list of supported region codes check this wiki page.
Important: the default setting for these categories is Denied. This is the most strict setting, most of the data protection legislations require and Opt-In basis called 'prior consent'. Which means only necessary cookies/scripts can be set before a user consents.
Click the New region setting and select the defaults for this region. By leaving the region empty this setting is for every user no matter the region.
Click Save to save your tag.
GTM and Consent Mode supports at this moment 5 different Consent Types which are mapped to the cookie first categories.
| GTM Consent Type | Cookie First Category | Description |
| ad_storage | advertising | Enables storage (such as cookies) related to advertising |
| analytics_storage | performance | Enables storage (such as cookies) related to analytics e.g. visit duration |
| functionality_storage | functional | Enables storage that supports the functionality of the website or app e.g. language settings |
| personalization_storage | functional | Enables storage related to personalization e.g. video recommendations |
| security_storage | necessary | Enables storage related to security such as authentication functionality, fraud prevention, and other user protection. *No consent required although users are informed in the cookie policy about these scripts and cookies |
2.2 Set the correct Trigger
1. Select under 'triggering' Consent Initialization - All Pages read more about this trigger.
2. Save your tag. If you use preview or publish your container the banner will be added to your website.
3. Configuring your Tags
Some Google Tags like Google Ads (ads conversion and re marketing), Floodlight and Google Analytics have built-in consent checks. You can execute these tags normally like you would. (If you currently have our legacy GTM enabled you can disable these triggers)
How to check whether a tag has Built-in consent checks?
- Open the tag and click Tag Configuration
- Click Advanced Settings
- On the bottom click "Consent Settings'
For tags that do not have built-in consent checks you will need to add the Consent Types yourself. These are called "Additional Consent Checks"
3.1. Additional Consent Checks
Your tags that do not support the Built-in consent checks now need to be configured to work with the Consent Types. Open a tag click Advanced settings -> Consent Settings and fill in the Consent Type required for this tag. In the tag below I added the advertising type. You can use the following types: ad_storage, analytics_storage, functionality_storage, personalization_storage or security_storage
3.1. Additional Consent Checks
- Create a new trigger in your container. Select "Custom Event" give it a name eg "cf_after_consent_update"
Parameters:
Event name: cf_after_consent_update
Fires on: All custom events
This makes sure that as soon as someone accepts the cookies the tag is fired. If you would add the "All Pages" trigger to these tags then the tag will fired upon reloading the page. - Your tags that do not support the Built-in consent checks now need to be configured to work with the Consent Types. Open a tag click Advanced settings -> Consent Settings and fill in the Consent Type required for this tag. In the tag below I added the advertising type. You can use the following types: ad_storage, analytics_storage, functionality_storage, personalization_storage or security_storage
- To enable this tag to fire you need to setup the triggering, select here the Trigger you created in step 1.
To have a better overview of the settings for your tags and if Consent Mode is enabled you can enable the Consent Overview. Read more about how to enable this here.
