Calendly koppelen aan je website.

Calendly is software om afspraken te plannen. Je koppelt je agenda en een ander kiest zelf een moment dat past. Je maakt per soort afspraak een eigen type, zoals een intake van een kwartier of een demo van een uur, met eigen vragen in het boekingsformulier.

Voor veel dienstverleners is een geplande afspraak de belangrijkste lead die de website oplevert, concreter dan een contactformulier. Wij plannen zelf ook afspraken via Calendly, en weten dus waar het meten ervan schuurt.

Een afspraak plannen op je website kan via een link naar de pagina van Calendly, of via een embed in je eigen pagina. Voor het meten maakt dat veel uit.

Calendly heeft drie vormen van embed: inline in de pagina, een pop-up-widget als zwevende knop, en een pop-up achter een tekstlink of eigen knop. Alle drie laden het script widget.js van Calendly. Voor een pagina waarop het plannen de hoofdzaak is, kiezen wij inline, zodat de agenda deel is van je ontwerp en niet over je pagina heen valt.

Met prefill vul je het boekingsformulier vooraf in: naam (of voornaam en achternaam apart), e-mailadres, en de antwoorden op maximaal tien eigen vragen. Heeft een bezoeker eerder op je site een formulier ingevuld, dan hoeft hij zijn gegevens niet nog een keer te typen. Dubbele gegevens van het type afspraak verberg je met een parameter in de link, zodat titel en duur niet twee keer op de pagina staan.

De embed neemt de UTM-parameters uit de adresbalk van je eigen pagina vanzelf over: utm_source, utm_medium, utm_campaign, utm_content en utm_term, elk tot 255 tekens. Je kunt ze ook zelf meegeven in de code. Ze komen bij de boeking te staan, en dat is de basis voor de koppeling met je CRM.

Een embed staat in een iframe. Je eigen GA4-tag ziet niet wat de bezoeker daarin doet. Calendly lost dat op door berichten naar je pagina te sturen: bij het bekijken van een afspraaktype, bij het kiezen van een tijd, en na het plannen het bericht calendly.event_scheduled, met de unieke adressen van de afspraak en de genodigde. Op dat bericht laten wij de conversie in GA4 en Google Ads afgaan, via Google Tag Manager en binnen de toestemming die de bezoeker gaf.

Dat werkt alleen met een embed. Stuur je bezoekers met een link naar de pagina van Calendly, dan krijgt je site geen bericht en blijft alleen de klik op de knop over. Een klik is geen afspraak.

Calendly heeft daarnaast een eigen koppeling met GA4, met gebeurtenissen als invitee_meeting_scheduled. Die is snel aangezet, maar werkt met één metings-ID voor je hele organisatie en zonder Tag Manager. Gebruik je onze route, dan zetten we die koppeling uit, anders telt elke afspraak twee keer.

De Calendly API is versie 2 en werkt met een personal access token of met OAuth 2.0. Gegevens opvragen kan op elk abonnement. Webhooks en de Scheduling API, waarmee je boekingen via de API maakt, zijn er alleen op een betaald abonnement. Per gebruiker mag je 500 aanvragen per minuut doen op een betaald abonnement en 50 op het gratis abonnement.

Met een webhook meldt Calendly elke nieuwe boeking (invitee.created) en elke annulering (invitee.canceled) aan een adres op je eigen server, voor één gebruiker, een groep of de hele organisatie. Dat maakt de boeking bevestigd: wat in de browser gebeurt, kan door een adblocker wegvallen, wat Calendly aan je server meldt niet. Wie al met server-side tagging werkt, kan de bevestiging via dezelfde server doorzetten naar GA4.

Elke webhook krijgt van ons een signing key. Calendly zet daarmee een handtekening in de header Calendly-Webhook-Signature, en onze ontvanger controleert die, zodat niemand nepboekingen naar je CRM kan sturen.

De webhook bevat de adressen van de afspraak en de genodigde. Met die adressen haalt onze koppeling via de API de rest op: naam, e-mailadres, antwoorden op je vragen en de UTM-gegevens. Die komen als contact en activiteit in je CRM, bijvoorbeeld in HubSpot of Pipedrive, met de afspraak als volgende stap voor de verkoper.

De gclid zit daar niet bij, want Calendly heeft er geen veld voor. Wij lossen dat op in de browser: bij het bericht calendly.event_scheduled stuurt je pagina de gclid en het adres van de genodigde naar je eigen server. Komt de webhook binnen, dan koppelen we die twee op het adres van de genodigde. Zo staat de gclid bij de afspraak in je CRM.

Daarmee kan de afspraak later als offline conversie naar Google Ads, met de waarde die de klant uiteindelijk had, binnen 90 dagen na de klik. Ontbreekt de gclid, dan kan het via verbeterde conversies voor leads, met het e-mailadres van de genodigde, gehasht. Google raadt die route zelf aan voor wie begint.

Op WordPress zetten we de inline embed met de code van Calendly in een eigen blok, zodat hij in je ontwerp past en op elke pagina hetzelfde werkt. In de WordPress-bibliotheek staan plugins voor Calendly, maar die komen van andere makers dan Calendly. Voor een embed is geen plugin nodig, en voor het meten laten we de luisteraar op de berichten van Calendly in Tag Manager draaien.

Op een maatwerksite in Next.js wordt de embed een eigen component, die prefill en UTM-gegevens meekrijgt uit de pagina. De webhook komt binnen op een serverroute die de handtekening controleert, de gegevens ophaalt, de gclid erbij zoekt en de boeking doorzet naar je CRM en Google Ads.

Daarna testen we de conversie in GA4 en Google Ads met een boeking, een verzetting en een annulering. Het meten van afspraken, formulieren en offline conversies valt bij ons onder Data & Tracking.

Veelgestelde vragen