Calendly is a tool for scheduling appointments and events. It eliminates the usual back-and-forth emails and messages involved in nailing downtime.
With this simple Event Listener, you can track Clendly conversions. Copy the code into your Google Tag Manager with the necessary configuration and you are ready to begin collecting those events when they trigger.
How to track Calendly form submissions with Google Tag Manager
You’ll need Google Tag Manager and the Calendly form submission event listener javascript code.
The benefit of tracking the conversion on your Calendly tool is enormous, but one of my favourites is using the data to measure conversions, build a marketing audience, and segment users for deeper targeting and marketing analysis.
The code
<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>
- Start by creating a custom HTML tag where you’ll paste the event listener code and fire it on pageview or DOM ready.
- The code makes it possible to listen to activities on the form.
- Create a custom event with the event name [calendly]
- Create a dataLayer variable [calendly_event] to collect the action performed on the form, such as (successful booking, profile_page_viewed, event_type_viewed)
- Based on user interaction with your Calendly app, any of the events above will fire.
- Connect your marketing tag(s) to this trigger to send events to your analytics platform like GA4.
- Trust But Verify (TBV). Test, test and debug
- Publish once everything is okay.
References: dumbdata.co and Julius Fedorovicius (original creator)
