Squarespace

How to embed Google Calendar Squarespace Tutorial

By

In this video we'll be looking at how to add a Google Calendar on your Squarespace site. So here we have a site where a Google Calendar is already embedded, now I'm gonna show you how to do it. Here we have our default site where there have been no changes yet, so the Google Calendar is missing. The first thing we have to do is to get the code for the calendar, so you're gonna head over to https://calendar.google.com and you're gonna make sure that your logged in to the account that has the calendar that you're trying to link. Go to settings button, click on "Settings", then scroll down on the left side of the page, look for "Settings for other calendars" and click on "My Calendar", next you have to scroll down until you find "Integrate calendar" heading and then look for "Embed code"; copy the code (CTRL+C) that is below and go back to your site, go to the backend of the page where I showed my calendar, on the "Page Comment" section click on "EDIT". Now you're gonna click on the "Add" button, search for "code", click on "Code", delete the default content and paste the code (CTRL+V) that you have already copied on the white box, afterwards hit "APPLY" and then save. Now you can see the calendar displayed on your page.

Squarespace Tutorial: How to embed Google Calendar

Step 1: Go to https://calendar.google.com

Go to https://calendar.google.com

Remember that you’ll have to be logged in the account that you want to attach to your site, all the dates indicated in the calendar will be shown on your site at the end of the process. 


Step 2: Click on “Settings”

Click on “Settings”

You’ll have to go to the upper panel and click on the engine icon that will display a dropdown option list, there you must click on the first option “Settings”.

 

Step 3: Go to “My Calendar”

Go to “My Calendar”

This option will be located scrolling down on the left panel.

 

Step 4: Copy the “Embed code”

Copy the “Embed code”

Once you’ve opened “My Calendar” option, you’ll be able to seek the “Integrate calendar section”, here you’ll see the “Embed code”, and here you can highlight it and then press (Control + C) to copy it.

 

Step 5: Go to your Squarespace site and click on “EDIT”

Go to your SquareSpace site and click on “EDIT”

In your Squarespace site, you have to open the edit tools by clicking on the top left corner icon, now you can hover on the site elements, then click on “EDIT”.

 

 

Step 6: Click on “Code” option

To see this option, you will have to go to the top right corner and click on the “+” icon, this will open a new tools box where you’ll be able to type “Code” in order to make it easy to find it, then click on the “Code” option.

 

Step 7: Paste the calendar “Embed code” you previously copied from the Google calendar’s site

Paste the calendar “Embed code” you previously copied from the Google calendar’s site

Once you have opened the Code adding box, you have to delete the default content and then paste the Embed code from the step 4, once you’ve done this, you just have to click on “APPLY”.

 

Step 8: Refresh the site

Refresh the site

Now the calendar should be displayed in your site.


Stay updated with our
latest news & offers

Sign up to get our Newsletter.

Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.