Schedulingcalendar.google.com
Can you embed Google Calendar in an iframe?
Yes, with the embed code from Integrate calendar. Make the calendar public so visitors can see the events.
Checked Test again
Live check
Two links, two results
Calendar appEmbeddable
calendar.google.com/calendar/u/0/r- X-Frame-Options
- Not sent
- CSP frame-ancestors
- Not sent
- Response
- 403 Forbidden · 123 ms · HTTPS
Embed URLEmbeddable
calendar.google.com/calendar/embed?src=en.usa%23holiday%40group.v.calendar.google.com- X-Frame-Options
- Not sent
- CSP frame-ancestors
- Not sent
- Response
- 200 OK · 133 ms · HTTPS
Steps
How to embed Google Calendar
- On a computer, open Google Calendar. The mobile app cannot make embed code.
- At the top right, clickSettingsthenSettings
- On the left, click the name of the calendar.
- Click Integrate calendar. Under Embed code, click Customize.
- Choose your display options. Set the width and height to 500 or more.
- Click Copy to clipboard. Paste the code into your page.
A calendar is not public by default.
Only people you share it with can see it. To show events to all visitors, turn on Make available to public.
Embed code
Paste this into your page
HTML
<iframe
src="https://calendar.google.com/calendar/embed?src={calendar-id}"
width="800"
height="600"
style="border: 0"
title="{calendar title}">
</iframe>Use the code from Customize. It keeps your display options in the URL.
URL patterns
Swap the link you have for the embed URL
- You havePublic URL to this calendarUse in the iframehttps://calendar.google.com/calendar/embed?src={calendar-id}
Find the public URL and the embed code under Integrate calendar in the calendar settings.
Good to know
- To make a calendar public, open its settings. Under Access permissions for events, check Make available to public.
- To hide event details, select See only free/busy (hide details).
- If you turn off Navigation buttons, visitors can move only with keyboard shortcuts.
- Visitors can click Add to Google Calendar to subscribe.
Sources
- Google Calendar Help · Add a Google Calendar to your websitesupport.google.com/calendar/answer/41207
- Google Calendar Help · Create & manage a public Google calendarsupport.google.com/calendar/answer/37083
- MDN · X-Frame-Optionsdeveloper.mozilla.org/en-US/docs/Web/HTTP/Reference/Headers/X-Frame-Options
- iframecheck live check · both links
Profile updated