// Integracje / Shoper

Visitant w Shoperze

Shoper ma dwa rodzaje szablonów sklepu i w każdym kod trafia w inne miejsce. Ta instrukcja opisuje oba, a do tego zapis wartości zamówienia na stronie potwierdzenia. W obu przypadkach bez cookies i bez banera zgód.

Czego potrzebujesz

• Dostęp do panelu Shoper z uprawnieniami do integracji i szablonu.
• Darmowe konto Visitant z dodaną domeną sklepu (Free: 5 000 zdarzeń miesięcznie, 2 strony).
• Domena sklepu, np. twojsklep.pl - bez https:// i bez www.
• Przy szablonie Storefront: abonament Shoper Premium (moduły własne) albo konto Google Tag Manager.

Instalacja w 5 krokach

1. 01 Sprawdź, jakiego szablonu używa Twój sklep

   Shoper ma nowsze szablony Storefront (edytowane w Shoper Visual Editor) i starsze szablony RWD. To ważne, bo Shoper podaje wprost, że szablony Storefront nie uwzględniają kodu wpisanego w Integracje własne, z których korzystają stare szablony. Jeśli wygląd sklepu zmieniasz w Shoper Visual Editor, masz Storefront: pomiń krok 2 i przejdź do kroku 3. W przeciwnym razie zrób krok 2, a krok 3 pomiń.

   Nazwy menu sprawdziliśmy w Centrum Pomocy Shoper we wrześniu 2026, ale nie testowaliśmy ich w działającym sklepie. Shoper co jakiś czas zmienia nazwy w menu, więc u Ciebie mogą się trochę różnić.

2. 02 Szablon RWD: wklej linijkę w nagłówek strony

   W panelu wejdź w Aplikacje i integracje - Własne integracje (w starszych panelach: Dodatki i integracje - Integracje własne). W polu Nagłówek strony wklej poniższą linijkę pod kodem, który już tam jest - nie usuwaj innych wpisów, należą do Twoich pozostałych integracji. Zamień twojsklep.pl na swoją domenę i kliknij ZAPISZ.

   <script defer data-domain="twojsklep.pl" src="https://annuora.com/v.js"></script>Kopiuj

   Kod z tego pola pojawia się na każdej stronie sklepu, niezależnie od tego, który szablon RWD jest włączony.

3. 03 Szablon Storefront: moduł własny albo Google Tag Manager

   Storefront przyjmuje dodatkowy kod tylko z modułów. W abonamencie Shoper Premium wejdź w Wygląd i treści - Wygląd sklepu - Edycja szablonu graficznego, kliknij Edytuj układ i styl szablonu, potem Dodaj - + Dodaj moduł własny. Ustaw Typ modułu na Moduł integracji, dostępność na Dowolna strona, wklej linijkę z kroku 2 w pole Twig i kliknij ZAPISZ. Potem włącz moduł w Shoper Visual Editor, w zakładce Integracje.

   Nie masz Premium? Według Shopera moduły własne wymagają tego abonamentu. Storefront ma za to wbudowany moduł Google Tag Manager w tej samej zakładce Integracje (wpisujesz tylko identyfikator kontenera), a Visitant dodasz w GTM jako jeden własny tag HTML - zobacz instrukcję dla Google Tag Managera.

4. 04 Zapisz wartość zamówień (szablony RWD)

   Na tym samym ekranie Własne integracje jest pole Potwierdzenie złożenia zamówienia. Kod z niego działa tylko na stronie, którą klient widzi po złożeniu zamówienia, a Shoper podstawia w nim zmienne: {order_id} to numer zamówienia, {float_sum} jego wartość (Shoper opisuje też {float_sum_noship}, czyli wartość bez wysyłki). Wklej poniższy kod i zmień PLN, jeśli sklep sprzedaje w innej walucie. Potem w panelu Visitant dodaj w Ustawienia - Cele cel typu Zdarzenie o nazwie Purchase.

   <script>
   window.visitant = window.visitant || function () { (window.visitant.q = window.visitant.q || []).push(arguments); };
   visitant("Purchase", { revenue: { amount: {float_sum}, currency: "PLN" }, props: { order: "{order_id}" } });
   </script>Kopiuj

   Kod złożyliśmy ze zmiennych opisanych w Centrum Pomocy Shoper; odpowiednika tego pola dla Storefront nie znaleźliśmy. Tam dodaj adres swojej strony podziękowania jako cel typu Strona - zobaczysz liczbę zamówień, ale nie ich wartość.

5. 05 Zapisz, nie ruszaj zgód i sprawdź

   Narzędzie cookies Shopera każe owijać skrypty w jego funkcje zgód (np. window.customerPrivacy.onAnalyticsConsentGranted), żeby ich cookies trafiły do właściwej kategorii. Linijki Visitant nie owijaj: nie zapisuje cookies ani niczego w przeglądarce, więc nie ma czego kategoryzować - a owinięta pominęłaby każdego, kto odrzuci cookies. Otwórz sklep w oknie prywatnym i zajrzyj do panelu.

Czy działa? Sprawdź w 60 sekund

Otwórz panel Visitant w jednej karcie, a sklep w oknie prywatnym w drugiej.

• Wejdź na stronę produktu: licznik osób teraz na górze panelu pokaże 1 po kilku sekundach.
• Podejrzyj źródło strony (Ctrl+U) i wyszukaj v.js: linijka występuje dokładnie raz, z Twoją domeną w data-domain.
• RWD z kodem zamówienia: po zamówieniu testowym tabela Cele i zdarzenia pokazuje Purchase z wartością w kolumnie Przychód.
• Wejdź do sklepu z odpowiedzi ChatGPT albo Perplexity, która do niego linkuje: wizyta pojawi się w sekcji AI z nazwą asystenta.

Częste problemy

W sklepie na Storefront nic się nie pojawia	Linijka trafiła najpewniej do Własnych integracji, które Storefront ignoruje. Użyj modułu integracji albo Google Tag Managera (krok 3).
Linijka się zapisuje, ale znika ze strony	Shoper potrafi wycinać kod HTML, który uzna za niebezpieczny. Dla kodu w modułach starych szablonów jego pomoc wskazuje opcję Wyłącz czyszczenie kodu HTML w Ustawienia - Zaawansowane - Bezpieczeństwo; włącz ją tylko wtedy, gdy wiesz, na co jeszcze wpływa.
Zamówienie policzyło się dwa razy	Sama pomoc Shopera ostrzega, że stronę potwierdzenia zamówienia można odświeżyć - dlatego jego kod Google Ads używa numeru zamówienia. Jeśli klient odświeży tę stronę, Visitant może zapisać zakup drugi raz; numer zamówienia w zdarzeniu pozwala to wyłapać.
Panel botów AI jest pusty	W Shoperze to normalne: roboty AI nie uruchamiają JavaScriptu, a sklep hostuje Shoper, więc nie ma gdzie wstawić naszego fragmentu serwerowego. Więcej w pytaniach poniżej.

Pytania