Calendly

Attribution does not have a native Calendly connector, but you can track Calendly bookings (demo calls, consultations, meetings, etc.) as conversion events by embedding the Calendly widget on your website and listening for booking events via JavaScript.

Why Embed Instead of Link

⚠️

Do not use direct links to calendly.com

Links like https://calendly.com/your-team/meeting take visitors away from your website. Once they leave, Attribution loses tracking context — the visitor's cookies and session data are no longer accessible, and the booking cannot be attributed to a marketing channel.

Always use Calendly's embedded widget instead. The widget loads inside an iframe on your domain, keeping the visitor on your site and preserving Attribution's tracking cookies throughout the booking flow.

Prerequisites

• Attribution tracking snippet installed on your website
• A Calendly account with at least one event type set up

Step 1: Add the Calendly Widget

Add the Calendly widget script and an inline embed container to your page:

<!-- Calendly widget script -->
<script src="https://assets.calendly.com/assets/external/widget.js" async></script>

<!-- Container for the inline widget -->
<div id="calendly-embed" style="min-width: 320px; height: 700px;"></div>

Then initialize the widget with JavaScript:

Calendly.initInlineWidget({
  url: 'https://calendly.com/your-team/meeting',
  parentElement: document.getElementById('calendly-embed'),
});

Replace your-team/meeting with your actual Calendly event type URL.

If you have previously identified the visitor (e.g. from a login or form submission), you can optionally pre-fill their details in the Calendly widget:

Calendly.initInlineWidget({
  url: 'https://calendly.com/your-team/meeting',
  parentElement: document.getElementById('calendly-embed'),
  prefill: {
    email: '[email protected]',
    name: 'Jane Doe',
  },
});

Step 2: Track Booking Events

Calendly fires postMessage events when visitors interact with the widget. Listen for these events and track them in Attribution:

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

window.addEventListener('message', function (e) {
  if (!isCalendlyEvent(e)) return;

  if (e.data.event === 'calendly.date_and_time_selected') {
    // Visitor selected a time slot
    Attribution.track('Calendly: Time Selected');
  }

  if (e.data.event === 'calendly.event_scheduled') {
    // Booking confirmed
    Attribution.track('Calendly: Event Scheduled');
  }
});

Available Calendly Events

📘

Attribution and Segment are fully compatible

If you already use Segment on your website, any analytics.track() and analytics.identify() calls automatically flow into Attribution. You do not need to install the Attribution snippet separately — Segment acts as the data transport.

Questions or Issues

Contact [email protected] if you need help setting up Calendly tracking.