Calendly offers several embed options that use JavaScript to control layout and behavior. But if your platform doesn’t support JavaScript—or only allows iframe content—you can still embed Calendly using a basic iframe setup.
This guide explains when to use the iframe option, how to set it up, and what limitations to expect.
When to use an iframe
Choose the iframe embed if:
- Your website builder doesn’t support JavaScript
- You’re embedding Calendly in a platform that blocks scripts (like some CMS tools or email previews)
- You only need a simple booking experience without tracking or customization
Tip: For more features like layout control, invitee pre-fills, and event tracking, use Calendly’s JavaScript embed options instead.
Set up an iframe embed
You can use any Calendly scheduling link inside an iframe. Here’s the basic format:
<iframe
src="https://calendly.com/YOUR_SCHEDULING_LINK"
style="width: 100%; min-width: 320px; height: 700px;"
frameborder="0">
</iframe>Replace YOUR_SCHEDULING_LINK with your actual link.
Example:
<iframe
src="https://calendly.com/jane-doe/30min"
style="width: 100%; min-width: 320px; height: 700px;"
frameborder="0">
</iframe>Layout tips
- Set min-width: 320px to support mobile devices
- Use at least height: 700px to avoid scrollbars
- Adjust the width or max-width to match your layout
What iframe-only embeds can’t do
Without JavaScript, the embed is more limited. You won’t be able to:
- Pre-fill the invitee’s name or email
- Track events like bookings
- Resize the widget automatically
- Hide profile pictures or the cookie banner
Some features require JavaScript support to work correctly.
Need more control?
If your platform allows it, switch to Calendly’s advanced embed options. These let you:
- Pre-fill invitee details
- Automatically adjust widget height
- Track events and UTM parameters
- Customize colors, styles, and labels