Śledzenie zdarzeń rezerwacji online

Zdarzenia, które możesz śledzić w Google Analytics, Google Tag Manager i Facebook Pixel oraz sposób konfiguracji integracji.

Konfiguracja odbywa się w sekcji Rezerwacja online - Ustawienia

Wystarczy podać jeden lub kilka kluczy. Śledzenie zdarzeń i wyświetleń stron odbywa się automatycznie.

Dostępne warianty:

Google Analytics (Na przykład: G-1234567890 / UA-1234567890)
Google Tag Manager (Na przykład: GTM-1234567890)
Facebook Pixel (Na przykład: 1234567890)

Google Tag Manager - zdarzenia niestandardowe

Wszystkie zdarzenia są wysyłane do window.dataLayer w następującej formie:

{
  event: '<event_name>',
  event_category: '<category>',
  // dodatkowe pola w zależności od zdarzenia
}

Pole event służy jako wyzwalacz w GTM, a event_category jest wygodne do grupowania w raportach.

general - zdarzenia ogólnego przeznaczenia

Zdarzenie	Kiedy się uruchamia
`app_load`	Załadowano formularz rezerwacji
`pageview`	Wyświetlono określoną stronę formularza rezerwacji (przekazuje `page_title`)

company - strony informacyjne firmy

Zdarzenie	Kiedy się uruchamia
`about_view`	Wyświetlono stronę "O firmie"
`license_view`	Wyświetlono stronę "Umowa oferty publicznej"
`privacy_view`	Wyświetlono stronę "Polityka prywatności"
`cancellation_policy_view`	Wyświetlono stronę "Polityka anulowania"

booking - tworzenie wizyty

Zdarzenie	Kiedy się uruchamia
`branch_select`	Wybrano oddział
`resource_select`	Wybrano zasób (specjalistę / pomieszczenie / sprzęt)
`service_select`	Wybrano usługę
`event_select`	Wybrano wydarzenie rezerwacji grupowej
`date_select`	Wybrano datę i godzinę wizyty
`record_create`	Wizyta została pomyślnie utworzona
`payment_success`	Płatność za wizytę przebiegła pomyślnie
`payment_expire`	Upłynął czas przeznaczony na płatność za wizytę

client - logowanie i konto osobiste

Zdarzenie	Kiedy się uruchamia
`client_signin`	Klient zalogowany
`client_update`	Zmiana danych klienta
`client_password_change`	Zmiana hasła klienta
`client_sms_resend`	Klient żąda ponownego wysłania SMS potwierdzającego
`rating_create`	Utworzono opinię do wizyty
`record_cancel`	Wizyta anulowana

memberships - abonamenty

Zdarzenie	Kiedy się uruchamia
`membership_created`	Abonament pomyślnie zakupiony
`membership_payment_success`	Płatność za abonament przebiegła pomyślnie

Facebook Pixel - zdarzenia standardowe

Facebook Pixel wysyła standardowe zdarzenia Meta z odpowiednim do kontekstu payloadem. To oddzielny strumień od niestandardowych zdarzeń GTM powyżej, więc w Meta Events Manager zobaczysz dokładnie te nazwy:

Zdarzenie	Kiedy się uruchamia
`ViewContent`	Wyświetlono kluczową stronę (o firmie, profil, rejestracja, płatność itp.)
`FindLocation`	Wyświetlono / wybrano oddział
`AddToCart`	Dodano usługę lub zasób do wizyty
`Schedule`	Wybrano datę i godzinę
`InitiateCheckout`	Rozpoczęto realizację wydarzenia grupowego
`Purchase`	Wizyta lub abonament utworzone i opłacone (jeśli płatność jest wymagana - uruchamia się po pomyślnej płatności; jeśli nie - w momencie utworzenia)

Uwaga: Facebook Pixel nie obsługuje waluty UAH, dlatego widget automatycznie zastępuje ją walutą EUR w parametrach zdarzenia. Inne waluty są przekazywane bez zmian.

Osadzanie widgetu na twojej stronie

Widget rezerwacji działa wewnątrz <iframe>, więc zdarzenia nie trafiają bezpośrednio do dataLayer strony hosta. Zamiast tego widget przekazuje każde zdarzenie do okna nadrzędnego za pomocą postMessage:

{
  event: 'pushGTMEvent',
  data: '<json-string z payloadem zdarzenia>'
}

Aby te zdarzenia pojawiły się w GTM / GA twojej strony, dodaj nasłuchującego. Ważne: zweryfikuj event.origin, aby akceptować tylko wiadomości z iframe widgetu - w przeciwnym razie dowolny inny iframe, osadzony widget lub rozszerzenie przeglądarki na twojej stronie może wstrzyknąć dowolne zdarzenia (w tym sfałszowany Purchase) do twojego dataLayer.

<script>
  // Origin, na którym hostowany jest widget Wlaunch. Zamień na swoją domenę widgetu, jeśli używasz własnej.
  var WLAUNCH_ORIGIN = 'https://w.wlaunch.net';
  window.addEventListener('message', function (event) {
    if (event.origin !== WLAUNCH_ORIGIN) return;
    if (!event.data || event.data.event !== 'pushGTMEvent') return;
    window.dataLayer = window.dataLayer || [];
    try {
      window.dataLayer.push(JSON.parse(event.data.data));
    } catch (e) {
      console.warn('Wlaunch: nie udało się sparsować payloadu pushGTMEvent', e);
    }
  });
</script>

Po tym wszystkie zdarzenia z powyższych tabel będą dostępne w kontenerze GTM strony hosta.

Jak zweryfikować, że zdarzenia docierają

Sprawdzenie origin: w DevTools potwierdź, że host atrybutu src iframe odpowiada wartości WLAUNCH_ORIGIN w powyższym listenerze. Jeśli serwujesz widget z własnej domeny, odpowiednio zaktualizuj WLAUNCH_ORIGIN.
Google Tag Manager: otwórz tryb Preview w GTM i przejdź przez widget - zdarzenia powinny pojawić się w zakładce Data Layer.
Google Analytics 4: raport Realtime powinien pokazać aktywnego użytkownika i zdarzenia w ciągu 1-2 minut.
Facebook Pixel: zainstaluj rozszerzenie Chrome Meta Pixel Helper - wyświetla wszystkie zdarzenia wysłane z bieżącej strony.
DevTools: w konsoli przeglądarki window.dataLayer zawiera wszystkie zdarzenia GTM; w zakładce Network filtr collect łapie ruch GA, a tr/? ruch Facebook Pixel.