One of the most powerful ways to convert chat visitors into real meetings is by embedding a Calendly scheduling widget directly inside the chat window. Instead of sending visitors a link and hoping they follow through, the AI chatbot detects when someone wants to book a meeting, triggers the Calendly action, and displays an interactive calendar right inside the conversation. Visitors pick a time and confirm the booking without ever leaving the chat. This guide walks you through the complete setup for Calendly and Cal.com scheduling actions in Social Intents.
Why Embed Scheduling in Chat?
Sending a scheduling link in a chat message works, but it introduces friction. The visitor has to click the link, wait for a new tab to open, navigate the calendar page, and then potentially lose context from the conversation. At every step, there is a chance they abandon the process.
Embedding the Calendly widget directly in the chat eliminates those drop-off points. The calendar loads inline as part of the conversation flow. The visitor selects a time, enters their details, and confirms - all within the same chat window. The result is significantly higher booking rates compared to link-based approaches.
Here are the key benefits:
- No context switching - Visitors stay in the chat window throughout the entire booking process.
- Lower abandonment - Fewer steps between expressing interest and confirming a meeting means fewer drop-offs.
- AI-driven timing - The chatbot embeds the calendar at exactly the right moment, when the visitor has expressed intent to book.
- Professional experience - The embedded widget looks polished and branded, fitting naturally into the chat interface.
- Works with existing Calendly setup - You use your existing Calendly event types, availability settings, and integrations. Nothing changes on the Calendly side.
Requisitos previos
Before setting up the Calendly action, you need:
- A Calendly account - Any Calendly plan works, including the free tier. You need at least one event type created and published.
- Your Calendly scheduling URL - This is the URL for the specific event type you want visitors to book. It looks like
https://calendly.com/your-username/30-minute-meeting. You can find this on your Calendly dashboard by clicking the event type and copying the scheduling link. - A Social Intents widget with AI chatbot enabled - The scheduling action requires an AI chatbot to detect when the visitor wants to book a meeting. See Build Your First AI Chatbot if you have not set one up yet.
Configuración paso a paso
Navigate to AI Actions
Log in to socialintents.com and go to My Widgets. Select the widget you want to add Calendly booking to. Click AI Actions in the left sidebar, then click Add Action.
Select the Action Type
From the Action Type dropdown, select Show Button or Iframe Only. This action type does not require an API endpoint - it simply displays visual content (in this case, the Calendly widget) in the chat.
Name the Action
Enter a descriptive name like Book_Demo_Meeting o Schedule_Consultation. The name helps the AI identify the action and differentiate it from other actions on the widget.
Write the Trigger Description
In the When to use field, describe when the chatbot should show the Calendly widget. Be specific about the kinds of visitor requests that should trigger the scheduling embed. Here are examples:
"Use this action when the visitor wants to book a meeting, schedule a demo, set up a consultation call, arrange a phone call, or requests to speak with someone at a specific time. Also trigger when the visitor asks about availability, wants to see the calendar, or says they want to schedule something."
If you have multiple event types (e.g., a 15-minute intro call and a 30-minute demo), create separate actions for each with distinct triggers:
Intro call: "Use this action when the visitor wants a quick introductory call, wants to learn about our product briefly, or asks for a short call to understand what we do."
Demo: "Use this action when the visitor wants a full product demo, asks to see the product in action, or requests a walkthrough of specific features."
Set the Triggered Response
In the Triggered response field, enter the message the visitor sees just before the Calendly widget appears:
- "Great! Here's our calendar - you can pick a time that works for you:"
- "I'd be happy to help you schedule a demo. Choose a time below:"
- "Here's our availability. Go ahead and book a slot that works for your schedule:"
Enable Show Action Button
Check the Show action button in response checkbox. This enables the button and iframe configuration fields.
Enter Your Calendly URL
In the Button URL field, paste your Calendly scheduling URL. This is the URL for the specific event type you want visitors to book:
https://calendly.com/your-username/30-minute-meeting
Make sure you use the direct event type URL, not your general Calendly profile URL. The event type URL includes the event slug after your username.
Enable Embed as Iframe
Check the Embed as iframe instead of button checkbox. This is the key setting that makes the Calendly widget appear inside the chat rather than as a link that opens in a new tab. When this is enabled, the Calendly scheduling interface loads directly within the chat window, allowing visitors to select a time and book without leaving the conversation.
Configure Optional Settings
Consider these optional settings:
- Trigger only once per session - Check this to prevent the Calendly widget from appearing multiple times if the visitor mentions scheduling again. Once they have seen the calendar, they do not need to see it again.
- Button Label - If you are using button mode instead of iframe, set the label to something like "Book a Meeting" or "Schedule a Demo." In iframe mode, this field is not visible to the visitor but serves as internal documentation.
Save and Test
Click Save Action. Open your chat widget in a browser and type something like "I'd like to schedule a demo." Verify that the chatbot responds with your triggered message and the Calendly widget appears inline in the chat window. Try selecting a time slot to confirm the booking flow works end to end.
Setting Up Cal.com
Cal.com is an open-source alternative to Calendly. The setup process in Social Intents is identical - the only difference is the URL you enter in the Button URL field.
Get Your Cal.com Event URL
Log in to your Cal.com account and navigate to your event type. Copy the scheduling URL, which looks like:
https://cal.com/your-username/30-minute-meeting
Follow the Same Steps
Follow the same steps outlined above for Calendly, but paste your Cal.com URL in the Button URL field instead. All other settings - action type, trigger description, iframe embedding - are identical.
Cal.com event types with custom questions, required fields, and team scheduling all work with the iframe embed. The embedded view displays the same interface visitors would see on your Cal.com pages.
Advanced Configuration
Pre-Filling Visitor Information
Calendly supports URL parameters that pre-fill the booking form with visitor information. If your chatbot has already collected the visitor's name and email during the conversation, you can pass that data to Calendly so they do not have to re-enter it.
Add query parameters to your Calendly URL:
https://calendly.com/your-username/30-minute-meeting?name=John+Doe&email=john@example.com
In a standard AI Action configuration, the Button URL is static - it uses whatever URL you entered during setup. For dynamic pre-filling, you would need a Call API Request action that constructs the Calendly URL with the visitor's data and returns it, or use a webhook that generates a personalized booking link.
Multiple Event Types
If you offer different meeting types (intro calls, product demos, technical consultations), create a separate action for each event type. Each action points to a different Calendly event URL and has its own trigger description:
| Action Name | Event Type | Trigger Description |
|---|---|---|
Book_Intro_Call | 15-min intro call | "Visitor wants a quick introductory call or brief overview" |
Book_Product_Demo | 30-min product demo | "Visitor wants to see the product, requests a demo or walkthrough" |
Book_Technical_Review | 45-min technical review | "Visitor has integration questions, wants a technical deep-dive or architecture review" |
The AI matches the visitor's intent to the most appropriate event type and shows the right calendar.
Team Scheduling
If you use Calendly's team scheduling features (round robin, collective events, or group events), use the team event URL instead of an individual event URL. The iframe embeds the team scheduling view with combined availability:
https://calendly.com/team/sales-demo
This is particularly useful when multiple sales reps or support engineers share availability for the same event type.
Combining Calendly with Lead Capture
A powerful pattern is to combine the Calendly action with a CRM lead capture action. Create two actions on the same widget:
- CRM Lead Capture (Call API Request) - Triggered when the visitor shares their contact information. Sends the data to HubSpot, Salesforce, or your CRM.
- Calendly Booking (Show Button or Iframe Only) - Triggered when the visitor wants to schedule a meeting. Embeds the Calendly widget.
During a typical conversation, the AI might first capture the lead (when the visitor shares their email), and then show the calendar (when they ask to schedule a meeting). Both actions fire independently at the right moment in the conversation.
Customizing the Calendly Embed Appearance
Calendly provides URL parameters that control the appearance of the embedded widget:
| Parameter | Value | Effect |
|---|---|---|
hide_event_type_details | 1 | Hides the event description, duration, and location details from the booking page |
hide_gdpr_banner | 1 | Hides the GDPR cookie consent banner |
background_color | hex code (no #) | Sets the background color, e.g., ffffff |
text_color | hex code (no #) | Sets the text color |
primary_color | hex code (no #) | Sets the accent/button color |
Example URL with customization parameters:
https://calendly.com/your-username/30-minute-meeting?hide_event_type_details=1&primary_color=2563eb
In a chat embed, hiding event type details can be helpful because the chat context has already explained what the meeting is about. The visitor does not need to see the event description again.
Troubleshooting
Calendly widget does not appear in the chat
Make sure Embed as iframe instead of button is checked. Also verify that Show action button in response is checked - without this, the iframe fields are hidden and the URL is not rendered.
Calendly widget loads but shows an error
Double-check the Calendly URL. It should be the direct event type URL (e.g., https://calendly.com/username/event-type), not your Calendly dashboard URL or profile URL. Make sure the event type is published and active in Calendly.
Action triggers at the wrong time
Review the When to use trigger description. Make it more specific to scheduling-related language. Add negative instructions if other actions are interfering: "Do NOT use this action when the visitor is asking about pricing, support, or general product questions."
Widget appears multiple times
Enable Trigger only once per session to prevent the Calendly widget from showing up again after the visitor has already seen it. This is a common issue when the visitor continues to discuss scheduling after the widget has appeared.
Booking confirmation is not visible
After the visitor selects a time and confirms in the Calendly widget, the confirmation message appears within the iframe. If the iframe is too small, the visitor may need to scroll within it to see the confirmation. The chat widget adjusts iframe height automatically in most cases, but complex Calendly forms with many custom questions may require scrolling.
Preguntas frecuentes
Does the visitor need a Calendly account to book?
No. Visitors book meetings through your Calendly event type, which is a public scheduling page. They enter their name, email, and any required custom fields - no Calendly account is needed on their end.
Can I use this with Calendly's free plan?
Yes. Calendly's free plan supports one event type, which is sufficient for embedding in chat. The iframe embed works with all Calendly plans.
Do Calendly notifications still work?
Yes. All of your existing Calendly notification settings - email confirmations, reminders, calendar invites - work exactly as they do for any Calendly booking. Embedding the widget in chat does not change Calendly's behavior.
Can visitors reschedule or cancel from the chat?
Rescheduling and cancellation links are sent via Calendly's confirmation email. The visitor would use those links to modify the booking. The chat widget itself does not provide reschedule or cancel functionality - that is handled by Calendly's standard email workflow.
Does this work on mobile browsers?
Yes. The Calendly iframe is responsive and adapts to the chat widget size on mobile devices. The date and time selection interface adjusts to smaller screens. The booking experience is fully functional on both desktop and mobile.
Can I track which bookings came from the chatbot?
Calendly tracks the source of bookings through UTM parameters. You can add UTM parameters to your Calendly URL to tag bookings that originate from the chat widget:
https://calendly.com/your-username/30-minute-meeting?utm_source=chatbot&utm_medium=live_chat&utm_campaign=website
These parameters appear in your Calendly analytics and any connected integrations (CRM, marketing tools, etc.).
What to Read Next
- What Are AI Actions? - Overview of all action types and how they work.
- Showing Buttons, Links & Embedded Content - Learn about other iframe and button options beyond scheduling.
- Capturing Leads to HubSpot, Salesforce & Dynamics 365 - Combine calendar booking with CRM lead capture.
- Custom API Actions - Build custom integrations for advanced scheduling workflows.