WiscWeb - WordPress UW Theme - Embed a Google Calendar

The campus G Suite access allows users to use a Google Calendar. The following document will walk users through how to embed a Google Calendar into a WiscWeb page or post.

In this document:

Accessing a Campus Google Calendar

To access your Google Calendar using your campus account, navigate to https://calendar.google.com and log in using your netID@wisc.edu account.

Google Calendar sign-in screen with NetID

You will then be brought to the campus authentication screen where you will log in via your NetID and campus password.

Creating the Embed Code For Your Calendar

  1. Once you have logged into Google Calendar with the correct account, on the left side click the vertical ellipsis next the account name (either personal or service account).

    Access options for Google Calendar

  2. Click Settings and Sharing

    Settings and Sharing option choice

  3. There are a number of options to work with in this screen, but to create the embed link click on Integrate calendar in the left menu.

    Menu of options for calendar

  4. Highlight and copy the code in the embed code section. Make sure to copy everything in the section from <iframe> to </iframe>

    Embed code to copy and paste

Embedding the Google Calendar in a WordPress Content Area

With the embed code copied, log in to your WiscWeb site and access the page or post that you want to paste this into.

  1. In a Text Area, paste the code that you have copied into the Visual Editor. The embed functionality will take that code and display the calendar within the text area.

    Embed code pasted into text area

    Google Calendar embedded into Text Area

  2. Be sure to publish and check your page to make sure it is working as expected.

See Also: