Here's a step-by-step tutorial on how to add Google Calendar on your Weebly site.
We'll go over:
By the end of this tutorial, you will be able to add an interactive Google Calendar on your site where visitors can view and interact with your calendar events.
They can even save your event on their own Google Calendars.
Let's dive right in.
To start, we need to retrieve the embed code from Google Calendar.
First, login to your Google Calendar.
Then click on the settings icon (⚙️) and click Settings.
Look for Settings for my calendars in the sidebar.
Head to one of your Calendar's settings and make sure the access permission for public is checked.
Now head to Integrate Calendar to locate the embed code.
You will be redirected to the Integrate Calendar settings section. Click Customise.
A new window will open with a preview of your calendar.
If you know some basic HTML/CSS you can customize the how your calendar will look when it's embedded on your website — Customizing the width and height, background color, border thinked and color, etc.
If you're content with the default Google Calendar view, then click on the copy icon to copy the embed code.
Make sure you don't lose this code. You can also paste it in a note editor in case you lose it.
Now let's head to Weebly to add the Google Calendar code.
Login to your Weebly account. Make sure you select the correct website and click Edit Site.
In the main editor, drag and drop the Embed Code element to your site.
Select Click to set Custom HTML ➞ Edit Custom HTML.
Paste the Google Calendar code (that you copied earlier) into the text field.
Click Publish to live the calendar.
That's it! You've now added an interactive Google Calendar on your Weebly site.
If you're seeing an error message "The server cannot process the request because it is malformed. It should not be retried", there's a good chance you did not make your calendar public.
Head to your calendar settings and make sure the calendar permission for public is checked.