The Calendly block allows your flow visitors to book meetings with you directly from your heyflow and even copy the name and e-mail address or other invitee questions directly from the contact form.
How to set it up
Step 1: Insert your meeting link
From the blocks tab, drag the Calendly block into your heyflow. Enter the URL of your Calendly meeting link or the meeting name in the editing panel, and your Calendly booking page will immediately appear in the preview.
For regular meeting types, you can use:
full URL with account name:
https://calendly.com/heyflow-accountfull URL with account name/meeting type:
https://calendly.com/heyflow-account/check-inaccount name, which allows the user to select the meeting type:
heyflow-accountaccount name/meeting type:
heyflow-account/check-in
For round robin meeting types, they require a specific link format, which makes the set-up slightly different. Use the following URL format, including /d/:id and without the slug after the following section: https://calendly.com/d/cxxx-8ny-hx6 (this is only an example).
Step 2: Pass values from Heyflow to Calendly
Set the values you would like to pass from the flow to Calendly. Before mapping the values, make sure to set up system labels for the inputs you want to pass to Calendly.
Activate the option Pass values to Calendly to adjust the default options email and name.
If you want to pass more values, you can activate the option Add Invitee questions. You can now map your Calendly invitee questions to the according Heyflow value.
Publish your heyflow and you're good to go!
❗ Note: Information entered inside Calendly cannot be passed back to your heyflow.
💡 Tip: If you first make the calendar booking and then refer to the flow, set a forwarding to the flow in the calendar, where you also pass the event details. You can find more information on this in Calendly
Your link would have to look something like this: https://heyflow.id/book-meeting-test?assigned_to=Heyflow[…]261&invitee_full_name=Name&invitee_email=test%40test.com. Now you simply need to set up the variables as set in the URL. Take a look here for more information.
Edit options
General
General
Navigate after scheduling: If you use your Calendly block within your Heyflow, you can choose between different navigation options that are triggered as soon as someone has booked a meeting appointment. For example, you can either redirect to a specific screen or to a website.
Pass values to Calendly: Pass the variables for Name and Email to Calendly to have these values prefilled when visitors try to book a meeting. You can select from all your system labels.
Spacing
Spacing
Width: You can use this to adjust the maximum spread of the block and choose between S, M, L and maximum width.
Top, Bottom, Left and Right: You can use these options to set the distance to all sides. To do this, either use the slider or specify the exact number of pixels.
Appearance
Appearance
Visibility: Here you can select whether the block is only displayed in the mobile or desktop version or whether it is hidden completely.
Background colour: You can select a colour to be used as the background for the block.
Alternative: Redirect via URL
If you do not want to use our Calendly block, you can also redirect your Calendly via the URL already pre-populating information from your flow on to the scheduling page.
Simply insert a Link, Submit or Universal Button to insert a redirect URL. Now add your meeting link and insert the variables from your flow, which you would like to see when redirecting to your scheduling page.
🔎 Learn here how to use inputs from your flow via variables when redirecting to a URL.
Calendly gives some predefined labels, which you can use to prefill the information
Name | Adds the invitee's name as a single field on the scheduling page | e.g: name=John%20Doe |
First name | Adds the invitee's first name as a single field | e.g. first_name=John |
Last name | Adds the invitee's last name as a single field | e.g. last_name=Doe |
Adds the invitee's email address | e.g. email=JohnDoe@acme.com |
But you can also include custom question responses, simply specify the question number (e.g. "a1", "a2"...) followed by the response, e.g. a1=@phone
🔎 Take a look here for more information from Calendly.