Implementacja ConsentMode v2 - SEIGI Dokumentacja

Powiązany moduł: Darmowy moduł Cookies 2022 dla PrestaShop i thirty bees

Jak skonfigurować ConsentMode v2

Nasz moduł Cookie współpracuje zarówno z naszym modułem SEIGI TagManager, jak i modułami od innych producentów. Nie wymagamy od użytkowników korzystania wyłącznie z naszego modułu GA4, choć jest to zalecane.

W chwili obecnej mamy 2 scenariusze implementacji

SEIGI Tag manager
- Instalacja modułu SEIGI Tag Manager
- Konfiguracja naszego modułu
- Gotowe
Moduły innych firm lub własny kod
- Instalacja modułu innej firmy lub ręczna implementacja GTM/GA4 w kodzie
- Ustawienie modułu cookie, aby działał z modułami innych firm (domyślnie ustawiony jest na SEIGI Tag Manager)
- Upewnienie się, że dataLayer budowany jest zgodnie z wymaganiami google (kolejność zdarzeń - więcej na ten temat w dalszej części dokuemnntacji)

Jak sparwdzić, czy ConsentMode v2 jest poprawnie zaimplementowany

Ważna informacja. Jeśli Goole Ads / Google Analytics / Google Tag Manager za pomocą naszego modułu SEIGI Tag Manager - Integracja z GA4 to w moduły dbają o to, aby wszystkie zdarzenia były implementowane w odpowieniej kolejności.
Nie musisz nic robić. Błąd "A tag read consent state before a default was set" nie będzie występował.

“A tag read consent state before a default was set”

Komunikat ten oznacza, że tak nie jest poprawnie zaimplementowany. Problemem jest złą kolejność implenmentacji. Aby naprawić ten problem możliwe jest kilka rozwiązań:

Tak wygląda niepoprawna implementacja ConsentMdoe V2

Błędna implementacja powodująca w/w komunikat

<!DOCTYPE html>
<html>
<head>
<!--- Tutaj zapewne będzie więcej kodu HTML --->
    
<!-- Google tag (gtag.js) -->
<script async src="https://www.googletagmanager.com/gtag/js?id=TAG_ID"></script>
<script>
    // Sekcja śledzenia: powinna być Pood sekcją Consent
    window.dataLayer = window.dataLayer || [];
    function gtag(){dataLayer.push(arguments);}
    gtag('js', new Date());
    gtag('config', 'TAG_ID');
</script>
<!--- Tutaj zapewne będzie więcej kodu HTML --->

<script>
    // Sekcja Consent: Powinna być nad sekcją śledzenia
    window.dataLayer = window.dataLayer || [];
    function gtag() { window.dataLayer.push(arguments); }
    gtag('consent','default', { /* */ });
</script>

</head>
<body>...</body>
</html>

Poprawna implementacja

Zostały zamienione sekcje śledzenia i consent/zgód

<!DOCTYPE html>
<html>
<head>
<!--- Tutaj zapewne będzie więcej kodu HTML --->


<script>
    // Sekcja Consent: Poprawnie zaimplementowana Sekcja, jest powyżej sekcji śledzenia
    window.dataLayer = window.dataLayer || [];
    function gtag() { window.dataLayer.push(arguments); }
    gtag('consent','default', { /**/ });
</script>


<!-- Google tag (gtag.js) -->
<script async src="https://www.googletagmanager.com/gtag/js?id=TAG_ID"></script>
<script>
    // Sekcja śledzenia: Poprawna implementacja
    window.dataLayer = window.dataLayer || [];
    function gtag(){dataLayer.push(arguments);}
    gtag('js', new Date());
    gtag('config', 'TAG_ID');
</script>
<!--- Tutaj zapewne będzie więcej kodu HTML --->

</head>
<body>...</body>
</html>

Jak rozwiązać problem

Zamiana kolejności zaczepów

W większości przypadków rozwiązaniem będzie wejście w Pozycje (haków/zaczepów/hooków) i przesunięcie modułu powyżej Twojego modułu analitycznego, tak aby nasz moduł Cookie ładował się pierwszy

Przepięcie modułu do Hooka “DisplayAfterTitleTag”

Jeżeli to nie pomaga, kolejnym etapem jest zmiana hooka na wyższy (lub podpięcie naszego, patrz następna sekcja)

W Prestashop 1.7 istnieje hak, o nazwie DisplayAfterTitleTag. Jest on wyżej niż ``DisplayHeader`.

Moduł wspiera obsługę tego haka i należy dodatkowo dopiąć moduł do DisplayAfterTitleTag, nie usuwając displayHeader

Prestashop 1.6 oraz implementacje ręczne

Istnieje kilka sytuacji, w których niezbędna będzie edycja kodu.

Takie sytuacje to:

kod gtag został zaimplementowany ręcznie powyżej DisplayAfterTitleTag i/lub displayHeader
moduł ma własny hak, który jest wyżej niż DisplayAfterTitleTag i/lub displayHeader
i inne skrajne sytuacje, które mogą prowadzić do dodania kodu gtag bardzo wysoko

Jak poparwnie zaimplementować moduł Cookie w takim przypadku

W tym przypadku oprzemy się na przykłądzie ręcznej implementacji W tym momencie, jedyną opcją na poprawną implementację naszego modułu Cookie & Consent Manager, jest dodanie własnego haka, powyżej ręcznie wpisanej sekcji

<!DOCTYPE html>
<html>
<head>
    
    <title>Implementacja SEIGI Cookie & Consent</title>
    
    <!-- 
    W tym przypadku, aby definicja naszego modułu była na samej górze (zgodnie z zaleceniami Google) 
    należy dodaać następujący zaczep PRZED kodem definiującym
    -->
    {hook name="displayHeaderSeigiCookieConsent"}
    
    <!-- Google tag (gtag.js) -->
    <script async src="https://www.googletagmanager.com/gtag/js?id=TAG_ID"></script>
    <script>
        // Sekcja śledzenia: Poprawna implementacja
        window.dataLayer = window.dataLayer || [];
        function gtag(){dataLayer.push(arguments);}
        gtag('js', new Date());
        gtag('config', 'TAG_ID');
    </script>
    <!-- Możliwe jest, że został też ręcznie dodany hak modułu, zamiast powyższego kodu -->
    {hook name="myGoogleAnalyticsModuleHook"}
    
    
    <!-- ten hook nie występuje w Prestashop 1.6 i starszych -->
    {hook name="displayAfterTitleTag"}
    
    <!-- Standardowy kod prestashop do definicji zmiennych i załączania styli i bibliotek -->
    {hook name="displayHeader"}

    <!--- Tutaj zapewne będzie więcej kodu HTML --->

</head>
<body>...</body>
</html>

Cookie & Consent Manager Implementacja ConsentMode v2