Come gestire la Consent Mode v2 con Iubenda e Google Tag Manager

Grazie alle Consent Management Platform puoi gestire in modo semplice ed efficace i consensi al tracciamento degli utenti.

Ma se ti dicessi che con le popolari CMP come Iubenda, Cookiebot o OneTrust unite e adeguate alla nuova Consent Mode v2 (CM v2) puoi gestire i consensi degli utenti in modo granulare – ossia, i consensi concessi o negati per singola tipologia di trattamento del dato?

Infatti, come forse saprai tutte le principali CMP hanno già adeguato i propri sistemi di funzionamento alla nuova modalità di gestione consensi rilasciata da Google CM v2.

In altre parole, adeguare la tua Consent Management Platform e passare alla Consent Mode v2 non è facoltativo: è un passo obbligato se vuoi continuare a raccogliere più dati (e di maggior qualità), e a raccogliere le conversioni delle tue campagne Google Ads per lanciare campagne di remarketing efficaci.

In questa guida ti mostro come poter gestire in modo granulare e preciso i consensi degli utenti con la CMP Iubenda utilizzando Google Tag Manager, senza impazzire tra Variabili e Attivatori negativi e soprattutto in modo aggiornato alla nuova modalità di gestione dei consensi CM v2.

In questa guida vedremo:

1. Quali sono le categorie di consenso gestite da Iubenda
2. [Guida] Soluzione 1: implementare la Consent Mode v2 usando il template nativo di Iubenda
   • Step 1: Recupera lo script di configurazione di Iubenda
   • Step 2: Configura il tag del template di Iubenda in Google Tag Manager
   • Step 3: Configura l’Attivatore
   • Step 4: Verifica con il Debug di GTM se la configurazione funziona
3. [Introduzione] Soluzione 2: implementare la Consent Mode v2 tramite HTML personalizzato

Iniziamo!

Quali sono le categorie di Iubenda

Nella sua gestione standard, Iubenda dispone di 5 categorie:

Strettamente necessari (id 1)

Finalità incluse:

• Salvataggio e gestione di backup
• Hosting ed infrastruttura backend
• Gestione di landing page e pagine di invito
• Servizi di piattaforma e hosting
• Protezione dallo SPAM
• Ottimizzazione e distribuzione del traffico
• Monitoraggio dell’infrastruttura
• Gestione dei pagamenti

Interazioni e funzionalità semplici (id 2)

Finalità incluse:

• Contattare l’Utente
• Interazione con le piattaforme di live chat
• Gestione di conferenze web e telefonia online
• Gestione delle richieste di supporto e contatto
• Interazione con le piattaforme di supporto e di feedback
• Gestione dei tag
• Registrazione ed autenticazione

Esperienza migliorata (id 3).

Finalità incluse:

• Commento dei contenuti
• Interazione con piattaforme di raccolta dati e altre terze parti
• Visualizzazione di contenuti da piattaforme esterne
• Interazione con social network e piattaforme esterne
• Interazione con le piattaforme per sondaggi online
• Gestione dei feed RSS
• Funzionalità sociali

Misurazione (id 4).

Finalità incluse:

• Statistica
• Beta testing
• Test di performance di contenuti e funzionalità (A/B testing)
• Heat mapping e registrazione sessioni
• Gestione della raccolta dati e dei sondaggi online

Targeting e pubblicità (id 5).

Finalità incluse:

• Pubblicità
• Infrastruttura al servizio pubblicitario
• Affiliazione commerciale
• Gestione contatti e invio di messaggi
• Remarketing e behavioral targeting

Oh, che bravi hanno proprio fatto un elenco chiaro e a prova di male interpretazioni. Quindi nel banner apparirà una cosa simile:

 

Ora che ci è tutto più chiaro iniziamo l’installazione con Google Tag Manager

 

Implementare la Consent Mode v2 con il template nativo di Iubenda

Per semplificarti la vita, Iubenda ha creato un template pronto all’uso grazie al quale puoi implementare la Consent Mode v2 senza impazzire con gli Attivatori, e senza sporcarsi troppo le mani con il codice.

Per configurarlo correttamente segui questi step.

 

Step 1 – Recupera lo script di configurazione di Iubenda

Ti basta entrare nel tuo profilo Iubenda e generare lo script attraverso la voce “Cookie Solution“, fare le impostazioni del banner e scrollare più in basso.

Dovresti trovare una text area dove poter copiare il codice proprio come l’immagine qui sotto:

 

 

Nel dettaglio il codice sarà una cosa simile a questa

<script type="text/javascript">
var _iub = _iub || [];
_iub.csConfiguration = {
      "consentOnContinuedBrowsing":false,
      "whitelabel":false,
      "lang":"it",
      "siteId":XXXXXXXX,
      "countryDetection":true,
      "perPurposeConsent":true,
      "cookiePolicyId":YYYYYYYYY,
      "cookiePolicyUrl":"demo.tagmanageitalia.it/esempio/", 
      "banner":{ 
             "acceptButtonDisplay":true,
             "customizeButtonDisplay":true,
             "position":"float-top-center",
             "rejectButtonDisplay":true 
             }
      };
</script>
<script type="text/javascript" src="//cdn.iubenda.com/cs/iubenda_cs.js" charset="UTF-8" async></script>

Ovviamente i parametri in rosso sono dinamici e variano a seconda di come hai configurato la cookie solution su Iubenda e il sito di destinazione (nel mio caso demo.tagmanageritalia.it). Nel mio caso il codice di cookiePolicyId è 20508754 (te lo dico perché lo rivedrai dopo) negli screenshot.

Potresti inoltre avere dei parametri in aggiunta o averne meno. Insomma tutto dipende da quello che configuri.

Ecco un altro esempio:

<script type="text/javascript">
var _iub = _iub || [];
_iub.csConfiguration = {
     "lang": "it",
     "siteId": XXXXXX, 
     "cookiePolicyId": YYYYYY,
     "banner": {
               "position": "float-top-center",
               "acceptButtonDisplay": true,
               "customizeButtonDisplay": true
               },
     };
</script>
<script type="text/javascript" src="//cdn.iubenda.com/cs/iubenda_cs.js" charset="UTF-8" async></script>

Come vedi i valori in rosso rimangono 🙂

 

Step 2: Configura il tag del template di Iubenda in Google Tag Manager

• entra nel tuo contenitore Google Tag Manager
• clicca sulla voce Tags dal menu a sinistra
• clicca su New > Tag Configuration > Discover more tag types in the Community Template Gallery
• clicca sull’icona a lente d’ingrandimento per cercare e poi selezionare il template di GTM “Iubenda Privacy Controls and Cookie Solution”
• clicca su Add to workspace

 

 

Perfetto, hai appena importato il template di Iubenda per la configurazione della Consent Mode v2.

Come vedi, da qui puoi impostare facilmente il valore di default delle varie categorie di consenso degli utenti (su Denied o su Granted).

Nel menu a tendina How to embed CS, seleziona Automatically via GTM template.

Nel riquadro subito sotto, incolla il codice generato da Iubenda, come ti ho spiegato nello Step 1 di questa guida.

NB: aggiungi manualmente questa parte di codice , indispensabile per gestire la Consent Mode v2 direttamente dal template (esattamente così come è scritta): “googleConsentMode”: “template”.

Lascia tutte le altre opzioni invariate.

Se hai fatto tutto correttamente, il risultato dovrebbe essere qualcosa del genere:

 

 

(Ricordati di inserire i tuoi SiteId e cookiePolicyId, come ti ho spiegato nello Step 1 di questa guida).

Non salvare ancora la configurazione del Tag. Prima devi configurare l’Attivatore.

 

Step 3: Configura l’Attivatore

Per configurare l’Attivatore fai così:

• sempre all’interno della configurazione del tag, scorri in basso e clicca sulla sezione Triggering
• clicca sul Trigger Consent Inizialization – All Pages (se non lo trovi dall’elenco, ti basta cliccare sull’icona “+” e selezionarlo dalla finestra che ti si aprirà)
• Clicca su Save.

Fatto, hai configurato correttamente il tag del template di Iubenda per la CM v2.

NB: ricordati di gestire i tipi di consenso necessari per l’attivazione dei vari Tag nella sezione “Consent Settings” (come ti spiego nella guida sulla Consent Mode v2 linkata all’inizio di questa guida).

Se hai fatto a regola d’arte tutto quello che ti ho spiegato, non ti resta che verificare che tutto funzioni correttamente.

 

Step 4: Verifica la configurazione con il Debug di Google Tag Manager

Per verificare che la configurazione del template Iubenda per la Consent Mode v2 funzioni correttamente:

• clicca sul pulsante Preview nella schermata principale del tuo GTM per entrare nella modalità Anteprima di Google Tag Manager
• clicca sulla tab Consent
• dovresti visualizzare lo stato di consenso di default (che hai impostato nel template di Iubenda) per ognuno dei parametri della Consent Mode v2.

 

 

Ipotizzando di aver impostato gli stati di default tutti su Denied, nessun Tag si attiverà senza aver dato il consenso esplicito attraverso il cookie banner di Iubenda.

Se invece accetti, cliccando su Consent in modalità Anteprima nel tuo GTM, visualizzerai lo stato di Update per ogni singola categoria di consenso.

I Tag si attiveranno o meno a seconda di come li hai gestiti singolarmente in “Consent Settings” (se hai dei dubbi, ti ricordo ancora una volta di fare riferimento alla guida sulla Consent Mode v2 che ti ho linkato all’inizio di questa guida).

Se è tutto a posto, clicca sul pulsante blu Submit per pubblicare la configurazione.

Fantastico!

Con questa configurazione potrai gestire correttamente la Consent Mode v2 tramite il template di Iubenda in GTM.

 

[Introduzione] Soluzione 2: implementare la Consent Mode v2 tramite HTML personalizzato

Come per tutte le cose semplici, ci sono però dei limiti da considerare.

Il limite principale di questa configurazione è che non gestisce le callback.

Partiamo con la spiegazione difficile: le callback sono delle funzioni molto usate nella programmazione, ad esempio per gestire operazioni asincrone, permettendo a un programma di continuare l’esecuzione di altre attività mentre attende che un certo processo venga completato.

Nel contesto della gestione dei consensi granulari aiutano a garantire che determinate azioni vengano eseguite solo dopo che l’utente ha espresso il proprio consenso, ad esempio come il caricamento di script di tracciamento o la configurazione di cookie.

In pratica, permettono al tuo codice di dire: “Ok, vai avanti con le tue operazioni, e quando hai finito, chiama questa funzione“.

In altre parole, immagina di dover inviare una lettera molto importante (la tua operazione asincrona), ma non puoi aspettare vicino alla cassetta della posta per vedere quando viene ritirata.

Così, chiedi a un amico fidato (la tua callback) di tenere d’occhio la cassetta e di dirti quando la lettera è stata consegnata.

Mentre il tuo amico si occupa di questo, tu vai avanti con le tue attività, sapendo che verrai informato non appena l’operazione sarà completata.

La callback, quindi, è come quel tuo amico fidato che si fa carico di avvisarti, permettendoti di procedere con altre cose senza preoccupazioni.

Bene, nel caso specifico della gestione dei consensi degli utenti, le callback danno la possibilità di usare altri script una volta che un utente ha fatto una specifica scelta di consenso.

Ad esempio, nel momento in cui un utente presta il consenso, una callback può dire a Google Tag Manager: “hey, ora puoi sbloccare l’evento impostato per l’attivazione di GA4”.

Per ovviare al problema della mancata gestione delle callback con il template Consent Mode v2 di Iubenda, la soluzione che ti consiglio è usare un Tag HTML personalizzato in combinazione con il template Consent Mode (Google tags) di Simo Ahava.

 

 

Lo trovi nella galleria dei template di GTM (dove hai importato quello di Iubenda), e serve a impostare il valore di Default e di Update dei consensi indipendentemente dalla CMP che stai usando.

Approfondire ulteriormente il funzionamento di questo template va oltre lo scopo e lo spazio di questa guida, ma se vuoi andare fino in fondo e stai cercando da tempo un corso completo, semplice e pratico per essere al 100% autonomo nel configurare la Consent Mode v2 tramite Iubenda e Google Tag Manager…

Allora questo videocorso fa al caso tuo 😊

Cosa ne pensi? Ti è stata utile questa guida? Scrivimelo nei commenti!

Buon Tag 😉

Link utili:

• Guida ufficiale di Iubenda con Google Tag Manager