In this guide, we will show you how to:
- Implement the cookie consent banner in DTM
- Use Cookiebot in DTM to control cookie-setting tags like Google Analytics and Adsense
- Display your cookie declaration in full on a subpage using DTM
1. Implementing the cookie consent banner in DTMFirst, create the data elements which are the glue between Cookiebot and DTM event handling.
From your DTM property click the “Rules” tab, then the sub-tab “Data Elements” and finally the button “Create New Data Element”.
Create a total of three Data Elements with the following unique values:
|"Cookie Consent Preferences"||"cookie_consent_state.preferences"|
|"Cookie Consent Statistics"||"cookie_consent_state.statistics"|
|"Cookie Consent Marketing"||"cookie_consent_state.marketing"|
For all three Data Elements, select “JS Object” as type, “false” as Default Value and “Pageview” for persistence.
Example on Data Element “Cookie Consent Preferences” configuration:
Now, click the “Page Load Rules” sub-tab to create a rule to include the Cookiebot tag on all pages.
Click “Create New Rule” and configure the rule with the following value:
Name: “Cookie Consent”
Conditions/Trigger rule at: “Top of Page”
Conditions/Add criteria for URL-Path: Path include “.*”, enable Regex
Insert the following code:
At the same time, make sure to enable Cookiebot on your website by registering the domain name(s) of your website(s) in Cookiebot.
Replace the cbid-identifier value "00000000-0000-0000-0000-000000000000" in the code with your own ID from the "Your scripts" tab in the Cookiebot Manager.
This is what your rule configuration should look like in DTM:
Finally, approve and publish your changes for the consent banner to display on your website.
2. Controlling cookiesTo comply with the visitor's cookie consent, you need to define the logic which controls the behavior of cookie-setting scripts on your website. Cookiebot exposes a client side object named "Cookiebot" which you can reference in DTM to check which types of cookies the visitor accepts (the visitor's consent state). For a full overview of the Cookiebot API, please visit https://www.cookiebot.com/goto/developer.
For integrated tools in DTM like Adobe Analytics and Google Analytics, you need only to check the option "Enable EU compliance" under "General" > "Tracker configuration" in the tool’s configuration. For all other script tags you must add an event condition as described below:
Example: Google AdSense/DoubleClick
In this example, we will show you how to implement and control the Google AdSense tag with Cookiebot in DTM, so that AdSense will only fire if the visitor has accepted marketing cookies. Since DTM loads asynchronously, we will use the async version of the AdSense script.
In DTM, click the sub-tab “Event Based Rules” and “Create New Rule”.
Name the rule, e.g. “Adsense” and enter the following values in the “Conditions” section:
Event → Event Type: “dataelementchanged”
Event → Select Data Element: “Cookie Consent Marketing”
Rule Conditions → Add Criteria “Data – Data Element Value”:
Data Element = “Cookie Consent Marketing”, Value = “true”
Save the rule. When you approve and publish this rule, Adsense will only trigger for website visitors who has opted in for marketing cookies.
First you need to create a new rule with the URL path to the page in question, e.g. "/privacypolicy".
Under “Page Load Rules”, click “Create New Rule” and configure the rule with the following values:
Name: “Cookie Declaration”
Conditions → Trigger rule at: “Onload”
Conditions → Add Criteria “URL – Path”: “Include” – “/privacypolicy” (change to your own URL path)
Remember to replace the class name "body-content" with the class name of the empty HTML placeholder element on your website. Also, replace the identifier value "00000000-0000-0000-0000-000000000000" in the code with your own Doman Group ID from the "Your scripts" tab in the Cookiebot Manager.
This is what your event configuration should look like (except url path):
Finally, approve and publish to push the changes to your site. The cookie declaration will now display in the page element with the class “body-content” at the url path you have defined above.
Last updated: 2 May 2018