Integracja aplikacji

Wdrożenie CookieZen na Shoperze: baner cookies i zgody

Instalacja na szablonach Storefront i RWD, przekazywanie zgód do mechanizmu Shopera i weryfikacja wdrożenia krok po kroku.

CookieZen to baner cookies wspierający zgodność z RODO, który na platformie Shoper współpracuje z wbudowanym mechanizmem zgód sklepu. Decyzja podjęta przez użytkownika w banerze trafia automatycznie do mechanizmu zgód Shopera, z którego korzystają funkcje sklepu i aplikacje, bez dodatkowej konfiguracji.

Instalacja CookieZen w sklepie Shoper

Sposób instalacji zależy od szablonu, na którym działa sklep: nowszego Storefront albo starszego RWD.

Szablon Storefront

  1. Zainstaluj moduł CookieZen w sklepie, a następnie załóż konto w serwisie cookiezen.pl i dodaj w nim domenę sklepu.
  2. W panelu CookieZen otwórz zakładkę Integracja i skopiuj Site Key.
  3. W edytorze szablonu przejdź do Wygląd i treści → Obecny szablon graficzny → Edytuj Układ i Styl Szablonu → Popupy i dodatki → CookieZen, wklej Site Key i opublikuj zmiany.

Moduł wyświetla baner na wszystkich podstronach sklepu i nie wymaga zmian w układzie szablonu.

Szablon RWD

Na szablonie RWD kod CookieZen dodaje się ręcznie w Dodatki i integracje → Integracje własne, w sekcji head, przed wszystkimi pozostałymi skryptami. Kolejność ma znaczenie, ponieważ sygnały zgody muszą dotrzeć do narzędzi Google i Microsoft, zanim zaczną one zbierać dane.

Kod
<script src="https://cz-cdn.com/api/cmp/loader?site_key=TWOJ_SITE_KEY"></script>

Kod z uzupełnionym Site Key jest dostępny w panelu CookieZen, w zakładce Integracja.

Jak CookieZen współpracuje z mechanizmem zgód Shopera

Shoper udostępnia wbudowany mechanizm zgód, Customer Privacy API, z którego korzystają funkcje sklepu, aplikacje z App Store Shopera oraz skrypty dodane przez właściciela sklepu. CookieZen przejmuje w tym mechanizmie rolę banera i przekazuje do niego każdą decyzję użytkownika: akceptację, odmowę oraz zmianę ustawień. Integracja działa automatycznie po instalacji.

Kategorie zgód z banera CookieZen odpowiadają następującym obszarom sklepu:

Kategoria w banerze CookieZenZakres w sklepie Shoper
Preferencjefunkcje zwiększające wygodę zakupów, takie jak ocena produktów i lista ostatnio oglądanych produktów
Analitykastatystyki odwiedzin, w tym analityka platformy Shoper
Marketingnarzędzia reklamowe i remarketingowe

Pliki cookies niezbędne do działania sklepu, na przykład obsługujące koszyk, nie wymagają zgody i działają niezależnie od decyzji użytkownika.

CookieZen zapamiętuje decyzję użytkownika. Przy kolejnych wizytach baner nie wyświetla się ponownie, a sklep od razu otrzymuje zapisane zgody.

Niezależnie od integracji z Shoperem CookieZen przekazuje sygnały Google Consent Mode v2 do Google Analytics 4, Google Ads i Google Tag Managera. Do Microsoft Advertising i Microsoft Clarity przekazuje sygnały zgody w formacie tych narzędzi. Szczegóły opisują artykuły Google Consent Mode v2 w CookieZen, Microsoft UET Consent Mode i Microsoft Clarity Consent Mode.

Weryfikacja wdrożenia

  1. Otwórz sklep w oknie prywatnym, aby w przeglądarce nie było zapisanej wcześniejszej decyzji.
  2. Sprawdź, czy baner CookieZen wyświetla się na stronie głównej i na karcie produktu.
  3. Zaakceptuj lub odrzuć zgody, a następnie odśwież stronę. Baner nie powinien pojawić się ponownie.

Pełną listę plików cookies i skryptów śledzących używanych w sklepie pokaże bezpłatny skaner cookies.

Jeśli baner się nie wyświetla, sprawdź, czy Site Key został poprawnie wklejony w module lub w kodzie oraz czy w sklepie nie działa równolegle inny baner cookies albo wcześniejsze wdrożenie CookieZen, na przykład przez Google Tag Managera.

Najczęstsze pytania

Czy wdrożenie CookieZen na Shoperze wymaga programisty?

Nie. Na szablonie Storefront wystarczy moduł i Site Key, a na szablonie RWD wklejenie jednej linii kodu w integracjach własnych.

Czy trzeba konfigurować aplikacje z App Store Shopera?

Nie. Decyzja z banera CookieZen trafia do mechanizmu zgód Shopera, z którego korzystają aplikacje i funkcje sklepu, więc nie wymaga konfiguracji po stronie aplikacji.

Dodaj w menu lub stopce odnośnik do adresu sklepu zakończonego fragmentem #cookiezen-settings, na przykład https://twoj-sklep.pl/#cookiezen-settings. Kliknięcie otwiera baner albo ustawienia zgód, w których użytkownik może zmienić lub wycofać swoją decyzję. Działanie linku szczegółowo opisuje dokumentacja dla deweloperów.

Informacje dla programistów

Skrypty, które mają uruchamiać się dopiero po wyrażeniu zgody, warto powiązać z mechanizmem zgód Shopera. CookieZen przekazuje do niego decyzję użytkownika, więc takie skrypty korzystają z wyboru dokonanego w banerze. Dostęp do mechanizmu różni się w zależności od szablonu: na Storefroncie interfejs pobiera się przez window.useStorefront, a na RWD jest dostępny jako window.customerPrivacy.

Szablon Storefront

Kod
window.useStorefront(function (storefront) {
  storefront.getApi('customerPrivacyApi').then(function (customerPrivacyApi) {
    customerPrivacyApi.onMarketingConsentGranted(function () {
      // kod uruchamiany po udzieleniu zgody marketingowej
    });
  });
});

Szablon RWD

Kod
window.customerPrivacy.onMarketingConsentGranted(function () {
  // kod uruchamiany po udzieleniu zgody marketingowej
});

W ten sam sposób działają onAnalyticsConsentGranted i onFunctionalConsentGranted. Funkcje te reagują na udzielenie zgody, dlatego nie zatrzymują kodu, który został już uruchomiony, jeśli użytkownik później wycofa zgodę.

Szczegółowy opis interfejsu zawiera dokumentacja Customer Privacy API, a miejsca, w których Shoper pozwala dodawać własne skrypty, opisuje artykuł Jak dostosować skrypty do kategorii cookies. Na Shoperze działają również atrybuty opisane w artykule Blokowanie skryptów do momentu uzyskania zgody.

Przestań zgadywać, co robi Twój baner

14 dni za darmo, bez podawania karty.