Our online scheduler triggers the following custom GTM events:

• dc-service-scheduler-hit: Indicates a user has interacted with the scheduler.
• dc-service-option: Captures the service option selected.
• dc-service-wait_or_drop: Tracks user decision on waiting or dropping.
• dc-service-date: Captures the selected appointment date.
• dc-service-time: Captures the selected appointment time.
• dc-service-phone_number: Tracks phone number entry.
• dc-service-partial_conversion: Indicates a user has started but not completed the booking.
• dc-service-booked: Indicates a completed booking.
• dc-service-bailed: Tracks users who abandoned the process.

To act on these events, Google Tag Manager (GTM) needs to be configured with triggers and tags that respond to these custom event names. For example, when the dc-service-booked event is fired, it should send conversion data to Google Analytics.

Steps to Configure in GTM

1. Create Triggers for Custom Events:

   • Navigate to the Triggers section in GTM.
   • Create a new trigger for each event (e.g., dc-service-scheduler-hit, dc-service-option, dc-service-wait_or_drop, etc.).
   • Set the trigger type to Custom Event.
   • Enter the corresponding event name (e.g., dc-service-scheduler-hit) in the "Event Name" field.
   • Save the trigger.

2. Create Tags for Each Event:

   • Navigate to the Tags section in GTM.
   • Create a new tag for Google Analytics.
   • Choose the tag type, e.g., Google Analytics: GA4 Event or Universal Analytics Event, depending on your setup.
   • For each custom event, map additional event parameters as needed (e.g., service type, date, or time).
   • For the dc-service-booked event, configure the tag to send conversion data to Google Analytics.
   • Link each tag to its corresponding trigger.
   • Save the tags.

3. Publish the GTM Container:

   • Once the triggers and tags are configured for all events, publish the changes in GTM to make them live.

Testing the Integration Using GTM Preview Mode

Before publishing, use GTM's Preview mode to verify the integration and ensure everything is working as expected:

1. Activate Preview Mode:

   • In GTM, click the Preview button in the top right corner.
   • Enter the URL of the scheduler widget. Make sure this is the direct link and not the website the widget is embedded.
     

2. Trigger Events on Your Website:

   • Interact with the online scheduler to trigger the custom events (e.g., make a booking to fire the dc-service-booked event).

3. Verify Events in GTM Debug Console:

   • In the GTM debug console, check that the custom events appear in the Summary panel under Event Name.
   • Ensure the corresponding tags (e.g., Google Analytics tag for dc-service-booked) are firing when the events occur.

4. Verify Data in Google Analytics:

   • Open Google Analytics in a separate window.
   • Check the Real-Time section to confirm that the events are being received.

Desired Outcome

When a specific event is fired (e.g., dc-service-booked for completed bookings), the corresponding GTM tag triggers an action, such as sending event data to Google Analytics. Using Preview mode ensures accurate configuration and allows for debugging before deploying the changes live. This setup enables detailed tracking and analysis of user interactions with your online scheduler.