Do you need a free, powerful, full-featured, easy-to-use calendar that works in WordPress or Joomla? Google Calendar is a great solution and you don’t need another extension or plugin to use it.
Click here to watch the video tutorial on adding Google Calendar to Joomla or WordPress
The following tutorial explains how to add a Google Calendar to WordPress or Joomla (or any website).
- Go to the following URL to create a Google Calendar account: http://www.google.com/calendar/
If you already have a Google account (eg, gmail, Google Analytics, Google Docs), you can use it to create a Google Calendar account.
Important: If you are creating a new Google account, Google will send a verification email. You must verify the email address before you can log in. - Once your account is verified, sign into Google Calendar. Google Calendar will take you through some basic calendar configuration steps; eg, time zone, language, etc.
- Create a new Calendar to share on your Joomla or WordPress website. From the My Calendars list in the left column, select Create New Calendar. Fill in all the settings and make sure you select Make this calendar public and then click Create Calendar.
- Click the arrow on My Calendars to view your calendars.
- Click on arrow on the calendar you want to share and select Settings.
- From the Embed This Calendar section, click Customize the color, size, and other options.
- Customize your calendar; for example, you can show or hide the calendar title, navigation, calendar list, etc. Also, you can specify the calendar width. The width setting is important because the calendar must fit within your page content width. If you are not sure, start out with about 600 pixels wide. You can adjust the width if necessary by repeating this step and changing the width.
- Copy the calendar embed code and paste it into the Joomla or WordPress page where you can the calendar to appear.
Note: You must paste the Google Calendar embed code into the HTML of the page; if you paste the embed code into the visual editor it won’t work.. - To paste the embed code WordPress 3.5, click the Text tab of the editor and paste the calendar code there.
- In Joomla, click the HTML button on the editor ribbon at the top of the editor and then paste the Google Calendar embed code there.
Note: If Joomla strips out the iframe code, you need to adjust the filtering for your user type. For example, if you are a Joomla Super User, you need to turn off filtering for the Super User. To turn off Text Filtering for a Joomla user, from the Joomla Admin menu select Site > Global Configuration > Text Filters. For Joomla Super Users select No Filtering from the Filter Type list.
WARNING: Using the No Filtering setting can be a security risk because it allows you to paste javascript code into HTML. Use this setting only for Super Users or Admin users.
- View your calendar page.
- You can adjust the calendar colors by adding css rules to your stylesheet.
