Home / Articles / WordPress / How to Add Google Calendar to Your WordPress Website

How to Add Google Calendar to Your WordPress Website

Calendars are useful tools in providing community information, coordinating team activities, keeping everyone informed about events. They are one of the most used apps across all devices.

You can add a calendar to any page of your website. You can enter into that calendar important events that you want to keep track of – football matches, birthdays, customer meetings, deadlines for submission of projects. If the calendar is shared with a team or community, you can update it with events that are of interest to the team or community – the garage sale, office party, orientation for a new team member and similar events. The calendar will help keep community members or your avid readers apprised of upcoming events.

One method of adding a calendar is by using plugins. This method will also help you to customize the appearance of the calendar to a certain extent. Another method of incorporating a calendar is by adding Google calendar to your website and updating it with your own events. As most internet users are already using Google Calendar and are familiar with the interface, we will adopt this approach for our purpose.

You can broadly break up this installation of Google calendar into two stages,

  1. Generating an embed code
  2. Adding your embed code to your WordPress site

Generating Google Calendar Embed Code

1. The first thing to do is to integrate a Google Calendar with your website. You can do this by accessing Google calendar in your browser. You should get a screen like the one below.

1 Google Calendar Interface

2. Next, access a public calendar.  Access the drop down menu listed under ‘Other Calendars' and then select Browse Interesting Calendars from the menu.

2 Browse Interesting Calendars

A list of interesting calendars will appear on your screen. Select any one interesting calendar by subscribing to it. On a whim, I chose ‘Orthodox Holidays'. You can preview the calendar before you subscribe. And you can pick as many as you like and they will all be embedded in your calendar. But for this tutorial, let's start with one.

5 Subscribing to Orthodox Calendars

3. After you have selected a calendar for embedding, click on Back to Calendar at the top of the screen. You will see your own calendar with the ‘Orthodox Holidays' calendar embedded in it.

11 Embedded calendar

Adding Embed Code To Your WordPress Site

We now move to the second stage where the action shifts to your WordPress site. You have to embed the calendar on your website. If you already have a Google Calendar displaying dates and times, the easiest way to share it with team members is to embed it in your site.

1. For this, open a New Page from your WordPress Admin. Click on Edit and choose the text version of the page.

Now, go back to your calendar and click on Calendar Settings on the left side.

9 Embed code screen

Notice the string of code in the small box to the right side? (see red arrows in graphic above)

2. Copy this code, go back to the new page you have opened and paste it there.

Also notice that there is an option to customize the calendar. You can click on it and choose settings as you like. The customization options are quite basic and not as wide as those offered by plugins or to the extent required by large websites.

10 Titled Page with code

3. Save the page by clicking on Save, Update or Publish. Assuming your theme is responsive, everything should work fine.

You can add the same code to a text widget on different pages and widget placeholders depending on your theme.

12 (1)

Now your website will display your calendar with all the important dates and events embedded in it.

Google Calendar Events

Another method of embedding your calendar is to download plugins and use them to customize your calendars. The Google Calendar Events is one such plugin. This plugin is responsive and you can view events in a monthly grid format or list format, even from your mobile device. Multiple calendars can be combined into a single display.  Events content display can be customized with simple tags and without the use of code.

You can access public calendars with the help of the plugin. Recurring events, search box for events, date and time formats and special events can all be customized.

This plugin will do away with the need for a separate event management function.

13

A premium version from Google is also available. This version uses a secure connection between Google and your website. Many display formats can be used to include attachments, guest information or event organization. Updates are automatic.

Having an embedded calendar on your website is the easiest and fastest way to keep team members or a community informed of important or upcoming events. It will help to manage events from one place. Try it and see for yourself how an embedded calendar makes things easier by syncing up all your events on one screen.

Photo of author

Article by Vishnu

Keep Reading