Embedding Google Calendar(s) on a Web Page

Audience: Clubs, Faculty, Researchers, Staff, Students and Teaching Assistants

This KB Article References: Google Calendar
This Information is Intended for: Clubs, Faculty, Researchers, Staff, Students, Teaching Assistants
Last Updated: December 12, 2023
Average Rating: Not Rated
Your feedback is important to us, help us by logging in to rate this article and provide feedback.

You can create, share, and embed Google Calendars to display one or several Google Calendars on one website, to host an Events page on your website. Doing so gives you these benefits:

  • When you add new events to the embeded Google Calendar(s), the web page automatically displays the new events
  • Many departments or organizations can have separate calendars that are displayed together on one website

I. Create

Create a Google Calendar for your organization to publicize events. Representatives of multiple departments can create their own calendars as well

II. Share

Make your calendar(s) public

  1. To embed multiple calendars, a person(s) must act as custodian of all the calendars, in which case calendar creators must share each calendar with the elected custodian(s)

III. Embed

Generate the embed code (if you are only embedding 1 calendar, the owner of the calendar may generate the embed code. If you are embedding multiple calendars, the custodian must generate the embed code).

  1. Click the down-pointing arrow ▼ next to any of the calendars you want to embed and select Calendar Settings
     
  2. Scroll down to "Embed This Calendar" and click on Customize the color, size and other options; this will open the Google Embeddable Calendar Helper
  3. On the left side of the screen, review the options then
    • Add a Calendar Title
    • Check the box(es) next to what you want to Show and select what Default View to use 
    • Check the box(es) next to the Calendars to Display
  4. When you are finished selecting your options, click the Update HTML button
  5. Copy the embed code (starts with <iframe src="https:...) and send it to your Webmaster to embed on a webpage

Additional Information


Files & Links

Provide Feedback


Your feedback is important to us, help us by logging in to rate this article and provide feedback.

Sign in with NetID

Getting Help


The Division of Information Technology provides support on all of our services. If you require assistance please submit a support ticket through the IT Service Management system.

Submit A Quick Ticket

Supported By


Customer Engagement and Support