Strona główna / inspektor dataLayer

Inspektor dataLayer, który zachowuje kolejność

Możesz wpisać dataLayer w konsoli. Wróci tablica bez czasu, bez skutków i bez niczego sprzed ostatniej nawigacji.

Konsola to domyślna odpowiedź i nie jest całkiem zła. Wpisanie dataLayer daje pushe jako tablicę, co wystarczy, by potwierdzić, że klucz istnieje. Brakuje jej przy pytaniach, które przychodzą po tym.

Dlaczego konsola nie wystarcza

• Tablica to nie model. GTM trzyma scalony stan zbudowany z wszystkich pushy; tablica jest logiem, który go wyprodukował. Klucz zapisany jednym pushem i nadpisany późniejszym pojawia się w tablicy dwa razy, a żaden wpis nie mówi, którą wartość tag naprawdę odczytał.
• Nie ma w niej czasu. To, czy push wylądował przed czy po tagu, który go potrzebował, bardzo często jest całym błędem, a tablica obiektów nie nosi zegara.
• Kończy się na ostatniej nawigacji. Na zwykłej stronie pushe, których szukałeś, znikają w chwili zmiany strony. W aplikacji jednostronicowej tablica przeżywa, ale kolejność między trasami to dokładnie to, czego nie widać.
• Nic nie łączy pusha z jego skutkami. Konsola pokazuje push. Nie pokazuje, że push uruchomił trzy tagi — ani że nie uruchomił żadnego.

Co pokazuje panel

Każdy push, w kolejności, w jakiej nastąpił, utrzymany przez nawigacje, z zagnieżdżonymi pod nim żądaniami śledzącymi, które wywołał. Nazwa zdarzenia, cały obiekt i — dla pushy, które coś spowodowały — platformy, które zareagowały.

Od pusha do zmiennych GTM

Kiedy znajdziesz potrzebny push, reszta roboty to przepisywanie: każda ścieżka z kropkami wpisana do GTM jako Data Layer Variable, potem reguła Custom Event, potem podpięty do nich tag. Wybranie zdarzenia w panelu i zaznaczenie potrzebnych wartości produkuje wszystkie trzy, już w formie gotowej do importu.

Wychodzi z tego eksport kontenera GTM, a nie plik sesji — idzie do GTM i nie da się go wczytać z powrotem do rozszerzenia. Co ten plik musi zawierać omawia dwa pola, przez które GTM odrzuca cały import, a wybieranie zdarzenia — krok wcześniejszy.

Gdzie konsola nadal wygrywa

W odczycie scalonego modelu tu i teraz. google_tag_manager['GTM-XXXXXX'].dataLayer.get('ecommerce') zwraca wartość, którą GTM podałby zmiennej w tej chwili — dokładnie, natychmiast i tak, jak nie zrobi tego zapisana historia. Panel zbierający pushe jest zapisem tego, co się stało; konsola jest sondą w to, co jest prawdą. Gdy pytasz o teraz, użyj sondy.

Pytania

Jak podejrzeć dataLayer na stronie?

Wpisanie dataLayer w konsoli przeglądarki zwraca tablicę pushy. Dla kolejności, czasu i tego, co każdy push wywołał, panel zapisujący je na bieżąco pokazuje to, czego tablica pokazać nie może.

Czemu dataLayer z konsoli różni się od tego, co czyta GTM?

Tablica to log pushy; GTM trzyma osobny scalony stan z nich zbudowany. Gdy klucz zapisano dwa razy, tablica ma oba, a model ma ostatni — i to do tej wartości rozwiązuje się zmienna.

Czy działa w aplikacjach jednostronicowych?

Tak i tam ma to największe znaczenie. Pushe są utrzymywane mimo zmian tras, więc kolejność między wirtualną odsłoną a zdarzeniami wokół niej pozostaje czytelna, zamiast uciekać w górę.

Czy mogę zamienić znalezione dane w zmienne GTM?

Tak. Wybranie zdarzenia i zaznaczenie potrzebnych wartości produkuje zmienne Data Layer, regułę Custom Event i podpięty do nich tag, jako eksport kontenera GTM gotowy do importu.

Czy działa na stronach, których nie jestem właścicielem?

Tak. Od strony nie jest wymagane nic — ani dostęp do kontenera, ani zmiana w kodzie, ani sesja debugowania.

Poradniki

Dłuższa forma, o częściach, które sprawiają kłopot.

• Jedno kliknięcie, trzy pushe: wybór właściwego zdarzenia dataLayer — Dodanie do koszyka rzadko wywołuje jedno zdarzenie. Co wypycha sklep, którego ma słuchać reguła i cztery rodzaje pusha, które nigdy nie są odpowiedzią.
• Zamiana przechwyconych pushy dataLayer w kontener GTM gotowy do importu — Co musi zawierać plik eksportu kontenera, które dwa pola sprawiają, że GTM odrzuca cały import, i dlaczego placeholdery biją puste pola.
• Jak działa wizualny wybór elementu na stronie, która się broni — Wskazanie elementu brzmi prosto, dopóki strona nie ucieknie spod kursora. Co picker musi przechwycić, do czego przyskakuje i wywołanie, które rzuca wyjątkiem.
• Reguła kliknięcia w GTM, której nie zepsuje kolejne wdrożenie — Dlaczego skopiowany selektor CSS przestaje pasować, do których atrybutów warto się przywiązać i która klasa Tailwinda po cichu unieważnia selektor.
• Śledzenie wewnątrz osadzonego widżetu — Widżet w iframe ma własny dataLayer. Dlaczego podgląd pokazuje jedno zdarzenie tam, gdzie log pokazuje dwa, i co przekracza granicę.
• Jak wstrzyknąć kontener GTM na dowolną stronę — Przetestuj kontener zanim trafi na produkcję — na stronie klienta, w środowisku staging albo na stronie, której nie kontrolujesz.

Pozostałe dwie: GTM debugger, GA4 debugger