Wdrożenie CookieOfficer kodem w sekcji head

Bezpośrednie wdrożenie skryptu narzędzia CookieOfficer w kodzie strony zapewnia pełne oraz automatyczne blokowanie wszystkich plików cookies i trackerów, zanim zostaną załadowane na stronie. Dzięki temu sposobowi masz 100% kontrolę nad tym, gdzie dokładnie zostanie on umieszczony.

Skrypt należy umieścić na początku sekcji <head>. W przypadku większości systemów CMS (Wordpress, Webflow itp.) miejsce, w którym można umieścić nasz kod działa na tej samej zasadzie. Poniżej znajdziesz szczegółową instrukcję: skąd pobrać kod, gdzie go umieścić, czego nie powinno się w nim nie zmieniać i jak zweryfikować skuteczność wdrożenia.

Gdzie znaleźć kod CookieOfficer?

1. Wybierz swój projekt i przejdź na stronę Instalacja.
2. W sekcji „Sposób wdrożenia” wybierz opcję „Kod na stronie”.
3. W karcie „Wklej kod na początku <head>” znajdź blok „Skrypt CookieOfficer” i kliknij „Kopiuj”. Kod zawiera już identyfikator Twojego projektu.

Kod wygląda następująco

<!-- CookieOfficer -->
<script async src="https://cdn.cookieofficer.com/s/co-XXXXXXXXXXXXXXXXXXXX.js" data-co-id="co-XXXXXXXXXXXXXXXXXXXX"></script>

Gdzie wdrożyć kod CookieOfficer?

Miejsce i kolejność wdrożenia kodu CookieOfficer ma znaczenie. Jest to zależne od tego, czy korzystasz z integracji Google Consent Mode.

Bez integracji z Google Consent Mode. Umieść nasz skrypt jako pierwszy w sekcji <head>, przed Google Tag Managerem, Google Analytics, czatem i innymi narzędziami śledzącymi.

Kolejność umieszczenia skryptów:

1. Kod CookieOfficer
2. Pozostałe narzędzia

Z włączoną integracją Google Consent Mode. Pierwszy w sekcji <head> powinien być blok domyślnej zgody „Google Consent Mode (default)”, a nasz skrypt umieść zaraz za nim.

Kolejność umieszczenia skryptów:

1. Kod Google Consent Mode (default)
2. Kod CookieOfficer
3. Pozostałe narzędzia

Czego nie powinieneś zmieniać w kodzie?

1. Nie usuwaj atrybutu async i nie zamieniaj go na defer. Jest obowiązkowy. Bez niego jakakolwiek awaria zatrzymałaby ładowanie Twojej strony.
2. Nie usuwaj atrybutu data-co-id. Identyfikator musi być identyczny jak ten w adresie skryptu. Jeśli się różnią, baner nie uruchomi się wcale, a w konsoli przeglądarki pojawi się komunikat o niezgodnym kodzie instalacyjnym. Chroni to przed wyświetleniem cudzego banera i cudzej deklaracji cookies.
3. Nie zmieniaj adresu skryptu. Zawiera on identyfikator projektu, po którym rozpoznajemy, którą konfigurację należy wysłać.

Jak wdrożyć kod przy restrykcyjnym CSP?

Jeśli Twoja strona korzysta z polityki bezpieczeństwa treści (Content Security Policy) z atrybutem nonce lub dyrektywą strict-dynamic, dodaj własny nonce do naszego znacznika skryptu. Przeniesiemy go na wszystkie elementy, które dodajemy do strony: odblokowane skrypty, biblioteki dostawców i style banera.

Jak sprawdzić wdrożenie?

Na stronie Instalacja uruchom test. Gdy wdrożenie się powiedzie, zobaczysz komunikat „Baner CookieOfficer działa na” wraz z nazwą domeny. W przeciwnym razie panel poprosi o sprawdzenie, czy kod trafił do sekcji <head>, i o odświeżenie strony.

Test potwierdza wyłącznie to, że baner działa na domenie. Blokowanie plików cookies, zweryfikujesz skanem serwisu: po jego zakończeniu wejdź na stronę Cookies i sprawdź, czy nad listą nie ma komunikatu o trackerach działających po odrzuceniu zgody przez użytkownika.

Częste błędy, których warto unikać

1. Nie pozwól, aby wtyczki optymalizujące serwis miały wpływ na nasz skrypt. WP Rocket, LiteSpeed Cache czy Autoptimize mogą opóźnić jego wywoływanie, co będzie miało wpływ na automatyczne blokowanie plików cookies. Jeśli korzystasz z takich wtyczek to dodaj skrypty zawierające cookieofficer do wyjątków.
2. Nie pozostawiaj innych skryptów przed naszym kodem. W WordPressie dotyczy to skryptów wpisanych bezpośrednio w pliku header.php, przed wp_head(). Przenieś je poniżej wp_head() lub oznacz atrybutem data-co-cat.
3. Nie wdrażaj banera dwiema metodami jednocześnie. Druga kopia kodu wyłączy się sama, ale zostaniesz z dwoma miejscami do aktualizacji.
4. Nie kopiuj kodu z innego projektu. Baner się nie uruchomi, a jedyną informację o przyczynie znajdziesz w konsoli przeglądarki.
5. Nie wdrażaj kodu na stronie bez certyfikatu SSL. Przeglądarka zablokuje skrypt pobierany z naszego adresu.