Mierzenie aplikacji jednostronicowych za pomocą Menedżera tagów Google

Z tego samouczka dowiesz się, jak skonfigurować pomiary w Google Analytics w przypadku aplikacji jednostronicowej za pomocą Menedżera tagów Google. Dowiesz się, jak skonfigurować usługę w Google Analytics, włączyć niezbędne zmienne Menedżera tagów Google i utworzyć tagi, które są aktywowane przy zmianach historii.

Zanim zaczniesz

W tym samouczku przyjęto założenie, że:

• Konto i usługa Google Analytics.
• Kontener Menedżera tagów Google zainstalowany w aplikacji SPA.
• rolę Edytujący (lub o większych uprawnieniach) zarówno w Google Analytics, jak i w Menedżerze tagów Google.

Krok 1. Przygotuj strumień danych w GA4

Aby ręcznie śledzić zdarzenia page_view w aplikacji SPA, musisz najpierw wyłączyć w GA4 automatyczne odsłony stron oparte na historii, aby uniknąć podwójnego zliczania.

1. Otwórz Google Analytics.
2. Na stronie Administracja w sekcji Zbieranie i modyfikowanie danych kliknij Strumienie danych.
3. Wybierz strumień danych z sieci.
4. W sekcji Pomiar zaawansowany kliknij ikonę ustawień .
5. W sekcji Wyświetlenia strony > Pokaż ustawienia zaawansowane odznacz opcję Zmiany na stronie na podstawie zdarzeń historii przeglądania.
6. Kliknij Zapisz.

Krok 2. Włącz w Menedżerze tagów wbudowane zmienne historii

Aby używać w Menedżerze tagów Google aktywatorów lub zmiennych opartych na historii, musisz najpierw włączyć wbudowane zmienne historii.

1. Otwórz Menedżera tagów Google.
2. W obszarze roboczym otwórz Zmienne.
3. W sekcji Zmienne wbudowane kliknij Skonfiguruj.
4. W sekcji Historia włącz te zmienne:
   • History New URL Fragment
   • History Old URL Fragment
   • History New State
   • History Old State
   • History Source
5. Zamknij panel konfiguracji.

Uwaga: te zmienne nie są bezwzględnie wymagane w przypadku podstawowej konfiguracji wyświetleń strony. Są one używane tylko wtedy, gdy chcesz filtrować wyzwalacz lub wdrażać niestandardową logikę, np. logikę poprzedniej strony wspomnianą w ostatniej nocie na tej stronie.

Uwaga: w niektórych starszych dokumentach mogą pojawiać się odwołania do symboli Old History URL lub New History URL. Nie są to standardowe wbudowane zmienne. Zamiast tego użyj wymienionych zmiennych.

Krok 3. Utwórz regułę Zmiana historii

Następnie utwórz regułę, która będzie się uruchamiać za każdym razem, gdy w aplikacji SPA nastąpi zdarzenie zmiany historii (np. pushState lub replaceState).

1. W obszarze roboczym Menedżera tagów otwórz menu Reguły.
2. Kliknij Nowa.
3. W sekcji Skonfiguruj regułę wybierz regułę Zmiana historii.
4. (Opcjonalnie) Jeśli chcesz śledzić tylko określone zmiany ekranu, zaktualizuj regułę, aby uruchamiała się w przypadku niektórych zmian w historii.
5. Nazwij regułę (np. „Zmiana historii”) i kliknij Zapisz.

Krok 4. Utwórz tag Google

Teraz utwórz tag Google, który będzie aktualizować parametr page_location za każdym razem, gdy nastąpi zmiana w historii.

1. W menu Tagi kliknij Nowy.
2. W sekcji Konfiguracja tagu wybierz Tag Google.
3. Wpisz identyfikator tagu (ten sam, którego używasz w przypadku początkowego tagu Google).

4. W sekcji Ustawienia konfiguracji dodaj te parametry:

   • page_location: {{Page URL}}
   • page_title: {{Page Title}}
   • update: true
   Uwaga: parametr update scala wartości konfiguracji z istniejącą konfiguracją tagu i pomija natychmiastowe zduplikowane zdarzenie page_view. page_referrer nie jest tu uwzględniony, ponieważ Google Analytics automatycznie śledzi pierwotnego zewnętrznego odsyłającego podczas pierwszego wczytania strony, a pominięcie go umożliwia Google Analytics automatyczne wypełnianie adresu URL poprzedniej wirtualnej strony jako odsyłającego na potrzeby ścieżek nawigacji w raportach.

5. Nazwij tag (np. „Tag Google – aktualizacja SPA”) i kliknij Zapisz.

   Uwaga: nie dodawaj reguły w sekcji Uruchamianie w przypadku tego tagu Google. Jest on uruchamiany jako tag konfiguracji w ramach sekwencjonowania tagów w kroku 5.

Krok 5. Wyślij wirtualne page_view wydarzenie

Na koniec utwórz tag zdarzenia GA4, aby wysyłać rzeczywiste zdarzenie page_view w przypadku każdego wczytania strony wirtualnej.

1. W menu Tagi kliknij Nowy.
2. W sekcji Konfiguracja tagu wybierz Google Analytics: zdarzenie GA4.
3. Wpisz identyfikator pomiaru.
4. Ustaw Nazwę zdarzenia na page_view.
5. W sekcji Ustawienia zaawansowane > Sekwencjonowanie tagów kliknij Uruchom tag przed uruchomieniem tagu Zdarzenie GA4 – wyświetlenie wirtualnej strony i wybierz tag Tag Google – aktualizacja SPA utworzony w kroku 4.
6. W sekcji Reguły wybierz utworzoną w kroku 3 regułę Zmiana historii.
7. Nadaj tagowi nazwę (np. „Zdarzenie GA4 – odsłona wirtualnej strony”) i kliknij Zapisz.

Krok 6. Sprawdź konfigurację

Aby mieć pewność, że wirtualne wyświetlenia stron są rejestrowane prawidłowo:

1. W Menedżerze tagów kliknij Podgląd, aby przejść do trybu podglądu.
2. Przechodź między stronami aplikacji SPA.
3. W Google Analytics DebugView sprawdź, czy przy każdej zmianie ekranu pojawia się nowe zdarzeniepage_view.
4. Sprawdź, czy wartości page_location są zgodne z Twoimi oczekiwaniami.

Uwaga: użycie standardowego parametru {{Referrer}} rejestruje początkowe źródło, które doprowadziło użytkownika do Twojej witryny. Aby śledzić poprzednią stronę wirtualną w ramach aplikacji SPA jako witrynę odsyłającą, musisz wdrożyć niestandardową zmienną GTM, która będzie przechowywać lokalizację poprzedniej strony.