Jak wdrożyć zarządzanie zgodami na pliki cookie (Consent Mode v2) za darmo

Czy muszę wdrażać zarządzanie zgodami na pliki cookie?

Jeżeli Twoją stronę internetową odwiedzają użytkownicy z Europejskiego Obszaru Gospodarczego lub Wielkiej Brytanii, musisz uzyskać ich zgodę nie tylko na zbieranie ich danych, ale również na zapisywanie w ich przeglądarkach plików typu cookie. Zgoda dotyczy nie tylko ciasteczek używanych przez Twoją stronę, ale również plików cookie stron trzecich – takich jak np. Google Analytics.

Z czego wynika obowiązek uzyskiwania zgód na pliki cookie?

W 2019 roku Trybunał Sprawiedliwości Unii Europejskiej orzekł, że informacja o stosowaniu plików cookie (opt-out) nie wystarczy i wydawcy muszą uzyskać zgodę użytkownika (opt-in) zanim strona zapisze dane w postaci plików cookie na jego komputerze.

W 2020 roku Europejska Rada Ochrony Danych potwierdziła to stanowisko, wydając stosowne zalecenia. Od tego momentu popularne “belki cookies” zaczęły być zastępowane przez większe pop-upy zawierające więcej przycisków – służących do akceptacji, odrzucenia lub bardziej szczegółowej konfiguracji zgody.

W Polsce, jak dotąd (stan na marzec 2024) nie pojawiły się przepisy wykonawcze wprowadzające bezpośrednio ten obowiązek. Prawo telekomunikacyjne nadal dopuszcza informowanie użytkowników za pomocą belki i pozwala użytkownikom wyrażać zgodę za pomocą konfiguracji ich własnego oprogramowania (przeglądarki). Jednak przepisy unijne mają wyższość nad lokalnym, więc zgodnie z prawem obowiązek uzyskiwania zgody obowiązuje.

22 października 2022 Parlament Europejski i Rada UE wydały rozporządzenie (“Akt o usługach cyfrowych”) nakładający nowe obowiązki na największe platformy internetowe. W konsekwencji, wraz z wejściem życie aktu, 6 marca 2024 roku Google zaczął wymuszać na wydawcach stron internetowych korzystających z ich usług (m.in. Analytics, Maps, reCaptcha, AdSense, AdMob a nawet Fonts) stosowanie Consent Mode. Niespełnienie tego obowiązku ma oznaczać ograniczenie wydawcom dostępu do danych analitycznych niezbędnych do targetowania i personalizacji.

Co to jest Consent Mode v2?

Consent Mode to technologia Google umożliwiająca wydawcom przekazywanie do Google informacji o zgodach na pliki cookie uzyskiwanych od użytkowników końcowych. Strona internetowa pyta użytkownika o zgodę a jego decyzja jest przekazywana do Google, dzięki czemu narzędzia takie jak Analytics, Map czy AdSense nie używają plików cookie bezprawnie.
Zgoda może zostać udzielona na wszystkie kategorie cookies, tylko na wybrane, lub wcale (odmowa).

Consent Mode v2 to najnowsza wersja tego mechanizmu, zapewniająca zgodność z RODO, CCPA i TCF. Wprowadza ona dwie dodatkowe zgody, w stosunku do v1 – na udostępnianie danych użytkownika w celach reklamowych oraz na personalizację reklam.

Wydawcy serwisów internetowych wyświetlających reklamy Google (korzystających z AdSense, AdMob lub AdManager) dodatkowo muszą do obsługi zgód stosować platformy zarządzania zgodami (CMP) z listy dostawców certyfikowanych przez Google.

Jakie są sposoby na wdrożenie zarządzania zgodami na pliki cookie?

Od strony technicznej, istnieje kilka różnych rozwiązań na wdrożenie mechanizmu uzyskiwania zgód na ciasteczka – w zależności od skali i stopnia skomplikowania Twojej strony:

A. Lokalna wtyczka

Jeżeli korzystasz z rozwiązania typu SaaS (np. WIX, Shoper) albo posiadasz stosunkowo prostą stronę opartą na WordPressie, wystarczy, że zainstalujesz i skonfigurujesz odpowiednią wtyczkę. W przypadku WordPressa może to być GDPR Cookie Compliance lub Complianz – GDPR/CCPA Cookie Consent.

B. Consent Management Platform

Użycie dedykowanej platformy do zarządzania zgodami jest rozwiązaniem rekomendowanym, ale wiąże się z kosztami. Niektóre CMP oferują darmowe opcje, ale są one mocno ograniczone. Limitem jest łączna liczba podstron w serwisie lub miesięczna liczba odsłon. W darmowych opcjach nie są też dostępne wszystkie funkcje oferowane przez platformy.

Tak wygląda plan “Free” u trzech popularnych dostawców:

• CookieYes – do 25.000 odsłon miesięcznie; skan maksymalnie 100 podstron; nie zawiera autoblokowania nowo wykrytych ciasteczek, ustawiania własnych kolorów banera
• CookieBot – do 50 podstron; nie zawiera wielojęzyczności, wygasania zgody po czasie dłuższym niż 1 miesiąc, ustawiania własnych kolorów banera
• Cookie-Script – do 20.000 odsłon miesięcznie; skan maksymalnie 10 podstron; nie zawiera ustawiania własnych kolorów banera.

Subskrypcje komercyjne kosztują nie mniej niż $10 miesięcznie za domenę.
Jeżeli posiadasz wiele domen – nawet w ramach jednego serwisu (wersje językowe), to dla każdej z nich musisz wykupić osobną subskrypcję.

C. Piwik PRO

Nasza propozycja (szczegółowo opisana niżej) opiera się na zastosowaniu dwóch funkcji znakomitego pakietu analitycznego Piwik PRO – Consent Managera i Tag Managera. Pozwala wdrożyć zarządzanie zgodami na ciastka (z Consent Mode v2 włącznie) w maksymalnie 10 serwisach, przy nieograniczonej liczbie domen na serwis.

Istnieje ograniczenie 500.000 akcji miesięcznie, ale jeżeli nie będziesz korzystać z Piwik PRO Analytics, jedynymi akcjami, które będą liczone, będą te związane z banerem zgody – wyświetlenia, kliknięcia i podjęte decyzje.

Piwik PRO, jak na tę chwilę, nie znajduje się na liście CMP certyfikowanych przez Google. Ale jeżeli na swojej stronie nie wyświetlasz reklam Google, nie musisz się tym przejmować. W przeciwnym razie – patrz punkt B powyżej.

D. Własne rozwiązanie

Wprawdzie platformy zarządzania zgodami umożliwiają rozmaite integracje (od wtyczek po API), ale operatorzy bardziej skomplikowanych i rozbudowanych serwisów i aplikacji webowych mogą wybrać pełną kontrolę nad zgodami, wdrażając własne oprogramowanie.

Instrukcja wdrożenia zarządzania zgodami na ciasteczka za darmo (Piwik PRO)

Piwik PRO to znakomite narzędzie do analityki internetowej, doskonała alternatywa dla Google Analytics.
Ale wcale nie musisz korzystać z analityki Piwika, żeby za jego pomocą zarządzać zgodami na ciasteczka. Możesz nadal korzystać z Google Analytics.

W niniejszej instrukcji zakładamy, że korzystasz z GA4, ale nie używasz Google Tag Managera. Jeżeli używasz GTM, zajrzyj tutaj.

1. Sprawdź ciasteczka swojej strony

To, jakie pliki cookie Twoja strona wysyła do przeglądarek, możesz sprawdzić za pomocą Narzędzi dla Developerów w swojej przeglądarce.
Uruchom narzędzia (np. za pomocą F12) i przejdź do zakładki “Aplikacja”. Po lewej stronie, w sekcji “Pamięć” znajdź “Pliki” i kliknij adres swojej strony.

Alternatywnie, możesz też użyć Free online Cookie Scannera udostępnionego przez Piwik. To narzędzie przyda Ci się jeszcze później do zweryfikowania Twojej instalacji.

Pamiętaj, żeby sprawdzić nie tylko stronę główną, ale również podstrony różnych typów.

2. Załóż konto w Piwik PRO

Zarejestruj się tutaj, podając swój adres email, URL pierwszej strony, na której planujesz wdrożyć zgody oraz nazwę konta. Na podstawie nazwy konta zostanie dla Ciebie utworzona dedykowana subdomena, pod którą będzie dostępny Twój panel użytkownika – np. mojekonto.piwik.pro.

3. Zainstaluj kod Piwika na swojej stronie

Wybierając w lewym górnym rogu “Menu” > “Administration” wyświetlisz listę skonfigurowanych stron.

Wybierz swoją stronę, a następnie po prawej stronie kliknij “Installation”. Zobaczysz tam różne metody instalacji – w tym “Install manually”, po wybraniu której wyświetli się kod, który musisz wstawić na swojej stronie tuż pod otwierającym tagiem “<body>”.

4. Zmień używany dotychczas kod śledzący Google Analytics

Jeżeli używasz Google Analytics 4, najprawdopodobniej w sekcji “head” Twojej strony znajduje się taki kod:

<script async src="https://www.googletagmanager.com/gtag/js?id=IDENTYFIKATOR"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());
  gtag('config', 'IDENTYFIKATOR');
</script>

Zmień go na następujący, który zawiera domyślny brak zgód na zapisywanie jakichkolwiek ciasteczek:

<script async src="https://www.googletagmanager.com/gtag/js?id=IDENTYFIKATOR"></script">
<script>
window.dataLayer = window.dataLayer || [];
function gtag() { dataLayer.push(arguments); }
gtag('consent', 'default', {
  'ad_user_data': 'denied',
  'ad_personalization': 'denied',
  'ad_storage': 'denied',
  'analytics_storage': 'denied',
  'region': ["AT", "BE", "BG", "HR", "CY", "CZ", "DK", "EE", "FI", "FR", "DE", "GR", "HU", "IS", "IE", "IT", "LV", "LI", "LT", "LU", "MT", "NL", "NO", "PL", "PT", "RO", "SK", "SI", "ES", "SE", "UK", "CH", "BR"],
  'wait_for_update': 1000
});
gtag('js', new Date());
gtag('config', 'IDENTYFIKATOR');
</script>

Alternatywnie, możesz ten kod przenieść do Piwik Tag Managera, ale wtedy musisz pamiętać o ustawieniu kolejności tagów (patrz punkt 10 poniżej).
Zrobisz to w następujący sposób:

“Menu” > “Tag Manager” > “Tags” > “Add a tag”
Tag name: “Google Analytics 4”
Tag type: “Async tag” > “Custom code (async)”
“Next”
w kolejnym kroku:
Tag code: tutaj wklejasz powyższy kod
Consent type: “No consent is required”
Tag triggers: “Choose existing trigger” > “All page Views”
“Add”

5. Utwórz dwa nowe Wyzwalacze

“Menu” > “Tag Manager” > “Triggers” > “Add a trigger”
Trigger name: “Window Loaded”
Trigger type: “Page view”
“Next”

Load this tag right after the browser: “Loaded all page elements (page load)”
“Add”

“Menu” > “Tag Manager” > “Triggers” > “Add a trigger”
Trigger name: “Decision Made”
Trigger type: “Data layer event”
“Next”

Event name: “contains”, “stg.consentDecisionMade”
Event conditions: “On all events”
“Add”

6. Utwórz nowy tag z kodem aktualizującym zgody

“Menu” > “Tag Manager” > “Tags” > “Add a tag”
Tag name: “Consent Update”
Tag type: “Async tag” > “Custom code (async)”
“Next”

w kolejnym kroku:
Tag code:

<script>
    window.gtag = window.gtag || function(){dataLayer.push(arguments)};
    function googleConsentModeMapping(consents) {
        if ({{ Consents }}) {
            var consObj = {};
            Object.keys(consents).forEach(function(consent) {
                consObj[consent] = ({{ Consents }}.current_state[consents[consent]] === 1) ? 'granted' : 'denied';
            });
            gtag('consent', 'update', consObj);
        }
    }
    googleConsentModeMapping({
        "ad_storage": "remarketing",
        "ad_user_data": "remarketing",
        "ad_personalization": "remarketing",
        "analytics_storage": "analytics"
    });
</script>

Consent type: “No consent is required”
Tag triggers: “Choose existing trigger” > “Window Loaded” oraz “Decision Made”
“Add”

7. Zdecyduj, czy będziesz używać Piwik PRO Analytics

Jeżeli chcesz używać analityki Piwik PRO (polecam), nie musisz nic więcej robić.
Pamiętaj tylko, że każde zarejestrowane zdarzenie (wyświetlenie strony, przewinięcie, kliknięcie linku itd.) będzie się liczyć do wspomnianego wyżej limitu akcji darmowego konta (500.000 miesięcznie).

Jeśli nie chcesz korzystać z Piwik PRO Analytics, wykonaj następujące dwie czynności:

Wyłącz tag Piwik PRO:
“Menu” > “Tag Manager” > “Tags” > “Piwik PRO” > “Active” -> “Inactive”

Dodaj nowy tag z pustym kodem, który będzie wywoływał baner zgody na stronie:

“Menu” > “Tag Manager” > “Tags” > “Add a tag”
Tag name: “Analytics Event”
Tag type: “Async tag” > “Custom code (async)”
“Next”
w kolejnym kroku:
Tag code:

<script></script>

Consent type: “Analytics”
Tag triggers: “Choose existing trigger” > “All page Views”
“Add”

8. Skonfiguruj baner uzyskiwania zgód i dopasuj jego wygląd

“Menu” > “Consent Manager” > “Settings”
Tutaj zdefiniujesz m.in. języki, w których baner zgód ma się wyświetlać.
Język banera będzie automatycznie wyświetlany w języku przeglądarki użytkownika. Sugeruję, żeby oprócz polskiego zostawić angielski ustawiony jako domyślny. Będzie on się wyświetlał wszystkim użytkownikom korzystającym z przeglądarek w innych językach niż polski.
Jeżeli wiesz, że z Twojego serwisu internetowego korzystają użytkownicy posługujący się innymi językami, dodaj je również.

“Menu” > “Consent Manager” > “Forms” > “Consent forms”
Skonfigurujesz tutaj układ, kolory i czcionki – oraz wyedytujesz treści i linki (np. do podstrony z Polityką Prywatności).
Oprócz banera zgód sformatujesz tutaj również wygląd belki przypominającej o nieudzielonej zgodzie. Belka ta będzie się wyświetlać, jeżeli użytkownik będzie nadal korzystał ze strony, nie podejmując decyzji o plikach cookie.

Według historii zmian Piwik PRO od wersji 6.0.1 umożliwia ukrycie stopki z logo “Powered by Piwik PRO”.
Mnie jednak nie udało się znaleźć tego ustawienia w panelu i robię to za pomocą następującej linijki dodanej do CSS mojej strony:

#ppms_cm_footer {display:none !important}

9. Użyj kodu umożliwiającego użytkownikom edytowanie zgód

“Menu” > “Consent Manager” > “Forms” > “Privacy policy”
Znajdziesz tutaj kod, który możesz wkleić na swoją stronę – np. pod Polityką Prywatności.
Pozwoli on użytkownikom edytować udzielone zgody oraz ewentualnie tworzyć zgłoszenia związane z prywatnością. Znajdziesz je później w sekcji “Menu” > “Consent Manager” > “Requests from visitors”.

10. Ustaw kolejność tagów (opcjonalnie)

Jeżeli kodu śledzącego GA4 nie wstawiłeś bezpośrednio na stronę, tylko jako tag (patrze punkt 4), ustaw kolejność wykonywania tagów:
“Menu” > “Tag Manager” > “Settings” > “Tag priority”.
Przenieś wszystkie tagi z “Available tags” do “Prioritized tags” i przeciągnij tag “Google Analytics 4” na samą górę.

Nie zapomnij kliknąć “Save”.

11. Opublikuj zmiany w Tag Managerze

Wszystkie wykonane przez Ciebie zmiany w Tag Managerze (wprowadzone Wyzwalacze, Tagi, ustawiona kolejność) są zapisane jako “szkic”.
Żeby zaczęły działać, musisz je opublikować, klikając przycisk “Publish” znajdujący się w prawym górnym rogu Tag Managera
“Menu” > “Tag Manager” -> “Publish”.

12. Zweryfikuj prawidłowe działanie zarządzania zgodami

Podobnie, jak w punkcie 1 – użyj Free Cookie online Scannera lub Narzędzi dla Developerów Twojej przeglądarki, żeby sprawdzić (najlepiej w oknie incognito):

• czy przed udzieleniem zgody oraz po jej odmowie strona nie zapisuje żadnych ciasteczek, poza niezbędnymi (czyli własnymi Consent Managera lub sesyjnymi)
• czy po udzieleniu zgody spodziewane ciasteczka (np. Google Analytics) się pojawiają.

W opisany wyżej sposób możesz wdrożyć zarządzanie plikami cookie również innych stron trzecich – np. Facebooka, Hotjar.

Implementacja podstawowa a zaawansowana

Przy konfigurowaniu tagów kusząca jest ścieżka “na skróty” – utworzenie taga z kodem śledzącym Google Analytics, wyzwalanego w przypadku zgody na ciasteczka analityczne. Jest to tzw. implementacja podstawowa.
O ile z prawnego punktu widzenia jest to rozwiązanie poprawne (Google Analytics nie zapisze żadnych ciastek bez zgody, bo po prostu wcale nie będzie działać), o tyle dane analityczne będą mocno przekłamane.
Jeżeli kod śledzący GA będzie uruchamiany dopiero po uzyskaniu zgody, nie będą zbierane absolutnie żadne dane o wizytach, w których zgoda nie została udzielona.

W instrukcji powyżej zastosowałem implementację zaawansowaną, w ramach której kod śledzący uruchamiany jest od razu, ale domyślnie blokuje zapisywanie plików cookie. Dzięki temu, nawet jeżeli zgoda na użycie ciasteczek nie zostanie udzielona, zanonimizowane sygnały będą wysyłane do Google Analytics. W oparciu o takie sygnały, za pomocą modelowania behawioralnego Google Analytics będzie w stanie szacować bliskie rzeczywistości liczby użytkowników i wizyt.

Źródła: Konfigurowanie trybu uzyskiwania zgody w witrynach (Google for Developers)
Google consent mode v2 integration (Piwik PRO Help Center)
Detailed Guide of The Google Consent Mode v2 Integration For Piwik Pro Customers (Dumb Data)

O Autorze

Robert Koch – doświadczony projektant aplikacji SaaS i konsultant ds. optymalizacji biznesu przez automatyzację. W wolnym czasie zapalony piwowar domowy i serowar.