Consentl w BigCommerce

Zainstaluj Consentl w BigCommerce przez Script Manager lub w motywie Stencil dla ścisłego wstępnego blokowania, z checkoutem zgodnym z PCI i obsługą Catalyst.

Skrypt ładujący jako pierwszy w <head>: Zależy od metody

Są dwa sposoby instalacji, w zależności od tego, jak ścisłe ma być wstępne blokowanie.

Metoda	Pierwszy w `<head>`?	Nakład pracy
A. Script Manager	Nie: renderowany wewnątrz `{{{head.scripts}}}`, po CSS, czcionkach i skryptach head motywu	Bez kodu
B. Plik motywu (`base.html`)	Tak	Edycja motywu; ponownie po aktualizacjach motywu

Przed wyborem metody należy zdecydować, co zrobić z własnym mechanizmem zgód na pliki cookie BigCommerce: Settings → Security & Privacy → Your customers' privacy → Cookie consent tracking.

Zalecane: wyłączyć go. Consentl sam wyświetla baner i wstrzymuje nieniezbędne skrypty; pozostawienie obu oznaczałoby wyświetlanie dwóch banerów.
Jeżeli pozostanie włączony, BigCommerce renderuje skrypty Script Manager z kategorii Analytics, Functional lub Targeting; Advertising dopiero po uzyskaniu własnej zgody, a oba banery musiałyby być synchronizowane, czego ten poradnik nie obejmuje. Sam Consentl musi wtedy mieć kategorię Essential, w przeciwnym razie nigdy by się nie załadował.

Klucz witryny Consentl znajduje się na stronie Konfiguracja witryny w panelu. Nazwę hosta sklepu należy dodać w polu Domeny; www. i domena bez www liczą się jako ta sama witryna, więc nie trzeba osobno dodawać www..

Co obejmuje Państwa plan Consentl

Free: baner, rejestr zgód i tylko ręczne blokowanie.
Pro: dodaje Google Consent Mode v2.
Business: dodaje automatyczne blokowanie znanych narzędzi śledzących i reguły blokowania dodane w panelu.

W planach Free i Pro wstrzymywane są tylko tagi oznaczone ręcznie.

A. Script Manager (sklepy Stencil)

Panel sterowania → Storefront → Script Manager → Create a Script.
Należy wypełnić:
- Name of script: Consentl
- Location on page: Header
- Select pages where script will be added: Store pages (strony sklepu). Nie All pages; zob. Strona zamówienia i My Account.
- Script category: Essential
- Script type: URL
- Load method: Default. Nigdy Async ani Defer: skrypt ładujący musi działać synchronicznie.
- Script URL: https://api.consentl.com/v1/loader.js?k=SITE_KEY&l=en (należy dodać &gcm=ext, jeżeli sklep korzysta również z szablonu Consentl GTM, aby polecenia Consent Mode wysyłał tylko szablon)
- Integrity Hash: należy pozostawić puste. Skrypt ładujący zmienia się przy zmianie ustawień w panelu Consentl, więc stały skrót sprawiłby, że przeglądarka by go odrzuciła.
Save. Ze względu na pamięć podręczną pojawienie się zmian może potrwać około 20 sekund.
Należy przetestować w oknie prywatnym (zob. Sprawdzenie działania).

Script Manager ogranicza zawartość skryptu do 64 KB. Skrypt ładujący to jednowierszowy skrypt URL.

Strona zamówienia i My Account

BigCommerce wymaga skrótu SRI dla każdego skryptu na stronie zamówienia: „All scripts on the checkout page need at least one SRI hash to meet PCI 4.0 - 6.4.3 requirements”. Pomoc BigCommerce rozszerza to na stronę My Account, gdy włączone są zapisane karty.
Skrypt ładujący Consentl nie może mieć stałego skrótu, więc nie wolno go tam umieszczać. Dlatego powyżej domyślnie wybrano Store pages i dlatego metoda B musi wyłączać skrypt ładujący ze strony zamówienia.
W rezultacie strona zamówienia (oraz My Account przy włączonych zapisanych kartach) nie wyświetla banera i nie działa tam środowisko uruchomieniowe Consentl.
Wybór dokonany przez odwiedzającego w sklepie jest przechowywany we własnym pliku cookie consentl i stosowany ponownie na następnej stronie sklepu. Consentl nie wstrzymuje niczego na samej stronie zamówienia: należy wyłączyć ze strony zamówienia nieniezbędne skrypty (również dla nich wybrać Store pages) i sprawdzić, co ładują tam integracje z Settings → Data Solutions.
Skrypty w ogóle renderują się na stronie zamówienia i potwierdzenia zamówienia tylko przy Optimized One-Page Checkout.

B. Plik motywu (naprawdę pierwszy)

Storefront → Themes: przy bieżącym motywie należy wybrać Advanced → Make a copy. BigCommerce pozwala edytować pliki motywu tylko na kopii. Następnie należy otworzyć Advanced → Edit Theme Files kopii lub użyć Stencil CLI.
Należy otworzyć templates/layout/base.html i wkleić skrypt ładujący bezpośrednio po <head>, przed {{{head.scripts}}} i CSS motywu:
```
<head>
    <script src="https://api.consentl.com/v1/loader.js?k=SITE_KEY&l={{language_selector.active_language_code}}"></script>
    <title>{{ head.title }}</title>
```
- {{language_selector.active_language_code}} to udokumentowany helper języka. Cornerstone ma także {{locale_name}}, który tam działa, ale nie występuje w dokumentacji obiektów. Jeżeli żaden z nich nie zwraca potrzebnego formatu, należy użyć stałego języka, np. en.
- Jeżeli włączone jest Enable Nonce-Based Script Security (Settings → Security & Privacy), należy dodać do tagu nonce="{{nonce}}". Skrypty zwalniane przez Consentl po wyrażeniu zgody również potrzebują wtedy nonce (należy nadać go każdemu tagowi oznaczanemu ręcznie) lub polityki z 'strict-dynamic'; w przeciwnym razie przeglądarka je blokuje.
Należy zapisać i zastosować kopię. Nie należy dodatkowo dodawać Consentl przez Script Manager.
Aktualizacje motywu zastępują base.html: po każdej aktualizacji należy ponownie dodać ten wiersz.

Nie należy dodawać skryptu ładującego do szablonów strony zamówienia (zob. Strona zamówienia i My Account). Po zastosowaniu motywu należy otworzyć stronę zamówienia i sprawdzić w View Source, że skryptu ładującego tam nie ma.

Tagi zapisane na stałe

<script src>, piksel <img> lub <iframe> zapisane w plikach motywu lub w skrypcie Script Manager są pobierane przez przeglądarkę, zanim jakikolwiek skrypt może je zatrzymać, nawet jeżeli Consentl uniemożliwia ich uruchomienie. Takie tagi należy oznaczyć ręcznie, a piksele <noscript> usunąć:

<script type="text/plain" data-consentl="marketing" src="https://ads.example.com/tag.js"></script>
<iframe data-consentl="marketing" data-src="https://www.youtube-nocookie.com/embed/ID" title="Video"></iframe>
<img data-consentl="marketing" data-src="https://tracker.example.com/pixel.gif" alt="" width="1" height="1">

Tagi ładowane przez kod (GTM, skrypt ładujący JavaScript piksela) są wstrzymywane bez żądania, gdy włączone jest automatyczne blokowanie (plan Business i wyższe).

Link do ponownego otwarcia i elementy osadzane

Linki, których adres URL kończy się na #consentl lub #consentl-preferences, oraz każdy element z atrybutem data-consentl-open otwierają preferencje. Należy dodać taki link w stopce („Ustawienia plików cookie”).
Osadzane elementy z deklaracją plików cookie, wnioskiem dotyczącym danych osobowych i unijnym formularzem odstąpienia od umowy działają zgodnie z opisem w poradniku dla stron internetowych. Formularz odstąpienia od umowy wymaga planu Pro lub wyższego i musi zostać włączony w panelu; w przeciwnym razie pozostaje pusty.

Content Security Policy

Jeżeli dodano ograniczenia script-src (Settings → Security & Privacy → Content Security Policy), należy zezwolić na https://api.consentl.com dla script-src i connect-src.

Catalyst (headless sklep Next.js)

Catalyst wstrzykuje skrypty Script Manager po stronie klienta i z odroczeniem, więc nigdy nie są pierwsze. Należy postępować zgodnie z poradnikiem Next.js dla App Router, w tym z jego wskazówkami „pierwszy w <head>”:

core/app/[locale]/layout.tsx nie ma jawnego <head>. Należy go dodać i umieścić w nim Consentl tak, jak pokazuje poradnik Next.js: zwykły <script> jako pierwszy element podrzędny.
app/not-found.tsx renderuje własny <html>; tam również należy dodać Consentl.
React 19 przenosi skrypty async powyżej zwykłego synchronicznego skryptu, a next/script z afterInteractive powoduje pobranie tagu przez przeglądarkę przed wyrażeniem zgody. Każdy inny tag, który musi czekać na zgodę, należy dodać za pomocą komponentu ConsentlScript z poradnika (type="text/plain" z jego kategorią Consentl) lub zarządzać nim w Google Tag Manager.

Należy wyłączyć Cookie consent tracking BigCommerce. Catalyst 1.3 i nowsze zawiera własny baner zgody (c15t): należy go usunąć lub wyłączyć, aby nie wyświetlać dwóch banerów.

Sprawdzenie działania

Należy otworzyć sklep w oknie prywatnym i wyświetlić źródło strony: w metodzie B skrypt ładujący jest pierwszym elementem w <head>. Pojawia się baner. Serwer deweloperski Stencil CLI nie renderuje skryptów Script Manager, ale renderuje kod motywu.

Region odwiedzającego jest ustalany na podstawie jego adresu IP: Consentl ustala kraj w pamięci przy każdym wyświetleniu strony (nic nie jest zapisywane) i stosuje do niego Państwa regułę z panelu. Stany USA nie są rozróżniane: odwiedzający z USA otrzymują Państwa regułę dla całych USA lub, jeżeli jej nie ma, pierwszą regułę dla stanu USA. Nieznany kraj otrzymuje regułę dla nieznanych regionów (domyślnie opt-in).

Ograniczenia

Script Manager nie jest pierwszy. Własne skrypty head motywu i wszelkie skrypty Script Manager, które BigCommerce wstawia przed Consentl, uruchamiają się najpierw; ich kolejność wewnątrz {{{head.scripts}}} nie jest udokumentowana. Do ścisłego wstępnego blokowania należy użyć metody B. Consentl wstrzymuje rozpoznane narzędzia śledzące ładowane po nim (plan Business i wyższe); w planach Free i Pro wstrzymywane są tylko tagi oznaczone ręcznie.
Brak banera na stronie zamówienia (oraz w My Account przy zapisanych kartach); zob. Strona zamówienia i My Account.
Natywna analityka BigCommerce nie jest kontrolowana przez Consentl (na przykład natywne integracje GA4 lub Meta w Settings → Data Solutions). Należy skonfigurować je tak, aby stosowały się do Consent Mode, lub zastąpić je tagami ładowanymi przez GTM.

Potrzebują Państwo pomocy? Prosimy pisać na adres support@consentl.com — odpowiadamy po angielsku w dni robocze.