Google Tag Manager (GTM-XXXXXXX) im Smart-Widget

Erstellt von Calenso Support, Geändert am Wed, 10 Apr 2024 um 03:03 PM von Calenso Support

Das neue intelligente Calenso Buchungswidget (Smart-Widget) ist als iFrame verfügbar. Dieses Widget unterstützt die folgenden GTM Tracking Events.

Tracking der Terminbuchung (Events)

appointment_booking_start (Erste Benutzerinteraktion, kann auch später getriggert werden)
appointment_booking_step_questions_start (Schritt: Buchungsfragen vor dem Buchungsprozess)
appointment_booking_step_questions_end (Schritt: Buchungsfragen vor dem Buchungsprozess)
appointment_booking_step_meetings_start (Schritt: Auswahl Meeting-Anbieter)
appointment_booking_step_meetings_end (Schritt: Auswahl Meeting-Anbieter)
appointment_booking_step_stores_start (Schritt: Filialenauswahl)
appointment_booking_step_stores_end (Schritt: Filialenauswahl)
appointment_booking_step_services_start (Schritt: Auswahl von Dienstleistungen)
appointment_booking_step_services_end (Schritt: Auswahl von Dienstleistungen)
appointment_booking_step_resources_start (Schritt: Mitarbeiter/Ressourcen Auswahl)
appointment_booking_step_resources_end (Schritt: Mitarbeiter/Ressourcen Auswahl)
appointment_booking_step_available_appointments_start (Schritt: Terminbuchung, freie Zeitfenster)
appointment_booking_step_available_appointments_end (Schritt: Terminbuchung, freie Zeitfenster)
appointment_booking_step_personal_data_start (Schritt: Buchungsformular, Persönliche Daten)
appointment_booking_step_personal_data_end (Schritt: Buchungsformular, Persönliche Daten)
appointment_booking_step_summary (Schritt: Zusammenfassung)
appointment_booking (Terminbuchung initialisiert)
appointment_booking_step_success (Buchung erfolgreich)
appointment_booking_step_failed (Fehler bei der Buchung)

Tracking vom Umfragen (Events)

survey_start_step (Schritt: Start der Umfrage)
survey_step_X (Nummer der Schritte, dynamisch)
survey_last_step (Letzer Schritt, erfolgreicher Abschluss der Umfrage

Cross-Domain Tracking von iFrames

Damit das iFrame Widget innerhalb von einer Landingpage mit anderer Domain getrackt werden kann, muss folgender Aufbau in der Webseite verwendet werden. Das iFrame sendet, somit die Tracking Events and die Parent-Landingpage. Diese Landingpage kann diese Events danach weiterverarbeiten oder an GTM übermitteln.

<script>
   function onLoadIframe() {
       const frame = document.getElementById('smart-widget-obj');
       console.log('Inside onLoadIframe()');
       setTimeout(function() {
           console.log('Inside onLoadIframe() before firing');
           frame.contentWindow.postMessage({
               name: 'from parent to child',
               eventName: 'PARENT_TO_CHILD_WEBSITE_EVENT'
           }, '*');
       }, 3000);
   }    
   
   window.addEventListener('message', (eventData) => {
       if (eventData.data.event === 'CALENSO_CHILD_TO_PARENT_EVENT') {
           console.log('Calenso Tracking Data is ', eventData.data.step);
       }
   });
   
</script>

<iframe id="smart-widget-obj" src="LINK_ZUM_WIDGET" height="1000px" width="100%" scrolling="no" allowfullscreen onload="onLoadIframe()"></iframe>