Dëgjoni ngjarjet e widget-it të rezervimeve në faqen tuaj

Pasi widget-i i rezervimeve vendoset në faqen tuaj të internetit, ai i tregon faqes çfarë po bën klienti brenda tij: hapjen dhe mbylljen e panelit, çdo ekran të rezervimit, çdo përgjigje dhe vetë rezervimin. Secila prej tyre është një ngjarje shfletuesi në window, kështu që zhvilluesi juaj — ose kushdo që kujdeset për Google Tag Manager-in tuaj — mund të ndërtojë një hinkë rezervimesh, të ndryshojë faqen kur dikush rezervon ose t'i dërgojë hapat në çdo mjet analitike.

Ngjarjet

Çdo ngjarje i mbart të dhënat e saj në event.detail. Dy fusha janë gjithmonë aty: company — vlera e data-company në kodin tuaj për përfshirje — dhe booking_type: reservation për tavolinat, appointment për shërbimet.

Dëgjoni një ngjarje

Shtoni një skript në të njëjtën faqe me widget-in, me window.addEventListener dhe emrin e ngjarjes. Mund ta vendosni para ose pas kodit për përfshirje. Ky shembull fsheh një baner „Rezervo tani“ sapo konfirmohet një rezervim:

<script>
  window.addEventListener('taptime:booking', function (event) {
    if (event.detail.confirmed) {
      document.getElementById('book-banner').hidden = true;
    }
  });
</script>

confirmed është true kur rezervimi konfirmohet menjëherë, dhe false kur është një kërkesë që ekipi juaj duhet ta pranojë ende. value, bashkë me currency, është çmimi i shërbimit për një takim ose, për një tavolinë, vlera për rezervim që keni vendosur për gjurmimin e konvertimeve — dhe null kur nuk ka as njërën, as tjetrën.

Ekranet dhe përgjigjet

taptime:step e emërton ekranin në detail.step. Cilat ekrane i sheh klienti varet nga ajo që rezervon dhe nga cilësimet tuaja:

• location — klienti zgjedh një nga vendndodhjet tuaja. Vetëm kur keni disa dhe widget-i nuk është i lidhur me njërën prej tyre.
• party — sa persona. Vetëm për tavolinat.
• service dhe specialist — çfarë rezervohet dhe me kë. Vetëm për takimet.
• when — dita dhe ora.
• seating, zone dhe table — brenda ose jashtë, një zonë e sallës, një tavolinë e caktuar. Vetëm për tavolinat, dhe vetëm zgjedhjet që keni aktivizuar.
• details — emri dhe të dhënat e kontaktit të klientit.
• done — ekrani i konfirmimit, pasi bëhet rezervimi.

step_index dhe step_count janë numrat që klienti sheh në krye të formularit, si te „2 nga 5“. Lista e vendndodhjeve dhe ekrani i konfirmimit nuk numërohen, ndaj aty të dyja janë null. Meqë numri i ekraneve varet nga cilësimet tuaja, kontrolloni emrin e hapit, jo numrin.

taptime:choice e emërton përgjigjen në detail.field: branchId, partySize, date, time, seating, zoneId, tableId, serviceId ose specialistId. detail.value është ajo që u zgjodh — një numër, një ID, një datë si 2026-09-18 ose një orë si 2026-09-18 19:30 — dhe detail.label është ajo që klienti lexoi në buton, si emri i një shërbimi ose i një vendndodhjeje. Kur zgjidhet „cilido“, dërgohet vlera null.

Dërgoni çdo ngjarje në Google Tag Manager

Një dëgjues i vetëm te taptime:event i kap të gjitha. Skripti më poshtë e shton secilën në dataLayer si taptime_open, taptime_step, taptime_choice e kështu me radhë, bashkë me fushat e detail. Ngjiteni në një etiketë Custom HTML që aktivizohet në të gjitha faqet, ose drejtpërdrejt në faqen tuaj. Pastaj ndërtoni aktivizues, variabla dhe një hinkë në Tag Manager pa e prekur më faqen.

<script>
  window.dataLayer = window.dataLayer || [];
  window.addEventListener('taptime:event', function (event) {
    window.dataLayer.push(Object.assign({ event: 'taptime_' + event.detail.event }, event.detail));
  });
</script>

Shembuj të tjerë

Dërgojeni çdo ekran në Google Analytics 4 si ngjarje më vete, që të shihni në një eksplorim hinke ku ndalen klientët. Për këtë, GA4 duhet të jetë i instaluar në faqen tuaj me gtag.js:

<script>
  window.addEventListener('taptime:step', function (event) {
    if (typeof gtag !== 'function') return;
    gtag('event', 'booking_step', {
      step: event.detail.step,
      step_index: event.detail.step_index,
      booking_type: event.detail.booking_type
    });
  });
</script>

Ofroni një mënyrë tjetër për të rezervuar kur një klient e mbyll panelin pa rezervuar — këtu, duke shfaqur një bllok të fshehur „Na telefononi“:

<script>
  var booked = false;
  window.addEventListener('taptime:booking', function () {
    booked = true;
  });
  window.addEventListener('taptime:close', function () {
    if (!booked) {
      document.getElementById('call-us').hidden = false;
    }
  });
</script>

Kontrolloni që funksionon

1. 1
   Hapni faqen tuaj të publikuar

   Shumë ndërtues faqesh nuk e ekzekutojnë kodin e personalizuar në redaktuesin e tyre, ndaj përdorni faqen e publikuar.

2. 2
   Hapni konsolën e shfletuesit

   Klikoni me të djathtën mbi faqe, zgjidhni Inspect (Inspekto), pastaj hapni skedën Console.

3. 3
   Ngjitni rreshtin më poshtë dhe shtypni Enter

   Ai shfaq çdo ngjarje të widget-it në çastin që ndodh. Vlen derisa ta rifreskoni faqen.

4. 4
   Bëni një rezervim provë

   Çdo ekran dhe çdo përgjigje shfaqen në konsolë, pastaj rezervimi. Më pas anulojeni rezervimin provë nga tabela.

window.addEventListener('taptime:event', function (event) { console.log(event.detail.event, event.detail); });