SchoolFront Support

 

Embed a Google Calendar

Add a Google Calendar to Your Webpage

If you have been maintaining a school/district calendar using Google Calendars you can fairly easily embed that calendar in your SchoolFront Portal CMS website. You will still be able to maintain your Google Calendar just as you did before, but visitors to your website will be able to see the calendar in your website. 

Embedding Instructions

Warning: Google makes periodic changes to the functionality and capabilities in their online tools so this help content may not be 100% accurate if they've made changes since this content was written. 

1. Go to to your Google calendar in Google's website.

2. There is a little list on the left side of the page that says “My calendars.”

3. Find the name of the calendar you want to share and click the little down-arrow icon next to it. A menu will open.

4. First click the “Share this Calendar” link and make sure the calendar is “Public.” –it won’t show up in your iFrame if it’s not public.

5. Once you’ve ensured it is public, click the “back to calendar” link in the lower left corner.

6. Go back to the “My Calendars area on the left and click the little down-arrow icon again and this time select “Calendar Settings” from the menu.

7. In the middle of the page there will be section called “Embed this Calendar.” There is code there that begins with “<iframe src=…” that’s what you want to copy for pasting into your webpage…if you want to customize how it will look when embedded, click the “Customize the color, size, and other options” link above the little box with the code snippet.

8. Once you have the code copied, go to your web page in your SchoolFront Portal CMS website.

9. Add an HTML web-part to the page layout. 

10. Click the edit button to open the WYSIWYG HTML editor

11. Click the Source button.

12. Paste the code you copied from Google into the editor.

13. Click the Update button. 

14. The calendar should embed. If the calendar does not immediately appear on the page, try refreshing the page in browser.