Dark mode
Track Calendly bookings in Usermaven

Track Calendly bookings in Usermaven

Open in ChatGPT Open in Claude

Since Usermaven doesn't currently support direct webhook integrations from Calendly, you can reliably track bookings using client-side tracking. Here are two easy methods: Thank-You-Page Redirect and Inline Widget Listener. Choose the method that suits your workflow best.


What you need

  • A published Calendly event type.

  • Usermaven browser tracking script installed on all relevant pages.

  • Access to edit your website (to add JavaScript or create a new page).


Method A – Thank-You-Page redirect (minimal code)

Redirect users to a dedicated confirmation page after booking.

Step 1: Create a confirmation page

  • Example URL: https://yourwebsite.com/booking-confirmed.html

  • Ensure the Usermaven tracking script is installed.

  • Add this JavaScript snippet after the Usermaven script:

<script>
  function captureCalendlyBooking() {
    const params = new URLSearchParams(location.search);
    usermaven('track', 'calendly_booking', {
      calendly_event_uuid: params.get('event_type_uuid'),
      calendly_event_name: params.get('event_type_name'),
      invitee_email: params.get('invitee_email'),
      invitee_full_name: params.get('invitee_full_name'),
      event_start_time: params.get('event_start_time'),
      //utm_source: params.get("utm_source"), //optional
      //utm_medium: params.get("utm_medium"), //optional
      //utm_campaign: params.get("utm_campaign") //optional
    });
  }

  if (typeof usermaven === 'function') {
    captureCalendlyBooking();
  } else {
    document.addEventListener('usermaven:ready', captureCalendlyBooking);
  }
</script>

Step 2: Enable redirect in Calendly

  • Go to your Calendly event settings → Confirmation Page.

  • Select "Redirect to an external site."

  • Enter your confirmation page URL.

  • Check "Pass event details to your redirected page."

  • Save your changes.

Step 3: Test

  • Make a test booking.

  • Check Usermaven's "Custom events" page for the calendly_booking event.

Choose this method if:

  • Your booking flow starts on Calendly’s hosted or pop-up page.

  • You prefer a branded thank-you page.


Method B – Inline widget listener (JavaScript)

Use this method if you embed Calendly directly on your webpage and don't want to redirect users to a thank-you page.

Step 1: Add event listener script

Ensure Usermaven script is already installed on your Calendly page. Add this JavaScript snippet after the Usermaven script:

<script>
  function isCalendlyEvent(e) {
    return e.origin === 'https://calendly.com' && e.data && e.data.event;
  }

  window.addEventListener('message', function (e) {
    if (isCalendlyEvent(e) && e.data.event === 'calendly.event_scheduled') {
      const payload = e.data.payload;
      if (typeof usermaven === 'function') {
        usermaven('track', 'calendly_booking', {
          calendly_event_name: payload.event_type?.name,
          calendly_event_uuid: payload.event_type?.uri.split('/').pop(),
          invitee_email: payload.invitee?.email,
          invitee_full_name: payload.invitee?.name,
          event_start_time: payload.event?.start_time,
          utm_source: payload.tracking?.utmSource,
          utm_medium: payload.tracking?.utmMedium,
          utm_campaign: payload.tracking?.utmCampaign,
        });
      }
    }
  });
</script>

Step 2: Test

  • Make a test booking using your embedded Calendly widget.

  • Check Usermaven's "Custom events" page for the calendly_booking event.

Choose this method if:

  • Calendly is embedded inline on your site.

  • You prefer users to remain on the current page.


Common questions

Question

Answer

Does this work for group events?

Yes, but confirm specific data points via testing.

Can I add UTM parameters?

Yes, include UTMs in your Calendly booking links; both methods support capturing these parameters.

Will tracking duplicate if I use both methods?

Use only one method per booking flow to avoid duplicates.


Troubleshooting checklist

  • No events in Usermaven: Ensure Usermaven tracking script loads before your custom snippet, verify no JavaScript errors, and check network requests for tracking events.

  • Missing parameters (Method A): Confirm redirect and "Pass event details" are correctly enabled in Calendly. Verify URL parameters in browser.

  • Inline widget issues (Method B): Ensure script and widget are on the same page; log Calendly's payload data to verify fields.


Next steps

  • Define calendly_booking as a conversion goal in Usermaven.

  • Build funnels (e.g., Pricing Page → Booking Page → Calendly Booking).

  • Track channels and sources where bookings are coming from in 'Attribution' module.

That's it! You're ready to accurately track every Calendly booking with Usermaven.

Was this article helpful?