How to install GOOGLE CALENDAR in wordpress

GOOGLE CALENDAR. Recently, I realized how difficult it can be to add a Google Calendar to your WordPress when you have a responsive website. So, I decided to share my experience with you so I can save some time for you if you need to add a Google Calendar to your website.

When you need a way to integrate a Google Calendar in your WordPress powered websites, you can easily add the iframe code of your calendar that Google provides. However, the problem is, the calendar doesn’t render properly on smartphones and tablets.

Google Calendar is probably one of the most widely used app among users worldwide. Not only we use calendar in our day-to-day life, we also need to show a calendar on our websites often.
Responsive Google Calendar For WordPress Websites

If you follow the steps I am going to share, you will be able to integrate your Google Calendar with your WordPress website, embed it in your posts, pages or widgets easily.

Method 1: Google Calendar Events Plugin For Public Calendars
This is an elegant method to integrate your Google Calendars with any WordPress website if your Google Calendar is completely public. If you have setup your calendar to show “Busy” status to hide the actual details of the event, this plugin will throw error.

However, if your Google Calendar is  public then keep reading the steps to follow:

Install and activate the Google Calendar Events plugin and then a Google calendar events menu item will appear under the Settings menu of your WordPress admin dashboard.
To use this plugin, you will need to get the public feed for your Google Calendar and then add that feed to the plugin.

To get the public feed for your calendar, go to your Google Calendar and click on the arrow next to the calendar you want to share. Click on calendar settings where you will find the XML url of your calendar.
Now, come back to the plugin settings in your WordPress admin panel and click on the “Add Feed button”.  A screen similar to the one below will appear:

Google Calendar Events Settings
Enter you feed title for the calendar and paste the XML URL you copied from Google Calendar into the feed URL. Click the Add Feed button at the bottom of the page and your feed will be added.
Google Calendar Events WordPress plugin uses shortcodes to display the Calendar grid on any post or page you want. Go to your post or page where you want your Google Calendar to appear and add this shortcode:
[google-calendar-events id=”2″]
Please note that the ID will be the ID of your feed as you would have created. This might be a different number for you.
Once the shortcode is added, view your page and you should see a beautiful calendar with all your Google Events appear on the page which is fully responsive to render properly on every device.

Method 2: All-in-One Event Calendar Plugin by Time.ly
This is my favorite method because the client I was helping had a calendar who didn’t want to share the actual event details on the Google Calendar on the website. Instead, he wanted to show just “Busy” whenever there was an event marked.
Google Calendar supports that feature if you go through Google. However, when you want to embed the calendar with WordPress and make the Calendar responsive, this awesome WordPress plugin comes to rescue!

Instructions are similar to the one we just discussed above. Install and activate the All-in-One Event Calendar plugin. You will notice an Events menu item will appear in your WordPress admin dashboard.
This plugin accepts .ics or xml feeds from the Calendars that support this feature including Google Calendar. You will need to get the public feed for your Google Calendar and then add that feed to the plugin using the same steps we discussed above.

Once you have the calendar feed, you need to add the feed using Events -> Calendar Feeds menu item and then from the choose which page you want your calendar to appear using  Events -> Settings menu item.
There are many self explanatory options you can set and experiment while setting up your events calendar. However, once these basic settings are completed, your Google Calendar begins to render in a responsive manner