How to Embed Koalendar with an <iframe>
Koalendar 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 Koalendar using a basic iframe setup.
📑 Menu
📋 Step 1 – Copy your Koalendar link
- In your Koalendar dashboard choose the booking page you want to embed.
- Click Share and copy the URL (e.g.
https://koalendar.com/e/your-page
).
📝 Step 2 – Build & paste the iframe
Paste your link into the template below, then add the HTML to your site.
<iframe src="PASTE_YOUR_KOALENDAR_LINK_HERE?embed=true" width="100%" height="800px" frameborder="0"></iframe>
- If your link already contains a
?
, replace?embed=true
with&embed=true
. - Insert this code in any HTML / Embed / Code block your site builder provides, then save or publish.
Visitors will see your calendar immediately—no scripts required.
🛠️ Troubleshooting
Issue | Fix |
Nothing shows | Verify the full https:// URL is intact and published. |
Scrollbars appear | Increase height or add CSS overflow:hidden to the parent container. |
Page builder strips iframe | Some free plans disallow custom HTML—check your platform’s limitations. |
Looking for more embed styles—like Popup Widget or Popup Text/Button—or advanced parameters? Check: