How to Add a Google Calendar in WordPress?

How to Add a Google Calendar in WordPress?

Google Calendar has been widely used by both individuals and business owners to manage events and organize different parts of their lives all in one place. So there stands a good chance that you and your team have already integrated a Google Calendar into your workflow.

In this case, you do not need to duplicate your efforts using another event management system in WordPress. With several feasible methods in hand, you can add a Google Calendar to display directly all your events on the site. In this comprehensive beginners’ guide, we carefully describe these methods to walk you through the whole process.

Method 1: Use the Google Calendar IFrame

Google Calendar comes with an iframe, enabling you to embed it into a WordPress post or page in a simple manner. The first thing you need to do is visit Google Calendar on the web.

As you can see from the following screen capture, there is a list on the left sidebar containing all the calendars that you have set up. Click the one that you want to embed and select “Calendar settings” option on the menu that opens up.

Select Calendar Settings

On the calendar settings page, you can see multiple options provided. Head over to the “Share this Calendar” tag right under the calendar title. Tick the checkbox as below and save changes.

Share the Calendar

In the next, head back to the “Calendar Details” tag and lower the page, you will see a section named as “Embed This Calendar”. This section contains an embed code for the selected calendar with its default style. If you want to customize the calendar’s color, size, and many more a little, hit the link on the top of the embed code box.

Embed the Calendar Section

After that, you will be redirected to a new window. Change the calendar settings according to your preference with the options available on the left sidebar and preview how the calendar will be displayed on you site with a preview on the right side. What matters the most on this page is surely the revised embed code of your calendar. Go ahead to copy it and proceed to the next step.

Customize the Calendar

To add the calendar to your WordPress site, you firstly need to add a new post or page on admin area. Then, paste the embed code in the “Text” mode of the post editor. Remember to click on the “Publish” button to make it work alright.

Add a New Post

In the final, you can visit the post or page to see the calendar functioning on your site with a list of events that you have included.

Calendar Functioning

Generally speaking, this method is excellent mainly because the iframe embed code can be inserted at anywhere of your site as you wish. However, Google Calendar grants you with relatively few control on the calendar style.

Method 2: Use the Simple Calendar – Google Calendar Plugin

Another considerable method here is using the Simple Calendar – Google Calendar plugin. Besides keeping multiple calendars in sync, this plugin also provides you with more customization options. Scroll down to check for detailed steps about how the plugin is used.

Step 1 – Install the plugin

Before taking advantage of the plugin’s amazing features, you need to download it to your dashboard and install it. If you are fresh with this process, turn to our detailed guide on how to install WordPress plugins.

Install the Plugin

Step 2 – Change the plugin settings

Once the plugin is activated, you will see a new item titled as “Calendars” on the sidebar menu of your dashboard. Hover your mouse over this item and hit the “Settings” options. After entering the plugin setting page, you can see the following three tags.

  • “Event Sources”- This section requires you to provide a Google API Key, with which the plugin can read events from your public Google calendars. Refer to this page for more illustrations on how to create a Google API key.
  • “Calendars” – In this section, you are able to choose whether to attach calendars on posts, pages, or both posts and pages. For this configuration, we recommend you select both posts and pages. Also, you can decide whether to add a “Powered by Simple Calendar” logo to show the plugin author some love or not.
  • “Advanced” – The plugin, in this section, allows you to perform some advanced changes like disabling CSS, deleting plugin settings, and erasing calendar data.

Step 3 – Add new Google calendars to WordPress

To prepare for this step, you will need the unique ID of the calendar that you want to show on your WordPress site. Simply visit Google Calendar and enter the calendar details. Scroll down the page and you will see the calendar ID located under the embed code that we have mentioned before. Copy this ID for the next operation.

Find the Calendar ID

Then, you can get started by going to “Calendars”>”Add new”. The process of adding a new calendar is similar to that of creating any WordPress posts, which mainly revolves around providing post titles and contents. As you may notice, the plugin has automatically inserted some contents in the text area. Therefore, all you need to do is enter a suitable name for the calendar.

Add a New Calendar

After you are done, lower the editing page and you will see the calendar settings box on the bottom. Navigate to the “Google Calendar” tab and paste the ID that you have copied in the very beginning to the right box. If there are needs to customize the calendar, you can head over to other tabs to style its appearance and many more. If not, publish the calendar to enable it. Repeat the above operations if you want to create multiple calendars.

Paste the Calendar ID

Step 4 – Display Google calendars on your site

After you have created the calendar, the next thing you need to do is display it on your WordPress site. In total, the plugin provides two options for you to do this, namely, displaying the calendar on a post or page and displaying it on the sidebar of your site.

If you choose the former option, you should head over to “Pages”>”Add New” on the admin area. After deciding the name of this page, you can hit the “Add Calendar” button to enter a popup presented as below. Then, select the target calendar from the drop-down menu and add it to the page. Also, remember to publish the page.

Add a New Page

Now, you can visit your site to see the calendar page in action.

Calendar Page in Action

As for the second option, there is no complex configuration. Simply go to “Appearance”>”Widget”. Then, drag and drop the “Simple Calendar” widget to the sidebar. In the widget setting fields, enter a name for the widget and select the calendar(s) that you want to integrate.

Change the Widget Setting

After you have saved all the changes in the widget settings, the plugin will display the calendar on your site sidebar as below.

Calendar on the Sidebar

Conclusion – Find the Right Method

To sum up, the two methods are both good practices for you to add a Google calendar to your WordPress site in a fast and easy way. As a result, you can choose the one based on your actual preferences as well as needs.

If you are are looking for a straight way to do this, then embedding a Google Calendar with the iframe can get your needs covered. However, if you want to get more control on the calendar, using plugins may be more to your taste.