Calendly Integration Field
The Calendly field lets you embed a Calendly scheduling widget directly inside your form. Instead of sending respondents to a separate Calendly page after they submit, they can book a time slot as part of the form-filling experience. This creates a seamless flow from information gathering to scheduling.
What the Calendly Field Does
The Calendly field renders an interactive Calendly widget inside your form. Respondents see your available time slots, pick a date and time, and confirm the booking without ever leaving the form. The selected booking details (date, time, and event type) are captured as part of the form response.
This is different from a simple Calendly link. The scheduling step is integrated into the form flow, which means you can collect information before the booking (like project details or budget range) and after the booking (like additional notes or file uploads) all in one submission.
Adding the Calendly Field to Your Form
- Open your form in the editor.
- In the field panel on the left, look under the Special or Integrations category.
- Click or drag the Calendly field onto your canvas.
- The field appears on the canvas with a placeholder. You will need to connect your Calendly account to activate it.
Connecting Your Calendly Account
To display your availability, the Calendly field needs your Calendly scheduling URL:
- Select the Calendly field on the canvas to open its settings.
- In the Calendly URL field, paste your scheduling link. This is the URL you share with people when you want them to book time with you, for example:
https://calendly.com/your-name/30min. - The widget preview updates immediately to show your available slots.
You can use any Calendly scheduling URL, including URLs for specific event types. If you paste your base Calendly URL (without a specific event type), respondents will see all your available event types and choose one.
Field Configuration
After connecting your Calendly URL, you can fine-tune the field:
- Event type: Link to a specific event type (for example, "30-Minute Consultation" or "Product Demo") so respondents only see that option.
- Hide event type details: Remove the event description and duration from the widget if you want a cleaner look. The information is still shown after booking.
- Primary color: Override Calendly's default accent color to match your form's theme.
- Text color: Adjust the text color for readability against your form background.
- Background color: Set the widget background to blend in with your form or contrast against it.
- Required: Mark the field as required so respondents must book a time before they can submit the form.
- Label and description: Add a custom label (for example, "Schedule Your Demo") and a help description above the widget.
How Booking Data Flows Into the Response
When a respondent selects a time slot and confirms the booking, the following data is captured in the form response:
- Event name: The name of the Calendly event type (for example, "30 Minute Meeting").
- Date and time: The exact date and time the respondent booked, in their local timezone and in UTC.
- Invitee name and email: The name and email the respondent entered in Calendly during booking.
- Calendly event URL: A link to the event on Calendly where you can view details, reschedule, or cancel.
This data appears alongside all other form fields in the Responses tab. It is also included in exports, webhook payloads, and integration data syncs.
Use Cases
The Calendly field is particularly useful for:
- Consultation booking: Collect project details, budget, and goals in the form, then let the respondent book a consultation call in the same flow.
- Demo scheduling: Qualify leads with a few screening questions, then offer a product demo booking right in the form.
- Interview scheduling: Job applicants submit their resume and details, then immediately book an interview slot.
- Appointment booking: Patients, clients, or students fill in intake information and book their appointment in one step.
- Event registration: Registrants sign up for an event and schedule a one-on-one session or breakout meeting at the same time.
Tips
- Place the Calendly field near the end of your form so respondents provide all necessary information before booking.
- Use conditional logic to show the Calendly field only when relevant. For example, show it only when a respondent selects "Yes, I would like a demo" in a previous question.
- If you use Calendly's pre-fill feature, WittyForm can pass the respondent's name and email from earlier form fields into the Calendly widget, so they do not have to enter the same information twice.