Snippet śledzący to krótki skrypt async — kilka kilobajtów serwowanych z pamięci edge-cache — który identyfikuje organizację stojącą za każdą sesją. Po poprawnej instalacji jest niezauważalny. Przy błędnej konfiguracji spędzisz tydzień na debugowaniu, dlaczego znikają zidentyfikowane firmy, zanim odkryjesz, że skrypt był wewnątrz leniwie ładowanej sekcji. Ten przewodnik pozwoli Ci uniknąć tego błędu.
Trzy zasady przed wklejeniem kodu
- Skrypt powinien znajdować się w sekcji HTML head całej witryny. Nie w stopce, nie w specyficznym szablonie strony, ani w komponencie widocznym tylko na stronach marketingowych. W sekcji head, na każdej stronie.
- Skrypt jest domyślnie async. Nie dodawaj atrybutów defer/async nadpisujących moment wykonania; dostarczone atrybuty są tymi, które przetestowaliśmy.
- Zainstaluj tylko raz. Dwie kopie skryptu na tej samej stronie nie podwajają danych — podwajają liczbę żądań i utrudniają debugowanie.
WordPress
Najczystsza instalacja na WordPress unika edycji motywu. Użyj wtyczki do skryptów nagłówka (dowolna popularna wtyczka się sprawdzi), wklej skrypt w pole "scripts in head", zapisz i wyczyść cache strony. Jeśli nie chcesz używać wtyczki, dodaj plik mu-plugin, który podepnie się pod wp_head z priorytetem 5, aby skrypt załadował się przed tagami analitycznymi. Nie wklejaj go do treści strony ani posta — WordPress usunie tag script.
Jedna uwaga specyficzna dla WordPress: jeśli korzystasz z pełnego keszowania stron (LiteSpeed, WP Rocket, W3 Total Cache), wyczyść cache po instalacji. Skeszowany HTML sprzed instalacji nie będzie zawierał skryptu.
Shopify
Shopify przechowuje HTML motywu w pliku theme.liquid. W panelu administracyjnym Shopify otwórz Online Store → Themes → Actions → Edit code → theme.liquid i wklej skrypt bezpośrednio przed zamykającym tagiem </head>. Zapisz. To wszystko — nie potrzeba aplikacji ani skryptów checkout (checkout i tak wykracza poza zakres identyfikacji na poziomie firmy).
Najpierw zduplikuj motyw
Przed edycją theme.liquid użyj Actions → Duplicate. Jeśli coś pójdzie nie tak, przywrócisz wersję jednym kliknięciem. To pięciosekundowy nawyk, który uratował pracę wielu zespołów korzystających z Shopify.
Webflow
Webflow → Site Settings → Custom Code → Head Code. Wklej skrypt. Zapisz. Opublikuj witrynę. Kod w sekcji head jest stosowany globalnie do wszystkich stron, co jest dokładnie tym, czego potrzebujesz. Nie wklejaj skryptu do elementu embed na poziomie pojedynczej strony — będziesz śledzić tylko tę jedną stronę.
Google Tag Manager
GTM działa poprawnie z dwoma zastrzeżeniami. Po pierwsze, użyj tagu Custom HTML z regułą „All Pages”, aby skrypt uruchamiał się przy każdej odsłonie. Po drugie, ustaw priorytet tagu na tyle wysoko, aby odpalił się przed innymi tagami analitycznymi. Użytkownicy GTM często nakładają wiele warstw tagów; nasz skrypt jest mały, ale kolejność ma znaczenie dla identyfikacji przy pierwszym żądaniu.
Uwaga dotycząca Consent-mode: jeśli GTM działa za banerem zgody, który uruchamia analitykę dopiero po akceptacji, nie umieszczaj identyfikacji firm za tą samą bramką — nie używa ona plików cookie ani nie przechowuje danych na urządzeniu gościa, więc nie wymaga takiej samej zgody. Skonfiguruj tag tak, aby uruchamiał się natychmiast, wraz z tagami niezbędnymi (strictly-necessary).
Czysty HTML / dedykowane stosy technologiczne
W przypadku stron pisanych ręcznie lub frameworków, których nie wymieniliśmy, wklej skrypt wewnątrz elementu <head> bazowego szablonu. Przebuduj i wdroż projekt. W generatorach stron statycznych skrypt powinien trafić do globalnego układu (layout) (w Next.js jest to <Script> w layout z strategy="afterInteractive"; w Astro komponent <BaseHead>; w 11ty szablon bazowy). Skrypt dodany tylko do pojedynczego komponentu będzie raportować tylko strony go zawierające.
Aplikacje jednostronicowe (SPA) — pułapka
W SPA pierwsza odsłona jest rejestrowana przy ładowaniu strony. Kolejne nawigacje po stronie klienta nie są automatycznymi odsłonami z punktu widzenia przeglądarki. Nasz skrypt domyślnie nasłuchuje History API, więc nawigacje wstecz/dalej i pushState są rejestrowane bez dodatkowego kodu. Jeśli Twoje SPA używa niestandardowego routera (rzadkość), wywołaj udokumentowaną funkcję pageview przy zmianie trasy — to trzy linie kodu opisane w dokumentacji.
Weryfikacja instalacji w dwie minuty
Weryfikacja nie jest opcjonalna. Zrób to przed zamknięciem karty, w której instalowano skrypt; naprawienie błędu po 5 minutach jest proste, po 5 dniach — już nie.
- Otwórz witrynę w trybie prywatnym/incognito (aby uniknąć błędów z cache).
- Otwórz DevTools → zakładka Network, odfiltruj po „l5e” lub ścieżce skryptu.
- Odśwież stronę. Powinieneś zobaczyć jedno żądanie do skryptu, a następnie mały identyfikacyjny „beacon”. Oba powinny mieć status 200. Nagłówki skryptu powinny zawierać cache-control z s-maxage i stale-while-revalidate.
- Przejdź na drugą stronę. Powinieneś zobaczyć kolejny beacon, bez ponownego pobierania skryptu (status 304).
- Wróć do lead.box, otwórz feed wizyt na żywo i potwierdź swoją wizytę. Jeśli się pojawi, instalacja jest zakończona.
Częste błędy — tabela do sprawdzenia w pierwszej kolejności
| Objaw | Prawdopodobna przyczyna | Rozwiązanie |
|---|---|---|
| Brak wizyt na żywo | Brak skryptu w head lub błędny szablon | Przenieś skrypt do globalnego szablonu head |
| Wizyty tylko z jednej sekcji | Skrypt w embed na stronie, a nie globalnie | Przenieś do globalnego head / nagłówka motywu |
| Skrypt się ładuje, ale brak beaconu | Baner zgody zbyt agresywnie blokuje skrypty | Skonfiguruj baner tak, aby dopuszczał skrypt jako niezbędny |
| Podwójne beacony na odsłonę | Skrypt zainstalowany dwukrotnie (motyw + wtyczka) | Usuń jedną z instalacji |
| Wolne ładowanie strony po instalacji | Skrypt umieszczony przed krytycznym CSS | Upewnij się, że atrybut async jest obecny; umieść po CSS |
| SPA raportuje tylko pierwszą stronę | Niestandardowy router omija History API | Wywołaj pageview() przy zmianie trasy |
| Stary HTML bez skryptu | Pełny cache strony nie został wyczyszczony | Wyczyść cache; sprawdź w incognito |
Uwaga o wydajności — edge-cached loader
Skrypt jest serwowany przez ścieżkę typu first-party z proxy do naszego edge cache (s-maxage=300). W praktyce oznacza to pobieranie raz na 5 minut, a następnie serwowanie z cache. Waga bajtowa i wpływ na blokowanie są na tyle małe, że nie zalecamy stosowania dodatkowej logiki ładowania.
Kiedy prosić o pomoc
Jeśli przeszedłeś kroki weryfikacji i coś nadal nie działa, wolimy o tym usłyszeć w dziesiątej minucie niż dziesiątym dniu. Przygotuj trzy rzeczy: URL strony, zrzut ekranu DevTools (zakładka Network z filtrem ścieżki skryptu) oraz nazwę platformy. To wystarczy, aby zdiagnozować prawie każdy problem przy pierwszej odpowiedzi.
Opublikowane przez
lead.box Team
Więcej artykułów
Sprawdź lead.box na własnym ruchu
Zacznij za darmo — bez karty, bez konieczności rozmowy sprzedażowej. Lub zarezerwuj 20-minutową prezentację, jeśli wolisz wspólny przegląd.