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, w tym Google Analytics, Google Ads i Google Marketing Platform. Dowiedz się więcej o tagu Google.

Z tego przewodnika dowiesz się, jak zintegrować tag Google z systemem zarządzania treścią (CMS) lub kreatorem stron internetowych, aby umożliwić 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 kreatorów stron internetowych, którzy chcą zapewnić użytkownikom integrację z usługami pomiarowymi Google. Ten przewodnik nie jest przeznaczony dla użytkowników systemów CMS ani kreatorów stron internetowych.

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, takich jak identyfikator pomiaru czy identyfikator konwersji, które użytkownicy dodają do kodu pomiaru w swojej witrynie.

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

Przegląd

Aby zintegrować swoją platformę z usługami Google:

1. Utwórz integrację z tagiem Google.
2. Zaktualizuj strukturę danych wejściowych użytkownika.
3. Zaimplementuj interfejs API do zarządzania zgodą użytkowników
4. Skonfiguruj dane zdarzeń.
5. Sprawdź zaktualizowaną integrację.
6. Zaktualizuj instrukcje wdrożenia 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ą gtag.js) na każdej stronie swojej witryny. Zanim utworzysz integrację z gtag.js, usuń wszystkie dotychczasowe integracje starszych tagów (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, takich jak remarketing, za pomocą parametru allow_ad_personalization_signals (więcej informacji znajdziesz w artykule Wyłączanie zbierania danych dotyczących reklam spersonalizowanych.
• Idealnie fragment kodu tagu Google powinien występować tylko raz na stronie. Fragment kodu może zawierać wiele identyfikatorów tagów. Jeśli istnieje już instancja gtag.js, dodaj nowe identyfikatory tagów do istniejącego tagu. Więcej informacji.

Aktualizowanie struktury danych wejściowych użytkownika

Twoi klienci powinni mieć możliwość podania wielu form identyfikatora tagu Google w jednym interfejsie, niezależnie od tego, którą usługę pomiarową Google wdrażają.

Na przykład poniżej znajdziesz prosty przykład danych wejściowych tagu Google. Integracja powinna być traktowana jako wdrożenie tagu Google. Można to opisać jako metodę wdrażania Google Ads i Google Analytics.

Na diagramie poniżej pokazujemy, jak platforma może mieć oddzielne ścieżki użytkownika w przypadku Analytics i Ads, ale każda ścieżka prowadzi do jednego interfejsu, w którym użytkownicy podają identyfikator tagu Google.

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

Implementowanie interfejsu API do zarządzania zgodą użytkowników (czyli trybu uzyskiwania zgody)

Tag Google ma wbudowany interfejs API do zarządzania zgodą użytkowników. Może on odróżniać zgodę użytkownika na pliki cookie na potrzeby reklam od zgody na potrzeby analizy.

Oczekiwany rezultat to zintegrowanie wywołania gtag('consent', 'update' {...}) bez konieczności podejmowania przez klienta żadnych działań. Powinno to zapewnić, że tagi Google (Google Ads, Floodlight, Google Analytics, tag łączący konwersje) będą mogły odczytać najnowszy stan zgody użytkownika i uwzględnić go w żądaniach sieciowych wysyłanych do Google (za pomocą parametru &gcs).

Dodatkowe kroki implementacji polegają na wdrożeniu lub pomocy reklamodawcom we wdrożeniu (np. za pomocą interfejsu) stanu gtag('consent', default' {...}) oraz odblokowaniu tagów Google (czyli bez warunkowego uruchamiania na podstawie zgody), aby umożliwić uruchamianie ich w trybie uzyskiwania zgody w sposób uwzględniający ustawienia zgody użytkownika.

Szczegółowe informacje o implementacji znajdziesz w artykule Zarządzanie ustawieniami zgody (internet).

Konfigurowanie danych zdarzeń

Powinieneś wysyłać bogate dane zdarzeń z witryny klienta na jego konto Google bez konieczności podejmowania przez klienta żadnych działań. Możesz na przykład dodać zdarzenia wzdłuż ścieżki zakupu (czyli add_to_cart, begin_checkout, add_payment_info, add_shipping_info i purchase), generowania leadów i rejestracji.

Oto sprawdzone metody dodawania zdarzeń:

• Rejestruj wszystko, co możliwe.
• Skonfiguruj co najmniej 8 podstawowych zdarzeń.
• Nadaj priorytet zdarzeniom e-commerce.

Rejestrowanie wszystkiego, co możliwe

Tam, gdzie to możliwe, skonfiguruj zdarzenia domyślnie. Obejmuje to m.in.:

• Kluczowe zdarzenia, takie jak purchase czy sign_up.
• Zdarzenia poprzedzające kluczowe zdarzenia, takie jak add_to_cart.
• Interakcje behawioralne, takie jak interakcje z mediami, które pomagają klientom zrozumieć, jak angażują swoich użytkowników.

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

Zdarzenia są wysyłane za pomocą polecenia event. Obejmuje to ten sam identyfikator dewelopera tagu Google, który został dodany do globalnego tagu witryny opisanego powyżej:

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

Możesz na przykład użyć polecenia event, aby wysłać zdarzenie login z wartością method równą „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 specyficzny dla Twojej platformy. Dołączaj ten 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 do usuwania duplikatów.
• Chociaż niektóre parametry są opcjonalne, zalecamy, aby do każdego zdarzenia dołączać jak najwięcej dostępnych informacji.
  • Parametry podają dodatkowe informacje na temat sposobów, w jakie użytkownicy wchodzą w interakcje z Twoją witryną lub aplikacją. Gdy np. ktoś ogląda sprzedawany przez Ciebie produkt, możesz uwzględnić parametry opisujące ten produkt, takie jak nazwa, kategoria czy cena.
  • Niektóre parametry automatycznie wypełniają gotowe wymiary i dane w Google Analytics oraz pomagają użytkownikom lepiej zrozumieć swoich klientów.

Jeśli chcesz mierzyć kluczowe zdarzenie na podstawie kliknięcia (np. kliknięcia przycisku lub dynamicznej odpowiedzi witryny 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>

Konfigurowanie co najmniej 8 podstawowych zdarzeń

Zalecamy skonfigurowanie podstawowego zestawu zdarzeń, które mają największą wartość 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 na zakupy. 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 rozpoczyna proces płatności za co najmniej 1 produkt. 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 kupuje 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 się rejestruje, aby 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 wizytę.

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

Dodatkowe rekomendacje

Google obsługuje wiele innych zdarzeń i parametrów, zwłaszcza w przypadku e-commerce. Ogólnie zalecamy rejestrowanie tych informacji:

• Każde zdarzenie sukcesu bezpośrednio powiązane z wartością.
• Zdarzenia sukcesu, które przyczyniają się do podstawowych kluczowych zdarzeń (add_to_cart, sign_up itp.).
• Zaangażowanie i interakcje użytkowników, które pomagają reklamodawcom zrozumieć, jak angażują swoich użytkowników.

Poniżej znajdziesz dodatkowe materiały, które szczegółowo wyjaśniają rejestrowanie zdarzeń:

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

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

Sprawdzanie zaktualizowanej integracji

Zanim wprowadzisz zmiany w środowisku produkcyjnym, sprawdź zgodność z tymi elementami:

• Tag Google z miejscem docelowym w Google Analytics.
• Tag Google na potrzeby remarketingu i pomiaru konwersji.

Dodatkowo za pomocą jednego z tych narzędzi sprawdź, czy tag uruchamia się prawidłowo na wszystkich stronach, w tym na stronach kluczowych zdarzeń:

• Google Tag Assistant: Tag Assistant pozwala sprawdzić, które tagi Google zostały uruchomione i w jakiej kolejności. Tryb debugowania w usłudze Tag Assistant pokazuje, jakie dane są przekazywane do warstwy danych i jakie zdarzenia wywołały tę wymianę informacji.
• Narzędzia dla programistów w Chrome: użyj karty Sieć, aby filtrować żądania zawierające „google” i sprawdzić, jak są wysyłane dane.
• (Po stronie serwera) Raport w czasie rzeczywistym w Google Analytics: utwórz bezpłatne konto Google Analytics i użyj raportu W czasie rzeczywistym , aby sprawdzić, czy serwery Google otrzymują dane z tagu.

Aby zgłosić błąd lub przesłać opinię na temat brakujących informacji, wypełnij formularz pomocy dotyczącej systemu zarządzania treścią.

Jeśli to możliwe, udostępnij Google dostęp testowy na potrzeby ciągłej weryfikacji.

Aktualizowanie instrukcji wdrożenia dla użytkowników

Zaktualizuj dokumentację, aby zawierała jasne instrukcje dotyczące implementowania usług pomiarowych Google za pomocą Twojej implementacji. Udostępnij nam wersję roboczą tych instrukcji, wypełniając formularz opinii na temat dokumentacji konfiguracji integracji z systemem CMS , abyśmy mogli przesłać Ci opinię.