How to Embed Google Calendar on Your Website

Two settings matter. First make the calendar public: Settings, pick the calendar, then tick Make available to public under Access permissions for events. Then, in that same calendar's settings, open Integrate calendar, click Customize under Embed code, choose the view and copy the iframe. Without the public step, visitors see an empty or locked calendar.

Before you start
CheckWhy
Use a computerThese settings are not in the Calendar mobile app
Public or free/busyPublic shows events; See only free/busy hides details
Work or school accountYour admin may block public sharing
Size at least 500 x 500Google's customiser requires it

Updated

An embedded Google Calendar is the simplest way for a club, school, venue or class to keep a public schedule on its site: you edit events in Google and the website updates by itself.

Embed Google Calendar on We.Inc, WordPress, Wix, Squarespace or plain HTML

We.Inc

  1. Copy the iframe from Google's Integrate calendar section.
  2. Paste it into the AI chat with the page it belongs on.
  3. Preview on desktop and phone, then publish.

Not an add-on. For bookings, use the Bookings app or the Calendly add-on instead.

WordPress

  1. Add a Custom HTML block.
  2. Paste the calendar iframe.
  3. Update the page.

WordPress.com allows iframes only on a plugin-enabled plan with hosting features active.

Wix

  1. Open Add Elements, then Embed Code, then Embed HTML.
  2. Paste the iframe.
  3. Stretch the element to the calendar's size and publish.

Squarespace

  1. Add a Code block or Embed block.
  2. Paste the iframe code.
  3. Save.

Iframes in Code blocks need Core or a higher plan.

Plain HTML

  1. Paste the iframe where the calendar should appear.
  2. Change width to 100% for a fluid layout.
  3. Upload and load the page while signed out of Google to confirm it is public.

Sources

  • Google Calendar Help: Add a Google Calendar to your website, https://support.google.com/calendar/answer/41207, checked October 28, 2026, for the Google Calendar steps
  • Google Calendar Help: Share your calendar with someone (make public), https://support.google.com/calendar/answer/37083, checked October 28, 2026, for the Google Calendar steps
  • WordPress.com: Code, https://wordpress.com/support/code/, checked October 28, 2026, for the Google Calendar steps
  • Wix: Embedding a site or a widget, https://support.wix.com/en/article/adding-html-code, checked October 28, 2026, for the Google Calendar steps

Public means public

Making a calendar public lets anyone who finds it see it, including in search. Keep a separate calendar just for the website, and never make your personal or work calendar public to embed it. If you only want to show when you are busy, choose See only free/busy (hide details).

Unsharing later takes effect within about four hours, according to Google.

Calendar or booking page

A public calendar shows events; it does not let visitors book a time. For appointments use a booking tool. On We.Inc, the Bookings app (paid accounts) and the Calendly add-on cover that.

How it works

  1. Create a calendar just for the website.
  2. Make it public under Access permissions for events.
  3. Open Integrate calendar and click Customize.
  4. Pick week, month or agenda view and size, then copy the code.
  5. Paste the iframe into your page and publish.

Tips

  • Agenda view reads best on phones; month view squeezes badly on small screens.
  • Set the calendar's time zone in the customiser so visitors in other zones are not misled.
  • Hiding navigation buttons leaves only keyboard navigation, so keep them on unless the calendar is tiny.

Frequently asked questions

Why does my embedded Google Calendar show no events?

It is almost always not public. Turn on Make available to public for that calendar, or visitors only see what you have shared with them personally.

Can I embed a calendar without showing event details?

Yes. Choose See only free/busy (hide details) when you make it public. Visitors see busy blocks without titles.

Why can't I make my work calendar public?

Google Workspace administrators can restrict sharing. If the option is missing, ask your admin.

How do I add one on We.Inc?

Paste the embed code into the AI chat and say which page should show it. Google Calendar is not an add-on.

Related: Embed forms and booking, Embed a Google Form, HTML iframes and video, Iframe refused to connect.

Start for free or see all free tools. We.Inc is free to start, with no card needed. AI building is on paid plans from $20 a month.

More in Guides

Product

Who It's For

Features

Resources

Company

View Sitemap