Tracking Dineplan Bookings In GA4 Using Google Tag Manager

To track Dineplan bookings in GA4, add your GTM container ID in Dineplan, then create a custom event trigger and tag in GTM.

First, you need to add your Google Tag Manager (GTM) Container ID to your Dineplan account.

  1. Log into Dineplan.
  2. Navigate to "Settings" in the left-hand menu.
  3. Go to "Booking Calendar Settings" in the right-hand menu.
  4. Enter your GTM container ID into the "Google Tag Manager Code" field. (You can find your unique container ID by logging into your GTM account.)
  5. Save your changes.
Once a person completes a booking, this event will be fired back to your GTM account.

Google Tag Manager Setup

To track bookings in GA4, you'll need to create a trigger for the custom event (dpWidgetCompleteNew) and a tag that fires this event to GA4.

This ensures bookings via the Dineplan widget appear in your GA4 account under "Events."

Note: Share this setup information with your SEO, Analytics, or Web team.

Create A Tag In GTM

First, you need to crate a tag in your Google Tag Manager account.

  1. Log into Google Tag Manager.
  2. Click on "Tags."
  3. Click "New Tag."
  4. Choose the tag type "Google Analytics: GA4 Event."
  5. Enter your Measurement ID from Google Analytics 4 under Admin > Data Streams.
  6. Enter the "Event Name". (The event name can be anything, for example: "dp_widget_booking".)
  7. Save your changes.
This tag will fire an event called "dineplan_widget_booking" to Google Analytics 4 when triggered.

Set Up A Trigger In GTM

The next step is to create a trigger in Google Tag Manager.

  1. Click on "Triggers."
  2. Select "New Trigger."
  3. Choose the "Custom Event" trigger type.
  4. Enter the "Event Name" as "dpWidgetCompleteNew" (This must be exact).
  5. Select "All Custom Events."
  6. Save your changes.

Test And Publish

  1. Use the preview mode to test the tag and trigger.
  2. Ensure everything is working and firing correctly.
  3. Publish the container once you're satisfied with the setup.

 

dpWidgetFrame - the event is triggered whenever the frame is loaded (whenever someone loads a page with the booking widget on it)
dpWidgetCompleteNew - the event is triggered when the event is completed, when someone has moved through all the steps of the widget. This is a confirmed booking / conversion.