🛠️ Part 1 – Create and Configure Your Calendar
Visit Google Calendar and log in with your Google account (this must be done on a computer; mobile devices are not supported for this step).
Click on the Settings ⚙️ icon in the top right corner → select the calendar you want to embed from the left menu.
Under "Access permissions for events", check the box "Make available to public" so everyone can see the calendar.
Scroll down to "Integrate calendar" and:
Copy the automatically generated
<iframe>
code.Click on "Customize" to adjust size and layout, then copy the updated code.
🌐 Part 2 – Embed the Calendar on Your Website
Log in to your Sitebuilder and open the page where you want to display the calendar.
Add a new HTML or "Embed" widget to your layout.
Paste the
<iframe>
code you copied from Google Calendar.Save and publish the page – this ensures the calendar displays correctly live.
🧩 Additional Features
Visitors can click on “Add to Google Calendar” directly in the widget to subscribe to your calendar.
In the "Customize" mode, you can choose to show or hide navigation buttons, date pickers, lists, or different calendar views (month, agenda, etc.).
✅ Done!
Your Google Calendar is now embedded on your website and shows your updated calendar in real-time.
❓ Frequently Asked Questions
Do I need to make the calendar public?
Yes, otherwise visitors won't be able to see the embedded calendar.Does it work on mobile?
Yes – but ensure you use responsive dimensions or test on different screens.Want to customize the appearance?
Always ensure the code you add is secure and tested. Incorrect code can affect how your page displays or functions. Note that we do not provide support for coding!