News

28/10/2021

Come implementare Google Consent Mode con Cookiebot

Introduzione

In seguito alle novità introdotte sulla tutela della privacy, sono molti i cambiamenti che stanno avvenendo nel web e che obbligano proprietari e gestori di siti web ad aggiornare le proprie piattaforme alle nuove normative vigenti.

In questo periodo, ottobre 2021, le informazioni tecniche per allineare i propri siti web non sono ancora così chiare. Abbiamo pensato di fornire alcuni suggerimenti pratici per implementare la Google Consent Mode con Cookiebot in pochi e semplici passaggi.

Abbiamo realizzato di una serie di guide specifiche:

All'interno sono presenti alcuni link utili alle guide rilasciate dagli stessi Google e Cookiebot.

Per sapere il significato delle varie impostazioni della Google Consent Mode, consigliamo di leggere la documentazione alle impostazioni di consenso di Google Tag Manager. Sono disponibili informazioni utili anche nella pagina di supporto Google per la modalità di consenso.

Se invece si vogliono conoscere le funzioni (callable methods) o le variabili usate da Cookiebot, è possibile consultare la documentazione tecnica di Cookiebot per gli sviluppatori. Ad esempio, nella nostra guida parleremo del metodo “CookiebotOnConsentReady”.

N.B. Utilizzando la Consent Mode come indicato da Cookiebot può capitare di inviare per errore due volte gli stessi dati: una volta tramite il codice Javascript, e una volta con gli eventi di GTM. Questo potrebbe causare dei problemi sia tecnici che di privacy. Alcuni utenti infatti hanno segnalato, sul sito di Cookiebot, di essersi trovati “doppi hit” e quindi numeri completamente falsati.

In poche parole, usando Google Tag Manager e il modello Cookiebot CMP, il sito web è già a posto per la Consent Mode.

Consent Mode senza Google Tag Manager

Se non si utilizza Google Tag Manager, si può sfruttare la Google Consent Mode con Cookiebot e consigliamo di seguire la guida Cookiebot e Google Consent Mode. Tralasciando quindi quello che riguarda Google Tag Manager, interessa solo la seguente porzione di codice:

<script data-cookieconsent="ignore">
window.dataLayer = window.dataLayer || [];

function gtag() {
    dataLayer.push(arguments);
}
gtag("consent", "default", {
    ad_storage: "denied",
    analytics_storage: "denied",
    functionality_storage: "denied",
    personalization_storage: "denied",
    security_storage: "granted",
    wait_for_update: 2000
});
gtag("set", "ads_data_redaction", true);
</script>

Tale porzione di codice va inserita, come è facile immaginare, nel tag HEAD.

Consent Mode con Google Tag Manager e modello Cookiebot CMP

Consigliamo di iniziare seguendo la guida di Cookiebot su come impostare correttamente Google Tag Manager.

N.B. Cookiebot ha aggiornato la sua guida di recente, precisamente ad ottobre 2021. Se fosse già stato installato Cookiebot in passato con Google Tag Manager e non fosse visibile la voce “Default Consent State” come indicato, probabilmente è necessario aggiornare il modello Cookiebot CMP.

Default Consent State, vecchio (a sinistra) e nuovo (a destra)

Il Default Consent State va impostato come nello screenshot qui sotto:

Default Consent State - Impostazioni iniziali

Questo serve per impostare una situazione iniziale (default) che quindi nega tutti i consensi, almeno fino a quando l’utente non li modifica tramite il banner di consenso di Cookiebot. Altrimenti, si corre il rischio di comunicare a Google che può raccogliere dati prima che l’utente abbia prestato il suo consenso, e questo va contro il GDPR.

Consent Mode con Google Tag Manager senza modello Cookiebot CMP

Se non si usa il modello Cookiebot CMP, si dovrà aggiungere questa porzione di codice all'interno del tag HEAD:

<script data-cookieconsent="ignore">
window.dataLayer = window.dataLayer || [];

function gtag() {
    dataLayer.push(arguments);
}
gtag("consent", "default", {
    ad_storage: "denied",
    analytics_storage: "denied",
    functionality_storage: "denied",
    personalization_storage: "denied",
    security_storage: "granted",
    wait_for_update: 2000
});
gtag("set", "ads_data_redaction", true);
</script>

Successivamente, è necessario impostare i consensi aggiuntivi facendo attenzione a eventuali attivatori e tag già utilizzati su Google Tag Manager.

Di default, Cookiebot esegue già un aggiornamento dei consensi, chiamando la funzione gtag nello script uc.js, come possiamo vedere nel debug riportato più sotto.

Se verifichiamo però che qualcosa non funziona nell'aggiornamento dei consensi, possiamo aggiornare manualmente i consensi dell'utente dopo che Cookiebot è stato caricato, comunicando alle API di Tag Manager i nuovi consensi.

Esempio di aggiornamento statico del consenso:

<script type="text/javascript" data-cookieconsent="ignore">
gtag('consent', 'update', {
  'ad_storage': 'granted'
});
</script>

Oppure, aggiornando il consenso in modo dinamico tramite Cookiebot:

<script type="text/javascript" data-cookieconsent="ignore">
window.addEventListener('CookiebotOnConsentReady', function (e) {
    gtag('consent', 'update', {
   'ad_storage': Cookiebot.consent.marketing
});
}, false);
</script>

In questo modo, potrai dire alla Consent Mode quali sono i consensi che il tuo sito web ha ottenuto da parte dell'utente.

Per qualsiasi dubbio su questa operazione, consigliamo di leggere la guida Google su come configurare i consensi e la documentazione tecnica di Cookiebot.

Consensi aggiuntivi

Se si utilizza Facebook Pixel oppure altri tag/attivatori tramite Google Tag Manager, sarà necessario configurare dei consensi aggiuntivi.

Ad esempio, Facebook Pixel si deve attivare con Google Tag Manager solo se viene dato il consenso “ad_storage”.

Esempio di uso di Facebook Pixel su GTM

Esempio di configurazione

Se non si usa Google Tag Manager, è possibile vedere degli esempi leggendo l’articolo Cookiebot e Consent Mode.

Altrimenti, se si usa GTM, per vedere un esempio suggeriamo di fare riferimento alla guida di implementazione Google Tag Manager di Cookiebot.

Codice, ads_data_redaction e debug

Un breve approfondimento sul codice da utilizzare che è possibile trovare su Cookiebot o in altri siti. Questa è la porzione da analizzare:

<script data-cookieconsent="ignore">
window.dataLayer = window.dataLayer || [];

function gtag() {
    dataLayer.push(arguments);
}
gtag("consent", "default", {
    ad_storage: "denied",
    analytics_storage: "denied",
    functionality_storage: "denied",
    personalization_storage: "denied",
    security_storage: "granted",
    wait_for_update: 2000
});
// gtag("set", "ads_data_redaction", true);
</script>

Questo è il codice che viene indicato da Cookiebot nella sua stessa guida Cookiebot e Consent Mode, però abbiamo commentato l’ultima riga che setta ads_data_redaction a true, perché questo viene già fatto dallo script di Cookiebot, che è un file Javascript chiamato “uc.js”, come vediamo dallo screenshot qui sotto.

uc.js imposta già “ads_data_redaction” a “true”

Il resto sono i vari tipi di consenso che Cookiebot invia a GTM. La tabella con i dettagli è disponibile nella guida Cookiebot implementazione di Google Tag Manager.

Per fare il debug visibile nello screenshot, abbiamo usato il seguente codice Javascript, basandoci sul metodo CookiebotOnConsentReady:

<script type="text/javascript">
window.addEventListener('CookiebotOnConsentReady', function (e) {
    console.log(Cookiebot.consent);
    console.log(window.dataLayer);
}, false);
</script>

Questo codice si esegue dopo che Cookiebot ha preparato i consensi dell’utente (vedi lista di metodi di Cookiebot). Il primo console.log permette di verificare come sono impostati i consensi di Cookiebot, mentre il secondo serve per capire come è settato Google Tag Manager in quel momento.

Verificare che la Consent Mode sia configurata correttamente

Consigliamo di leggere sul sito di Cookiebot come verificare che la Consent Mode sia impostata nel modo corretto.

Il debug aiuterà a capire se il tutto sta funzionando dal punto di vista tecnico.

È poi necessario verificare che stia funzionando il tracciamento che ci interessa (Facebook Pixel, Google Tag Manager, Hotjar, Linkedin, ecc.) e soprattutto che vengano impostati i cookie corretti in base alle preferenze dell’utente.

Conclusione

Ad ottobre 2021, qualche mese dopo gli aggiornamenti in merito alla normativa sulla privacy, non è ancora molto chiaro se la Consent Mode serva nel caso si stia già utilizzando Cookiebot in modalità manuale. Infatti, se i vari javascript sono già stati marcati come “statistiche”, “marketing”, ecc. non dovrebbe esserci bisogno della Consent Mode. Nel caso fosse già stato installato in passato Cookiebot con GTM + Modello CMP e in modalità manuale può succedere di incontrare qualche difficoltà nella corretta strada da seguire per l'aggiornamento dei consensi, anche perché il Modello CMP era stato modificato.

Ad ogni modo, lo scopo della Google Consent Mode è quello di orientare il proprio sito a un modello privacy-first, quindi più rispettoso della riservatezza degli utenti e meno invasivo.

L’integrazione con Cookiebot può essere utile per evitare di tracciare utenti che scelgono di non essere tracciati rifiutando determinati cookie.

Infine, dovrebbe servire per ottenere dati più affidabili e realistici, senza necessità di invadere l’utente con cookie “forzati” contro la sua volontà.

Nel mese di ottobre 2021 l'implementazione di Google Consent Mode con Cookieot è un tema relativamente nuovo pertanto, aggiorneremo questa pagina con le prossime novità tecniche che verranno introdotte.


Nel frattempo siamo disponibili a fornirvi suggerimenti utili per implementare la Google Consent Mode con Cookiebot.