Step-by-Step Guide to Track Calendly Events Using Google Tag Manager and Pass User Input Data to Enhanced Conversions

The Easy Way to Track and Tag User Behavior

The best way to set up tracking in Google Tag Manager (GTM) is to follow this structured approach:

1. Inspect the Data Layer Variables – Identify where the required data is stored.
2. Create Necessary Variables – Define variables in GTM to capture the data.
3. Create Triggers – Define the conditions under which the tags should fire.
4. Create Tags – Set up Google Analytics and Google Ads tags to send event data.

This structured approach ensures accurate tracking while making it easier to troubleshoot.

Step 1: Configure Calendly Settings

Before setting up tracking, modify your Calendly settings to pass data properly:

1. Open Calendly and navigate to the Event Type Settings.
2. Scroll to the Confirmation Page section.
3. Enable Redirect URL and enter the URL where users should land after booking.
4. Check the box for “Pass event details to your redirected page”.
   ✅ This ensures that booking details (e.g., email, phone number) are included in the URL.

Once this is enabled, Calendly will pass user details via URL parameters (e.g., ?invitee_email=example@gmail.com).

Step 2: Add the Calendly Listener

We need to add a Calendly listener in GTM to capture user interactions.

1. Go to GTM → Click Tags.
2. Click New → Select Custom HTML.
3. Name the tag cHTML – Calendly Listener.

Add the following code in the HTML section:

<script>
window.dataLayer = window.dataLayer || [];
window.addEventListener(‘message’,
  function(e) {
    if (e.data.event && e.data.event.indexOf(‘calendly’) === 0) {
      window.dataLayer.push({
        ‘event’ : ‘calendly’,
        ‘calendly_event’ : e.data.event.split(‘.’)[1]
      });
    }
  }
);
</script>

1. Set the Trigger to All Pages.
2. Click Save.

Testing

• Enable Preview Mode in GTM.
• Book an event in Calendly.

Check the Data Layer to ensure Calendly events are captured.

Step 3: Inspect the Data Layer

Calendly sends the following key events to the Data Layer when users interact with the booking form:

• page_height
• event_type_viewed
• date_and_time_viewed
• event_scheduled (when a booking is confirmed)

To ensure these events are available:

• Open Google Tag Manager Preview Mode.
• Complete a test booking in Calendly.

Inspect the Data Layer in the preview mode.

Step 4: Create Necessary Variables in GTM

We need to extract event names and user data from the Data Layer.

1. Capture Calendly Events

1. Go to GTM → Variables → Create a new Data Layer Variable.
2. Set Variable Name as calendly_event.

Save it as dlv_calendly_event (for easier identification).

Step 5: Set Up the Trigger

We now need to tell GTM to fire a tag whenever a Calendly event is detected.

1. Go to Triggers → Click New.
2. Select Custom Event as the trigger type.
3. In the Event Name field, type “calendly”.
4. Choose “All Custom Events”.
5. Name the trigger Calendly Event Trigger.
6. Click Save.

Now, this trigger will activate whenever GTM detects Calendly events in the Data Layer.

Step 7: Create Google Analytics Event Tag

Now, we track Calendly interactions in Google Analytics (GA4).

1. Go to Tags → Create a new tag.
2. Choose Google Analytics: GA4 Event.
3. Set your Google Analytics Measurement ID (store it in a constant variable).

For Event Name, enter:
CopyEdit
calendly_{{dlv_calendly_event}}

4. (This makes the event name dynamic).
5. Set the Trigger to Calendly Event Trigger.
6. Save and publish the tag.

Testing

• Enable Preview Mode in GTM.
• Book an event in Calendly and inspect the Data Layer.
• Ensure the tag fires correctly for each event.

Step 6: Extract User Data (Email & Phone)

Before proceeding with extracting user data, please check the Thank You page URL. This URL carries all user details, including their name, phone number, and email address.

1. Go to Google Tag Manager (GTM) Preview Mode.
2. Complete a test booking in Calendly.
3. Once redirected to the Thank You page, inspect the Data Layer.
4. Look for the Page URL variable that contains the redirected URL storing user data.

Identify the specific parameters (e.g., invitee_email, answer_1, invitee_name).

https://www.example.com/pages/thank-you? invitee_email=test@example.com& answer_1=1234567890&
invitee_name=John+Doe

Now, we extract these details using Custom JavaScript Variables.

Extract Email

1. Go to GTM → Variables → Create a Custom JavaScript Variable.
2. Name it JS – Extract Email.
3. Add the following JavaScript code:

function() {
  var params = new URL(window.location.href).searchParams;
  var email = params.get(‘invitee_email’);
  return email ? decodeURIComponent(email) : ”;
}

Extract Phone Number

1. Go to GTM → Variables → Create another Custom JavaScript Variable.
2. Name it JS – Extract Phone Number.
3. Add the following JavaScript code:

function() {
  var params = new URL(window.location.href).searchParams;
  var phone = params.get(‘answer_1’);
  return phone ? decodeURIComponent(phone).replace(/\s+/g, ”) : ”;
}

Step 7: Create a Trigger for Google Ads Conversion Tags

Before setting up the Google Ads Enhanced Conversion Tag, we need to ensure that it fires only when a Calendly event is scheduled.

To achieve this, we will create a trigger that activates only when calendly_event equals event_scheduled.

Steps to Create the Trigger:

1. Go to GTM → Click Triggers.
2. Click New to create a new trigger.
3. Select Custom Event as the trigger type.
4. In the Event Name field, type “calendly”.
5. Under “This trigger fires on”, select Some Custom Events.
6. Set the following condition:

dlv_calendly_event equals event_scheduled

7. Name the trigger Calendly Booking Completed Trigger.

Click Save.

Step 8: Create the Google Ads Enhanced Conversion Tag

Now, we pass the user input data to Google Ads.

1. Go to GTM → Click Tags.
2. Click New → Select Google Ads Conversion Tracking.
3. Enter your Conversion ID and Conversion Label.
4. Check Include user-provided data from your website.
5. Click New Variable → Manual Configuration.
6. Map the variables:
   • Email → JS – Extract Email
   • Phone Number → JS – Extract Phone Number
7. Set the trigger to Calendly Booking Completed Trigger.
8. Click Save.

Step 9: Final Check

• Ensure that the trigger fires only when a booking is completed.
• Use Preview Mode in GTM to validate that the tag works correctly.

Once validated, publish your changes in Google Tag Manager and start tracking conversions in Google Ads!

Final Note: Need More Support?

If you need any assistance with Google Tag Manager configurations, troubleshooting data not appearing in Google Analytics, or require a free audit of your setup, feel free to reach out to us.

📩 Email: hello@cortexlabs.digital
🌐 Website: cortexlabs.digital

We’re happy to help you optimize your tracking and ensure your Calendly event tracking and enhanced conversions work seamlessly!