Google Tag Manager – śledzenie kliknięć w GTM. Dlaczego warto z niego korzystać?

Google Tag Manager – co to jest?

Wśród wielu serwisów oferowanych przez Google w celu usprawnienia zarządzania procesami SEO znajduje się między innymi GTM. Co to za narzędzie? Jego głównym zastosowaniem jest dodawanie i konfigurowanie skryptów do strony internetowej, które określa się mianem tagów – stąd właśnie nazwa tej usługi. W Google Tag Managerze można kontrolować je w przejrzysty sposób z pojedynczego miejsca. Same skrypty mogą z kolei być używane do analizy różnego rodzaju danych dotyczących działania strony internetowej i interakcji użytkowników z witryną. Informacje zdobyte w ten sposób mogą być nieocenione przy działaniach mających na celu podniesienie konwersji lub dokładne śledzenie ruchu. Warto przy tym zaznaczyć, że skrypty przygotowane przez Google w bardzo niewielkim stopniu obciążają stronę internetową. Takie rozwiązanie pozwoli uniknąć błędów, które mogłyby pojawić się przy ręcznym implementowaniu podobnych funkcjonalności.

Czym jest tag?

To swego rodzaju skrypt śledzący, który po dodaniu na stronę gromadzi różne dane – mogą one dotyczyć działań użytkownika czy źródła ruchu. Jest to kawałek kodu napisanego w języku JavaScript, obsługiwany przez praktycznie każdą popularną przeglądarkę. Może być bez problemu zintegrowany z innymi rozwiązaniami obecnymi na serwerze. Co ważne, takie tagi mają określone specjalne reguły, które definiują, kiedy mają się uruchomić. Konkretne zasady mogą również kierować samym działaniem skryptu – możemy dzięki nim określić na przykład, który tag ma zbierać informacje ze strony z potwierdzeniem transakcji, a który z innych podstron.

Co umożliwia śledzenie kliknięć w Google Tag Manager?

Dzięki zastosowaniu śledzenia zdarzeń typu kliknięcie, z wykorzystaniem narzędzia Google Tag Manager, możemy przesyłać informacje na temat interakcji użytkownika ze stroną do narzędzia Google Analytics. Dzięki połączeniu obu usług amerykańskiej korporacji możemy między innymi śledzić takie zdarzenia, jak:

• kliknięcie specyficznego adresu URL (na przykład sprawdzenie, jak często użytkownicy przechodzą na stronę typu kontakt),
• kliknięcie przez użytkownika konkretnej miniaturki zdjęcia na stronie internetowej,
• kliknięcia specyficznych elementów na stronie, na przykład przycisk “Play”, umieszczony w elementach wideo na stronie,
• skorzystanie z odnośników na stronie internetowej prowadzących np. do firmowych social media.

To tylko kilka przykładowych zdarzeń Google Tag Manager, które możemy śledzić. Każdy rodzaj stron internetowych ma inne cele i kluczowe interakcje, na blogu interesować nas może częstotliwość kliknięć ocen artykułu, natomiast w sklepie internetowym kluczowe będą interakcje z koszykiem.

Google Tag Manager umożliwia śledzenie kliknięć elementów DOM (Document Object Mode). Narzędzie umożliwia śledzenie następujących rodzajów kliknięć (każdy rodzaj kliknięcia zostanie opisany w dalszej części artykułu):

• Click Element,
• Click Classes,
• Click ID,
• Click Target,
• Click URL,
• Click Text.
  
  Umów się na darmowy audyt Twojej strony

  DARMOWY AUDYT SEO

  Jak śledzić kliknięcia w Google Tag Manager?

  W celu śledzenia kliknięć w pierwszej kolejności należy przejść na stronę: https://tagmanager.google.com/, a następnie zalogować się za pomocą konta Google. Dalej należy utworzyć kontener, który umożliwi nam zarządzanie tagami GTM.

  Źródło: tagmanager.google.com

  Podczas tworzenia pierwszego kontenera na koncie należy uzupełnić następujące informacje:

  • Nazwa konta – dowolna nazwa naszego konta (może być nazwa domeny, np. ebrains.pl),
  • Kraj – tutaj standardowo wybieramy Polska,
  • Nazwa kontenera – zgodnie z zaleceniami Google warto podać nazwę domeny,
  • Platforma docelowa – wybieramy Witryna internetowa.

  Po kliknięciu przycisku Utwórz należy zapoznać się z warunkami korzystania z Menedżera tagów Google i zaakceptować zasady przetwarzania danych.

  Kolejnym etapem jest instalacja menedżera tagów Google, w tym celu należy postępować zgodnie z instrukcjami Google, w przypadku gdy okno z instrukcjami nie pojawi się automatycznie, należy kliknąć element zaznaczony czerwoną strzałką na poniższym zrzucie ekranu.

  Źródło: tagmanager.google.com

  Konfiguracja zmiennych wbudowanych

  Kolejnym etapem jest włączenie śledzenia zmiennych, w tym celu należy przejść do zakładki Zmienne, następnie przy Zmiennych wbudowanych kliknąć Skonfiguruj i zaznaczyć następujące elementy (czerwone zaznaczenie na poniższym zrzucie ekranu):

  Źródło: tagmanager.google.com

  Kolejnym krokiem jest weryfikacja poprawności działania zmiennych.

  Przed rozpoczęciem tworzenia tagów, odpowiedzialnych za przesyłanie zdarzeń do Google Analytics, należy zweryfikować poprawność instalacji GTM oraz sprawdzić, czy zmienne zostały poprawnie włączone. W tym celu należy przejść do narzędzia Tag Assistant – w tym celu klikamy przycisk z tekstem Podgląd (czerwone zaznaczenie na poniższym zrzucie ekranu).

  Źródło: tagmanager.google.com

  Kolejnym etapem jest podanie pełnego adresu URL podstrony, którą zamierzamy testować (np. https://ebrains.pl/). W miejscu tym konieczne jest podanie pełnego protokołu połączenia, pod którym możemy znaleźć domenę (https:// lub http://) oraz przedrostek WWW (o ile występuje w adresie domeny).

  Po udanym połączeniu z Tag Assistant zostaniemy przeniesieni na podstronę, której adres podaliśmy w poprzednim punkcie, dodatkowo w prawym dolnym rogu powinna pojawić się informacja o połączeniu:

  Źródło: tagmanager.google.com

  W tym momencie możemy kliknąć dowolny element strony (np. tekst znajdujący się na stronie), a następnie przejść do zakładki Tag Assistant (zielone zaznaczenie na poniższym zrzucie ekranu).

  W panelu po lewej stronie powinno pojawić się zdarzenie Click (zielone zaznaczenie na poniższym zrzucie ekranu).

  Źródło: tagmanager.google.com

  Jeżeli po lewej stronie nie znajduje się zdarzenie typu Click, należy spróbować kliknąć inny element, jeżeli w dalszym ciągu brakuje zdarzenia, możliwe, że w pierwszej kolejności konieczne będzie utworzenie tagu (co zostanie opisane w dalszej części artykułu).

  Zawartość zdarzenia Click w Tag Assistant

  Po przejściu do zdarzenia Click możemy sprawdzić, co zawiera element, który został kliknięty. W tym celu należy przejść do zakładki Variables, a następnie odnaleźć jedną ze zmiennych, które włączaliśmy w punkcie Konfiguracja zmiennych wbudowanych. Dla każdej zmiennej przypisana jest odpowiednia wartość:

  Źródło: tagmanager.google.com

  Kiedy jesteśmy pewni, że poprawnie wdrożyliśmy oraz skonfigurowaliśmy zmienne, możemy przejść do tworzenia nowego tagu – odpowiedzialnego za przekazywanie danych do Google Analytics.

  Tworzenie tagu przekazującego dane do Google Analytics

  Przechodząc do clou zagadnienia, tworzymy tag odpowiadający za przekazanie danych o kliknięciu linku zawierającego “mailto:” (śledzenie kliknięć w odnośniki umożliwiające przesłanie maila na podany adres).

  W narzędziu Google Tag Manager należy przejść do zakładki Tagi, a następnie kliknąć Nowy.

  Naszym oczom ukaże się panel konfiguracyjny nowego tagu. W pierwszej kolejności należy nadać nazwę nowemu tagowi, w naszym przypadku będzie to: “GA – Event – click email”. Następnie rozpoczynamy konfigurację tagu poprzez kliknięcie pola Konfiguracja tagu (zielone zaznaczenie na poniższym zrzucie ekranu).

  Źródło: tagmanager.google.com

  Z panelu po prawej stronie należy wybrać Google Analytics – Universal Analytics.

  Następnie konfigurujemy nowo dodany tag zgodnie z poniższymi podpunktami:

  • Typ śledzenia: Zdarzenie – w tym miejscu wybieramy typ śledzenia, w jaki będzie przekazywany do narzędzia Google Analytics.
  • Kategoria: email – jest to kategoria, jaka zostanie przekazana do Google Analytics.
  • Działanie: click – nazwa działania, która zostanie przesłana do narzędzia Analitycznego.
  • Etykieta: {{Page Path}} – w tym miejscu możemy zastosować zmienną, jaką będziemy chcieli przekazać do Google Analytics. W naszym przypadku wybraliśmy Page Path, ponieważ chcemy wiedzieć, na jakiej podstronie naszej domeny został kliknięty adres email (czy była to np. strona Kontakt, czy strona główna).
  • Wartość: w miejscu tym możemy przekazać dowolną wartość do narzędzia Google Analytics, jednak nie ma to zbyt dużego sensu.
  • Działanie niezwiązane z interakcją: Fałsz – nie chcemy, aby sesja z interakcją (kliknięcie adresu mailowego) była zaliczona jako odrzucenie.
  • Ustawienia Google Analytics: UA-xxxxxxx-x – w tym miejscu wybieramy naszą zmienną Google Analytics, jeżeli nie została ona jeszcze skonfigurowana, klikamy Nowa zmienna. Następnie przechodzimy do narzędzia Google Analytics, kolejno do zakładki Administracja (zielone zaznaczenie), Informacje o śledzeniu (pomarańczowe zaznaczenie), Kod śledzenia (kod śledzenia) i kopiujemy identyfikator śledzenia (czerwone zaznaczenie):

  Źródło: tagmanager.google.com

  Następnie identyfikator zmiennej podajemy jako nazwa zmiennej oraz identyfikator śledzenia (zgodnie z poniższym zrzutem ekranu):

  Źródło: tagmanager.google.com

  Gotowa konfiguracja tagu powinna wyglądać w następujący sposób:

  Źródło: tagmanager.google.com

  Konfiguracja reguł – kliknięcie elementu

  Ostatnim etapem konfiguracji tagu jest utworzenie reguły, która uruchomi wykonanie tagu.

  W celu utworzenia nowej reguły należy przejść do dolnej części konfiguracji tagu, a następnie dodać regułę:

  Źródło: tagmanager.google.com

  W kliknięciu zostaniemy przeniesieni na podstronę zawierającą domyślne reguły do wybrania. Interesuje nas jednak utworzenie nowej, niestandardowej reguły. W tym celu klikamy plus w prawym, górnym rogu ekranu i nadajemy nazwę dla nowej reguły (w naszym przypadku będzie to: Event – clicking mailto).

  Podczas konfiguracji nowej reguły wybieramy Tylko linki:

  Źródło: tagmanager.google.com

  Ostatnim etapem konfiguracji zmiennej jest zaznaczenie opcji Niektóre kliknięcia linków oraz wybór warunków uruchomienia (Click URL – zawiera – mailto:):

  Źródło: tagmanager.google.com

  W tym momencie mamy gotową konfigurację tagu Google Analytics wraz z regułami – możemy przejść do publikowania tagu. W tym celu należy przejść do widoku głównego narzędzia Google Tag Manager, a następnie kliknąć przycisk Prześlij (prawy, górny róg ekranu).

  Kolejnym etapem jest zapisanie zarówno nowych reguł, jak i tagu oraz przejście do testowania utworzonego tagu.

  Testowanie nowego tagu – przekazywanie danych do Google Analytics

  W celu przetestowania poprawności działania wdrożonego tagu Google Tag Manager należy przejść do narzędzia Google Analytics.

  Źródło: tagmanager.google.com

  W menu Czas rzeczywisty, Zdarzenia widnieją informacje o zdarzeniach przesłanych z menedżera tagów Google.

  Ostatnim etapem jest utworzenie celu w Google Analytics. Należy przejść do menu Administracja, następnie w podmenu Widok danych przejść do zakładki Cele, w której tworzymy nowy cel.

  Tworzenie celu w Google Analytics

  Konfigurację nowego celu rozpoczynamy standardowo – od nazwy. Następnie wybieramy typ celu, w naszym przypadku jest to Zdarzenie.

  Źródło: tagmanager.google.com

  Kolejnym etapem jest dobranie szczegółów celu, w tym podpunkcie należy kierować się tym, co umieściliśmy w konfiguracji tagu (Tworzenie tagu przekazującego dane do Google Analytics). W naszym przypadku jest to:

  • Kategoria: email
  • Działanie: click

  Źródło: tagmanager.google.com

  Dlaczego warto korzystać z Google Tag Manager?

  • Poprawa szybkości witryny

    Dzięki zmniejszonej liczbie wierszy kodu do wdrożenia i niezależnemu ładowaniu tagu szybkość witryny znacznie się zwiększa. Przed powstaniem GTM jedynym sposobem śledzenia danych było zdefiniowanie kodu Javascript określonego dla danego zdarzenia. Aby więc śledzić zakres konkretnych danych, wymaganych było wiele wierszy kodu, co miało niekorzystny wpływ na przepływ informacji, a więc również prędkość ładowania strony. Warto podkreślić, że element ten jest ważnym czynnikiem rankingowym, dlatego trzeba zwrócić na niego szczególną uwagę.

  • Łatwość użycia narzędzia i poprawa wydajności witryny

    Dzięki tak prostemu interfejsowi GTM oraz łatwej strukturze narzędzia można bez problemów konfigurować i wdrażać tagi bez tworzenia rozbudowanych sekwencji kodu. Usprawnia to również regularne dodawanie, aktualizowanie i usuwanie tagów, co korzystnie wpływa na wydajność witryny oraz poprawia jej wyniki.

  • Kontrolowanie tagów innych firm

    GTM jest w stanie obsługiwać tagi stron trzecich, takich jak Facebook, Twitter, Crazy Egg czy Hotjar. Obecnie kontroluje ponad 80 tagów innych firm, co czyni go jedną z najlepszych platform tego typu w sieci.

  • Brak konieczności zatrudniania programisty

    Dzięki zastosowaniu Google Tag Manager wyeliminowano potrzebę zatrudniania profesjonalnego programisty. Oczywiście nadal potrzeba go do wdrożenia głównego kodu i zdefiniowania warstwy danych. GTM umożliwia jednak skupienie się na podstawowych zadaniach i eliminuje konieczność zastosowania wielu innych środków.

  • Możliwość podglądu i debugowania

    Identyfikowanie błędów to bardzo ważny krok w prowadzeniu witryny. Niestety czynność ta od zawsze nie była łatwe. Dzięki GTM możesz jednak sprawdzić tag w trybie podglądu, aby upewnić się, że kod uruchamia i zbiera dane. Warto podkreślić, że nieprawidłowe wdrożenie tagów może utrudniać zbieranie danych, dlatego należy skorzystać z możliwości tego narzędzia i poprawić funkcjonowanie witryny.

  • Kontrola wszystkich wersji

    Podczas dodawania, aktualizowania lub usuwania tagów tworzona jest nowsza wersja obszaru obejmująca zmodyfikowane ustawienia. Mimo że wariant ten jest przesyłany do ponownej weryfikacji, można w dowolnym momencie wrócić do wcześniejszej formy i przywrócić poprzednią konfigurację do aktualnej wersji. Funkcja ta pozwala właścicielom witryn swobodnie modyfikować tagi i sprawdzać ich skuteczność.

  • Google Tag Assistant

    Google Tag Assistant to rozszerzenie dostępne w sklepie Chrome Play, którego zadaniem jest identyfikacja liczby aktualnie używanych tagów, sprawdzanie poprawności kodu i rozwiązywanie wszelkich problemów z instalacją znaczników. Narzędzie to pozwala zobaczyć tagi obecne na stronie. Te podświetlone na zielono są oznaczone jako gotowe do użycia. Kolor niebieski natomiast sugeruje wprowadzenie kilku zmian w celu poprawienia funkcjonowania znacznika. Barwa czerwona z kolei reprezentuje tag, który jest zupełnie nieskuteczny i wymaga naprawy lub całkowitego usunięcia.

  Podsumowanie

  Google Tag Manager to doskonałe narzędzie, które może ułatwić pracę niejednego twórcy strony internetowej. Jeśli więc chcesz mieć pełną kontrolę nad swoimi tagami, naprawić błędy i poznać strukturę kodu w witrynie, koniecznie z niego skorzystaj. GTM może znacznie poprawić funkcjonowanie strony internetowej, gdyż udostępnia informacje niezbędne do wprowadzenia ewentualnych poprawek. Nie czekaj więc i zastosuj menedżera tagów Google w swojej strategii już dziś!

  W przypadku pytań zapraszamy do skorzystania z formularzy naszej agencji SEO.

  Artykuł powstał we współpracy ze stronami: startmoto.pl, bellaplace.pl