Data Restart / Cookie lišty – Co vás čeká a nemine

Materiály z prezentace "Cookie lišty – Co vás čeká a nemine", kterou prezentoval Lukáš Čech z agentury Etnetera Activate na konferenci Data Restart, která proběhla 21. 10. 2021 v prostoru Spojka Karlín.

Disclaimer! Zde uvedený návod je zaměřen na technicky zdatné uživatele a neřeší zdaleka všechny aspekty. Pokud si něčím nejste jistí, zeptejte se na lukas.cech@etnetera.cz. Zároveň je jakékoliv řešení vždy vhodné zkonzultovat také s právníkem.

Odkaz na prezentaci

Šablona dokumentace cookies

Na našich projektech využíváme tuto šablonu, kterou si můžete zkopírovat a případně upravit pro potřeby svého konkrétního projektu.

Manuál nasazení jednoduché Consent Lišty

Řešení je postavené na:

Na stránce se spouští (cookies jsou zdokumentovány dle výše uvedené šablony):

Součástí manuálu je i tato samotná stránka, kde je popsané řešení nasazeno.

Pokud si chcete se stránkou hrát a koukat, jaké cookies kdy zakládá, doporučuji k tomu použít čistý profil prohlížeče.

Předpoklady tohoto řešení

Jde o jednoduchou variantu, kterou jsem na konferenci nazval "vylitím vaničky i s dítětem". Znamená to, že se nehodí pro každého. Reší všechny cookies najednou a může to vést k nižšímu procentu získaných souhlasů oproti stavu, kdy byste pečlivěji rozdělili cookies do kategorií a vysvětlili jejich přínos. Některé právní výklady se navíc kloní k tomu, že různé účely zpracování nelze slučovat (zde statistika návštěvnosti a retargeting). Může vám stačit, máte-li relativně jednoduchý, ideálně jednojazyčný web a využíváte na něm jen několik hodně rozšířených služeb s obdobným účelem zpracování. Zároveň je manuál zaměřený na technicky zdatné uživatele.

Pokud provozujete větší množství webů či aplikací ve vícejazyčném prostředí a využíváte mnoho různých nástrojů, které pracují s cookies, můžete se mi ozvat na lukas.cech@etnetera.cz a probereme detaily. Nebo můžete začít třeba mými články na blogu Activate.

Nastavení výchozích hodnot Google Consent Mode

Dříve, než na webu dojde ke spuštění příslušných "zbytných" technologií, je třeba nastavit výchozí hodnoty pro Google Consent Mode. To jde udělat synchronně (v kódu webu nebo nějakého inicializačního JavaScript souboru) před vložením Google Tag Manageru, nebo prostřednictvím Custom Template Tagu spuštěného přimo v GTM novým pravidlem "Inicializace souhlasu - všechny stránky".

Ve výchozí situaci by měly být všechny typy souhlasů nastaveny na "deny" - tedy "odmítnuto". Pokud se ale již váš návštěvník vyjádřil a některé souhlasy udělil, je možné Google Consent Mode inicializovat už s příslušnými souhlasy.

V případě této stránky můžete nahlédnout do souboru /js/init-script.js, kde je vidět, že při inicializaci pracuji s cookie cookieconsent_status Osano Consent Manageru a podle hodnot v ní uložených nastavuji výchozí consenty.

gtag('consent', 'default', {
  analytics_storage: 'denied',
  personalization_storage: 'denied',
  ad_storage: 'denied',
  ads_data_redaction: 'true',
  wait_for_update: 500
});

Konfigurace Osano Consent Manageru

Osano Consent Manager má snadnou konfiguraci – zvolíte textaci lišty, tlačítek a barevnou kombinaci a zbývá jen propojit reakci návštěvníka se změnami Google Consent Mode, kde je třeba jen poladit názvosloví (akce je "deny", příslušný stav souhlasu "denied" nebo "allow" a "granted"). Na tyto akce následně může reagovat také Google Tag Manager.

window.cookieconsent.initialise({
  'palette': {
    'popup': {
      'background': 'rgba(220,220,220,.8)',
      'text': '#170c0c',
      'link': '#007bff'
    },
    'button': {
      'background': '#003E80',
      'text': '#fff'
    },
    'highlight': {
      'background': '#003E80',
      'text': '#fff'
    }
  },
  'type': 'opt-in',
  'content': {
    'message': 'Chtěli bychom používat cookies. Můžem?',
    'deny': '❌ Nemůžete',
    'allow': '✅ Ale tak jo',
    'link': 'Cože?',
    'policy': '🍪 Upravit nastavení cookies',
    'href': '/privacy.html',
    'target': '_self'
  },
  onStatusChange: function(action, chosenBefore) {
    var status = action === 'allow' ? 'granted' : 'denied';
    console.log('Status changed to: ' + status);
    // nastav souhlas dle preference
    gtag('consent', 'update', {
      analytics_storage: status,
      personalization_storage: status,
      ad_storage: status,
      ads_data_redaction: action === 'allow' ? 'false' : 'true'
    });
  }
});

Konfigurace Google Tag Manageru

V příslušném kontejneru GTM je vhodné povolit "přehled nastavení souhlasu".

Nastavení GTM kontejneru

U značek Googlu (Analytics, Ads, Conversion Linker) není nutné díky Consent Mode nic dalšího nastavovat. Tagy se zachovají podle toho, jaké souhlasy budou k dispozici.

Všechny značky třetích stran, jejichž tagy tyto nové funkce nepodporují, bude potřeba donastavit tak, aby byly blokovány v případě, že příslušný consent k dispozici není. Zároveň je nutné globální (retargetingové) značky spouštět v momentě, kdy dojde ke změně stavu consentu – v mém případě si při každé změně zavolám vlastní událost consentSettingsUpdated.

Dodatečné nastavení podmínky na souhlas

Následně si zkontrolujte, že všechny značky mají nastavené příslušné podmínky na souhlas.

Přehled značek a jejich souhlasů

Závěrem

Pokud se vám tento výsledek několika-měsíčních zkušeností a několika-hodinového testování a ladění líbí nebo vám tu něco schází, dejte vědět na lukas.cech@etnetera.cz nebo rovnou pošlete něco dobrého na adresu Lukáš Čech – Etnetera Activate a.s., Jankovcova 1037/49, 17000 Praha 7.

Stejně tak se ozvěte, pokud: