Embedding a Google Calendar
There are two ways to add a Google calendar to your class. One involves adding it as an item to a module. This will be demonstrated first in this tab.
You can also embed a Google calendar anywhere you use the rich content editor box. I'll demonstrate using a Page. This process requires you to go into the HTML editor, which is not difficult. This will be demonstrated second.
Adding a Calendar as a Module Item
This method allows you to embed a Google calendar as a module item – you will not be able to edit the page that results as you would a Canvas page.
1. Open Google Calendar, locate the calendar you want to add to your course in the list at left. Hover over the calendar and click on the 3 dots that appear to open more options.
![Locate the three dots to open the calendar options menu](https://d2jv02qf7xgjwx.cloudfront.net/accounts/380755/images/LocateCalendarSettingsMenu.png)
2. Click on the "Settings" option on the menu.
![Click the Settings option](https://d2jv02qf7xgjwx.cloudfront.net/accounts/380755/images/CalendarSettingsMenu.png)
3. Scroll down the settings page to locate the "Integrate calendar" section. Copy the code that appears in the "Public URL to this calendar" box.
![Locate the calendar's public URL](https://d2jv02qf7xgjwx.cloudfront.net/accounts/380755/images/LocateCalendarURL.png)
4. Click the "+" button on the module that you want to add the calendar to, then select "External URL" from the "Add [item] to Class Resources" drop down menu. Paste the URL in the appropriate field and give the page a name. Click the red "Add Item" button at the bottom of this box.
![Add an item to a module](https://d2jv02qf7xgjwx.cloudfront.net/accounts/380755/images/AddExternalURL.png)
5. The calendar will appear in the module list.
![The calendar in a module's list of items](https://d2jv02qf7xgjwx.cloudfront.net/accounts/380755/images/CalendarAsModuleItem.png)
6. As long as you have not checked the "Load in a new tab" box on the Add item page, the calendar will appear as a Canvas page.
![The calendar item opened in Canvas](https://d2jv02qf7xgjwx.cloudfront.net/accounts/380755/images/CalendarAddedAsItemPage.png)
Embedding a Calendar
This method allows you to embed a calendar anywhere that you have access to a rich content editor box, like Pages and Assignments. You will be able to add other materials to this Canvas page alongside your embedded Google calendar.
1. Open Google Calendar, locate the calendar you want to add to your course in the list at left. Hover over the calendar and click on the 3 dots that appear to open more options.
![Locate the three dots to open the calendar options menu](https://d2jv02qf7xgjwx.cloudfront.net/accounts/380755/images/LocateCalendarSettingsMenu.png)
2. Click on the "Settings" option on the menu.
![Click the Settings option](https://d2jv02qf7xgjwx.cloudfront.net/accounts/380755/images/CalendarSettingsMenu.png)
3. Scroll down the settings page to locate the "Integrate calendar" section. Copy the code that appears in the "Embed code" box.
![Copy the calendar's embed code](https://d2jv02qf7xgjwx.cloudfront.net/accounts/380755/images/CalendarEmbedCode.png)
4. Create or open the page in Canvas where you want to embed the calendar. In its editable form, locate the HTML editor button, which looks like "</>", below the content editor box. Click this button to switch to the HTML editor view.
![Locate the Canvas HTML editor](https://d2jv02qf7xgjwx.cloudfront.net/accounts/380755/images/LocateHTMLeditor.png)
5. Paste the copied embed code from the calendar into the HTML editor. Click the "Save" button to save your work.
![Paste the calendar embed code in the HTML editor](https://d2jv02qf7xgjwx.cloudfront.net/accounts/380755/images/PasteCalendarEmbedCode.png)
6. The calendar will appear in your page as below. If you want to center the calendar, use the rich content editor to highlight the calendar and click the center alignment option as you would to center text.
![The Google calendar as it appears in Canvas](https://d2jv02qf7xgjwx.cloudfront.net/accounts/380755/images/CalendarInCanvas.png)