Integracja tagu Google z systemem CMS lub kreatorem witryn

Tag Google to fragment kodu, który można dodać do witryny, aby mierzyć aktywność użytkowników w różnych usługach Google, m.in. w Google Analytics 4, Google Ads i Google Marketing Platform. Więcej informacji o tagu Google

Z tego przewodnika dowiesz się, jak zintegrować tag Google z systemem zarządzania treścią (CMS) lub kreatorem witryn, aby zapewnić użytkownikom dostęp do usług pomiarowych Google.

Odbiorcy

Ten przewodnik jest przeznaczony dla właścicieli systemów zarządzania treścią (CMS) lub twórców witryn, którzy chcą udostępnić użytkownikom integrację z usługami pomiarowymi Google. Ten przewodnik nie jest przeznaczony dla użytkowników systemu CMS ani kreatora witryn.

Zanim zaczniesz

Upewnij się, że masz identyfikator dewelopera tagu Google. Jeśli nie masz identyfikatora dewelopera tagu Google, wypełnij formularz prośby o identyfikator dewelopera tagu Google. Identyfikator dewelopera różni się od innych identyfikatorów, np. identyfikatora pomiaru lub identyfikatora konwersji, które użytkownicy dodają do kodu pomiarowego swojej witryny.

Uwaga: identyfikatory dewelopera są wymagane tylko wtedy, gdy tworzysz implementację, która będzie używana w wielu witrynach przez niepowiązane ze sobą firmy lub podmioty. Jeśli implementacja będzie używana przez jedną witrynę lub jeden podmiot, nie ubiegaj się o identyfikator dewelopera.

Omówienie

Aby zintegrować platformę z usługami Google, wykonaj te czynności:

1. Tworzenie integracji z tagiem Google
2. Aktualizowanie struktury danych wprowadzanych przez użytkownika
3. Wdrażanie interfejsu Consent API
4. Konfigurowanie danych zdarzenia
5. Weryfikowanie zaktualizowanej integracji
6. Aktualizowanie instrukcji wdrażania dla użytkowników

Tworzenie integracji z tagiem Google

Dzięki integracji z tagiem Google Twoi klienci mogą wdrażać usługi pomiarowe Google (za pomocą tagu gtag.js) na każdej stronie swojej witryny. Przed utworzeniem integracji z gtag.js usuń wszystkie dotychczasowe integracje tagów starszej wersji (np. analytics.js).

Aby utworzyć integrację z tagiem Google, zastąp dotychczasowy fragment kodu tym fragmentem. Upewnij się, że użytkownicy mogą zastąpić TAG_ID własnym identyfikatorem tagu.

<!-- Google tag (gtag.js) -->
<script async src="https://www.googletagmanager.com/gtag/js?id=GOOGLE_TAG_ID"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('set', 'developer_id.<developer ID>', true); // Replace with your Google tag Developer ID
  gtag('js', new Date());

  gtag('config', 'GOOGLE_TAG_ID');
</script>

Pamiętaj:

• Reklamodawcy mogą zrezygnować z funkcji personalizacji reklam, np. remarketingu, za pomocą parametru allow_ad_personalization_signals (patrz Wyłączanie zbierania danych do kierowania reklam spersonalizowanych).
• Najlepiej, gdy fragment kodu tagu Google pojawia się na stronie tylko raz. Fragment kodu może zawierać wiele identyfikatorów tagów. Jeśli masz już instancję gtag.js, dodaj do niej nowe identyfikatory tagów. Więcej informacji

Zaktualizuj strukturę danych wejściowych użytkowników

Twoi klienci powinni mieć możliwość podania różnych form identyfikatora tagu Google w jednym interfejsie niezależnie od wdrażanej usługi pomiarowej Google.

Poniżej podano przykład prostego tagu Google. Integracja powinna być przedstawiona jako wdrożenie tagu Google. Możesz to nazwać metodą wdrażania Google Ads i Google Analytics.

Na diagramie poniżej widać, jak platforma może mieć oddzielne przepływy danych dla Analytics i Google Ads, ale każdy z nich prowadzi do jednego interfejsu, w którym użytkownicy podają identyfikator tagu Google.

Dane identyfikatora tagu powinny akceptować wiele wariantów identyfikatora za pomocą wyrażenia regularnego pattern [A-Z]{1,3}\w{5,}[\w]*

wdrożyć interfejs Consent API (nazywany też trybem uzyskiwania zgody).

Tag Google ma wbudowany interfejs API zgody, który służy do zarządzania zgodą użytkownika. Umożliwia ona rozróżnienie zgody użytkownika na pliki cookie na potrzeby reklam od tych na potrzeby analityki.

Oczekiwanym efektem jest to, że klienci otrzymują co najmniej integrację z usługą gtag('consent', 'update' {...}) bez konieczności podejmowania przez nich jakichkolwiek działań. Dzięki temu tagi Google (Google Ads, Floodlight, Google Analytics, tag łączący konwersje) mogą odczytywać najnowszy stan zgody użytkownika i uwzględniać go w żądaniach sieciowych wysyłanych do Google (za pomocą parametru &gcs).

Dodatkowe kroki implementacyjne to wdrożenie lub pomoc dla reklamodawców w wdrożeniu (np. za pomocą interfejsu użytkownika) stanu gtag('consent', default' {...}) i odblokowanie tagów Google (czyli brak uruchamiania warunkowego na podstawie zgody), aby umożliwić trybowi uzyskiwania zgody ich uruchamianie w sposób uwzględniający zgodę.

Szczegółowe informacje o wdrożeniu znajdziesz w artykule Zarządzanie ustawieniami zgody użytkownika (internet).

Konfigurowanie danych zdarzeń

Musisz wysyłać bogate dane zdarzeń z witryny klienta na jego konto Google bez konieczności podejmowania przez niego żadnych działań. Możesz na przykład dodać zdarzenia na ścieżce do zakupu (np. add_to_cart, begin_checkout, add_payment_info, add_shipping_info i purchase), zwiększaniem liczby potencjalnych klientów oraz rejestracją użytkowników.

Oto sprawdzone metody dodawania zdarzeń:

• Rejestruj wszystko, co możliwe
• Skonfiguruj co najmniej 8 głównych zdarzeń
• Priorytety zdarzeń e-commerce

Rejestruj wszystko, co możliwe

W miarę możliwości konfiguruj zdarzenia domyślnie. Obejmuje to m.in.:

• kluczowe zdarzenia, np. purchase lub sign_up;
• Zdarzenia poprzedzające kluczowe zdarzenia, np. add_to_cart
• Interakcje behawioralne, np. interakcje z mediami, pomagające klientom zrozumieć, w jaki sposób angażują użytkowników

Fragmenty kodu kluczowych zdarzeń należy dodawać tylko do stron kluczowych zdarzeń (np. potwierdzenia zakupu lub potwierdzenia przesłania formularza). Pamiętaj, że i tak musisz dodać tag Google do każdej strony witryny.

Zdarzenia są wysyłane za pomocą polecenia event. Dotyczy to tego samego identyfikatora programisty tagu Google, który został podany w tagu strony globalnej opisanym powyżej:

gtag('event', 'my_event', {
  'developer_id.<developer ID>': true,
  // Additional event parameters
});

Możesz np. użyć polecenia event, aby wysłać zdarzenie login o wartości method „Google”:

gtag('event', 'login', {
  'developer_id.<developer ID>': true,
  'method': 'Google'
});

<!-- Event snippet for sales conversion page -->
<script>
  gtag('event', 'conversion', {
      'developer_id.<developer ID>': true,
      'value': <value>,
      'currency': '<currency>',
      'transaction_id': '<transaction_id>'
  });
</script>

Pamiętaj:

• Twój identyfikator dewelopera <developer ID> jest unikalny i powiązany z Twoją platformą. Dołącz identyfikator do każdego zdarzenia.
• Te parametry są opcjonalne i można je pominąć:
  • 'value' to wartość liczbowa kluczowego zdarzenia (np.cena zakupu).
  • 'currency' to trzyliterowy kod waluty, przydatny dla reklamodawców, którzy akceptują wiele walut.
  • 'transaction_id' to unikalny identyfikator transakcji (np. identyfikator zamówienia); służy on do unikania duplikatów.
• Chociaż niektóre parametry są opcjonalne, zalecamy podawanie jak największej ilości informacji o każdym zdarzeniu.
  • Parametry dostarczają dodatkowych informacji o sposobach, w jakie użytkownicy wchodzą w interakcje z Twoją witryną lub aplikacją. Gdy np. ktoś wyświetla sprzedawany przez Ciebie produkt, możesz dodać parametry opisujące ten produkt, np. nazwę, kategorię i cenę.
  • Niektóre parametry automatycznie wypełniają gotowe wymiary i dane w Google Analytics, umożliwiając użytkownikom lepsze poznanie ich klientów.

Jeśli chcesz mierzyć kluczowe zdarzenie na podstawie kliknięcia (np. kliknięcia przycisku lub dynamicznej odpowiedzi w witrynie korzystającej z AJAX), możesz też użyć tego fragmentu kodu:

<!-- Event snippet for sales conversion page
    In your HTML page, add the snippet and call gtag_report_conversion
    when someone clicks on the chosen link or button. -->
<script>
  function gtag_report_conversion(url) {
  var callback = function () {
    if (typeof(url) != 'undefined') {
      window.location = url;
    }
  };
  gtag('event', 'conversion', {
    'developer_id.<developer ID>': true,
    'value': <value>,
    'currency': '<currency>',
    'transaction_id': '<transaction_id>',
    'event_callback': callback
  });
  return false;
}
</script>

Skonfiguruj co najmniej 8 podstawowych zdarzeń

Zalecamy skonfigurowanie podstawowego zestawu zdarzeń, które są najbardziej przydatne dla właścicieli witryn. Zalecamy skonfigurowanie co najmniej tych zdarzeń:

• view_item_list: gdy użytkownik wyświetla listę produktów (np. listę produktów). Więcej informacji

  gtag('event', 'view_item_list', {
    item_list_id: "related_products",
    item_list_name: "Related products",
    items: [{
      item_id: "SKU_123",
      item_name: "Test Item",
      currency: "USD",
      discount: 2.22,
      price: 99.9,
      quantity: 1
    }]
  });
  

• add_to_cart: gdy użytkownik dodaje co najmniej 1 produkt do koszyka. Więcej informacji

  gtag('event', 'add_to_cart', {
    value: 99.0,
    currency: "USD",
    items: [{
      item_id: "SKU_123",
      item_name: "Test Product",
      price: 99.0,
      currency: ‘USD’,
      quantity: 1,
      item_category: "All Products"
    }]
  });
  

• begin_checkout: gdy użytkownik inicjuje proces płatności za jeden lub więcej produktów. Więcej informacji

  gtag('event', 'begin_checkout') {
    value: 99.0,
    currency: "USD",
    items: [{
      item_id: "SKU_123",
      item_name: "Test Product",
      price: 99.0,
      currency: ‘USD’,
      quantity: 1,
      item_category: "All Products"
    }]
  });
  

• purchase: gdy użytkownik kupi co najmniej 1 produkt lub usługę. Więcej informacji

  gtag('event', 'purchase', {value: XX, currency: 'USD', items: [{xx},{xx}]});
  

• sign_up: gdy użytkownik rejestruje się, aby użytkownik końcowy mógł zobaczyć najpopularniejsze metody rejestracji (np. konto Google, adres e-mail). Więcej informacji

  gtag('event', 'sign_up', {method: 'web'});
  

• generate_lead: gdy użytkownik przesyła formularz. Więcej informacji

  gtag('event', 'generate_lead', {value: XX, currency: 'USD'});
  

• subscribe: gdy użytkownik subskrybuje usługę lub newsletter.

  gtag('event', 'subscribe', {value: XX, currency: 'USD', coupon: 'XX'});
  

• book_appointment: gdy użytkownik rezerwuje spotkanie.

  gtag('event', 'book_appointment', {value: XX, currency: 'USD', coupon: 'XX'});
  

Dodatkowe rekomendacje

Google obsługuje znacznie więcej zdarzeń i parametrów, zwłaszcza w przypadku e-commerce. Ogólnie zalecamy zdjęcie tych elementów:

• Wszelkie zdarzenia sukcesu bezpośrednio powiązane z wartością
• Zdarzenia sukcesu, które przyczyniają się do kluczowych zdarzeń (add_to_cart, sign_up itp.).
• interakcji i interakcji użytkowników, które pomagają reklamodawcom zrozumieć, jak angażują użytkowników;

Oto dodatkowe materiały, które pomogą Ci lepiej zrozumieć rejestrowanie zdarzeń:

• Zdarzenia
• Zalecane zdarzenia według przypadku użycia
• Pomiar e-commerce w usługach w Google Analytics 4

Chcemy omówić potencjalne rozszerzenia tego schematu, więc daj nam znać, jeśli masz jakieś sugestie.

Weryfikowanie zaktualizowanej integracji

Zanim wdrożysz zmiany w wersji produkcyjnej, sprawdź ich zgodność z tymi elementami:

• Twój tag Google z miejscem docelowym Google Analytics 4
• tag Google do remarketingu i pomiaru konwersji.

Sprawdź też, czy tag uruchamia się prawidłowo na wszystkich stronach, w tym na stronach kluczowych zdarzeń, korzystając z jednego z tych narzędzi:

• Google Tag Assistant: to rozszerzenie pozwala zobaczyć, które tagi Google zostały wywołane i w jakiej kolejności. Tryb debugowania rozszerzenia Tag Assistant pokazuje, jakie dane są przekazywane do warstwy danych i jakie zdarzenia wywołały tę wymianę danych.
• Narzędzia dla deweloperów w Chrome: na karcie Sieć możesz filtrować żądania zawierające „google”, aby sprawdzić, jak są wysyłane dane.
• (Po stronie serwera) Raport Google Analytics Czas rzeczywisty: utwórz bezpłatne konto Google Analytics i użyj raportu Czas rzeczywisty, aby sprawdzić, czy tagi są odbierane przez serwery Google.

Aby zgłosić błąd lub przesłać opinię o brakujących informacjach, wypełnij formularz pomocy systemu zarządzania treścią.

W miarę możliwości udostępnij Google dostęp testowy na potrzeby ciągłej weryfikacji.

Aktualizowanie instrukcji wdrażania dla użytkowników

Zaktualizuj dokumentację, aby zawierała jasne instrukcje implementacji usług Google Measurement. Udostępnij nam wersję roboczą tych instrukcji, wypełniając formularz Sprawdzanie dokumentacji konfiguracji integracji z CMS, abyśmy mogli przekazać opinię.