Cookiebot integration

If you use Cookiebot as your consent manager, you can set up Piwik PRO to collect data based on the visitor’s consent. The consent types used by Cookiebot differ from those used by Piwik PRO, so you’ll need to map them and run a JavaScript code on each page of your website. In this article, we’ll show you how to do it.

Set up Piwik PRO

In the first step, you’ll need to set up Consent Manager in Piwik PRO so that it doesn’t display our consent form but still uses the consent management mechanism in Tag Manager. In the next steps, you’ll integrate Cookiebot into that mechanism.

To set up Consent Manager in Piwik PRO for your integration, follow these steps:

1. Log in to Piwik PRO.
2. Go to Menu > Administration.
3. Navigate to Sites & apps.
4. On the left, pick the site or app you want to set up.
5. Navigate to Privacy.
6. Turn on Ask visitors for consent.
   

   

7. In When visitors don’t consent, you can pick one option:
   • Collect data using a 30-minute cookie: You’ll use a 30-minute cookie to collect session data. You won’t recognize new and returning visitors. You’ll see data about the visitor’s country. Visitors’ IP addresses will be fully masked.
   • Collect data without using cookies (recommended): You won’t create or store any cookies on visitors’ browsers. Nothing will be stored on visitors` devices. You won’t recognize new and returning visitors. You’ll see data about the visitor’s country. Visitors’ IP addresses will be fully masked.

   Note: Some triggers in Tag Manager create cookies to work correctly. If you use one of the following conditions in triggers, we’ll set a cookie:

   • Event condition > Traffic source
   • Event condition > Returning visitor
   • Event condition > Campaign
   • Event condition > External referrer 
   • Multiplicity > Fire tag once per session
   • Multiplicity > Fire tag multiple times per session, excluding first
   • Multiplicity > Fire tag once per page view

   Make sure that tags with those triggers are set with the right consent type.
   We also set essential cookies that store a visitor’s consent decision. More about cookies

   • Don’t collect data: The tracking code won’t be fired for visitors.

   Note: We observed on our sites that only 25 to 75 percent of people give full consent. So you may want to collect non-sensitive data from visitors who don’t agree to data collection and usage.

   

8. Turn on Use a custom consent form.
   

   

9.  Click Save.
10. All done! Now Piwik PRO is ready for the integration with Cookiebot.

Map consent types between Cookiebot and Piwik PRO

In the next step, you’ll need to map at least one consent type from Cookiebot to one or more consent types in Piwik PRO. But before you do this, it’s important to understand the differences in consent types between the two products.

Consent types in Piwik PRO

In Piwik PRO, consent types are used to determine whether a specific tag (such as a tracking or marketing tag) should be fired for a visitor. If a tag requires the Analytics consent, it will only be activated for visitors who have given their consent for Analytics. This allows you to control which tags are activated for which visitors, based on their consent preferences.

Here’s a list of consent types in Piwik PRO:

Consent types in Cookiebot

Here’s a list of consent types in Cookiebot:

An example of mapped consent types

Once you know what the consent types in each product are, you can decide to map them. Here’s an example that we’ll use:

Add a tag with the JS code

Now you need to prepare a JS code that will translate consents from Cookiebot to the ones in Piwik PRO and add it to your site using a tag.

To add a tag with the JS code, follow these steps:

1. Here’s the code that you’ll use:

   <script>
     (function(e){function n(){}window.addEventListener("CookiebotOnDialogDisplay",function(e){ppms.cm.api("trackMainFormView",n,n),window.addEventListener("CookiebotOnDecline",function(e){ppms.cm.api("trackRejectAllClick")},!1),document.getElementById("CybotCookiebotDialogBodyLevelButtonLevelOptinAllowallSelection").addEventListener("click",function(e){ppms.cm.api("trackSaveChoicesClick")},!1),document.getElementById("CybotCookiebotDialogBodyLevelButtonLevelOptinAllowAll").addEventListener("click",function(e){ppms.cm.api("trackAgreeToAllClick")},!1)},!1),ppms.cm.api("getNewComplianceTypes",function(e){var t;t=e,t.length>0?(window.PPCM_initial_compliance_settings=!0,ppms.cm.api("setInitialComplianceSettings",{consents:t},n,n)):window.PPCM_initial_compliance_settings=!1},n),window.addEventListener("CookiebotOnConsentReady",function(t){var i,o,c,a,s,l={consents:{}},r=["statistics","preferences","marketing"],g=["analytics","ab_testing_and_personalization","conversion_tracking","marketing_automation","remarketing","user_feedback","custom_consent"],C={};for(i=0;i<r.length;i+=1)if(c=r[i],e.hasOwnProperty(c))for(o=0,s=window.Cookiebot.consent[c]?1:0;o<e[c].length;o+=1)a=e[c][o],g.indexOf(a)>=0&&(C[a]=c,l.consents[a]={status:s});window.PPCM_consents_changed=0,ppms.cm.api("getComplianceSettings",function(e){if(void 0===e.consents||window.PPCM_initial_compliance_settings)window.PPCM_consents_changed=1;else{var n,t,i,o;for(n=0;n<g.length;n+=1)i=C[t=g[n]],o=window.Cookiebot.consent[i]?1:0,C.hasOwnProperty(t)&&(void 0===e.consents[t]||e.consents[t].status!==o)&&(window.PPCM_consents_changed=1)}},n),1===window.PPCM_consents_changed&&ppms.cm.api("setComplianceSettings",l,n,n)})})
   (
   consentMap
   )
   </script>

   Parameters

   consentMap (object, required)
   An object that accepts consent IDs from Cookiebot as keys and a list of consent IDs from Piwik PRO as values. For values, you need to use the API names for consent types, not the names from the UI. Example: 'analytics'.

   Example:

   (
       {
           statistics: ['analytics'],
           preferences: ['ab_testing_and_personalization'],
           marketing: ['marketing_automation', 'remarketing', 'conversion_tracking']
       },
   );

2. Log in to Piwik PRO.
3. Go to Menu > Tag Manager.
4. Navigate to Tags.
5. Click Add a tag.
6. Name the tag. Example: Cookiebot consent mapping.
7. Pick the following tag type: Custom code (async).
8. Click Next.
9. In Tag code, paste the code from step 1.
   

   

10. In Consent type, set the following type: No consent is required.
11. Click Choose existing trigger.
12. Pick the following trigger: All page views.
13. Click Add a tag.
14. Test your tag in debug mode.
15. When you’re happy how the tag works, click Publish.
16. All done! Now tags in Piwik PRO will fire when the consent assigned to them is given on your Cookiebot consent form. If we look at our example, the integration will work like this:
    

    A visitor gives consent on your Cookiebot consent form:	In Piwik PRO, a tag with this consent type will fire:
    Statistics	Analytics
    Preferences	A/B testing and personalization
    Marketing	Conversion tracking or Marketing automation or Remarketing