Updated July 2008 because formats of google calendar appear to have changed

How to add future events from your public google calendar to your sidebar, in event order. This is how I did it (for our canoe site). There may be easier ways – if so, do share. You can see an example of what this does on the sidebar of this blog’s homepage.

The google bit

Presumably you already have a google calendar, and have made it public. Or else, presumably, you have found a publicly available google calendar, and want to display that.

Having created the calendar, or added it to your set of calendars, go to the Calendar settings and get the url of the xml feed of the google calendar, and paste it into a text editor, so that you can modify it.

calendaraddressyellow.png

calendaraddress.jpg

For example, for Kenyan public holidays, the URL of the xml is:

http://www.google.com/calendar/feeds/895tc8g12s93m07bnenlf2grb0%40group.calendar.google.com/public/basic

The getting-things-in-the-right-order-by-adding-parameters bit 

Within the text editor, Fluff around with the url a bit, as follows:

Add some parameters, (from Google Calendar API) onto the end. This addition worked for me:

?futureevents=true&orderby=starttime&sortorder=ascending&max-results=10&singleevents=true

So in our example,

http://www.google.com/calendar/feeds/895tc8g12s93m07bnenlf2grb0%40group.calendar.google.com/public/basic

becomes instead

http://www.google.com/calendar/feeds/895tc8g12s93m07bnenlf2grb0%40group.calendar.google.com/public/basic/?futureevents=true&orderby=starttime&sortorder=ascending&max-results=10&singleevents=true

The result of this is a feed where the xml events are listed in order from soonest to furthest away, future events only. Note that some feed readers, e.g. IE7, when given this link, will still insist on displaying them in “date added” order, but if you look at the underlying xml, you’ll see its in the order you want 

The feed43-is-brilliant bit

Now go to feed43 and “create a new feed”

Step 1.  specify the input feed as the url you just made, and click reload.

Step 2a.  Use the Global Search Pattern  field to specify which bit of the page you want to use. That would be: All of it.  So in this field, write:

{%}

Step 2b. Use the Item (repeatable) Search Pattern field to specify what sort of thing a single calendar entry kinda looks like.

Here is a screenshot of an example, click for larger image so that you can read the incantation.

As you can see, {*} means “Anything”, while {%} means “Bit we are interested in”

Step 3. Choose your Feed Title and Feed Description. Suggest leave the Feed Link as it is, or send it to point to the calendar page itself.

For the RSS item properties, choose the bits you want for the Title, Link and Content templates. For example, here is a screenshot of mine, click to get readable version.

Don’t click the merge box.

Save your feed and note a) the URL of the new feed and b) The Edit URL of your feed.

The WordPress RSS Widget bit

In your wordpress.com blog, go to Design->Widgets and get yourself a new RSS widget. Put it on your sidebar, or wherever, and then configure it.

Add your feed43 URL and a suitable title.

remember to save your changes.

Look at your blog and be very pleased.

Other customisations you might want to do

On the Google feed part, there are several parameters described in the Google Calendar API you may want to fiddle with, and also a choice of display formats: basic or full.

The feed43 part of the process is highly customisable – if you would rather have the date as the title or the content as a concatenation of various pieces of the original xml, then you can figure it by modifying the regular messpression in step 2, and the corresponding fields in step 3.

The stumbling blocks which motivated this solution.

  • Because one cannot presently add an iframe tag to a wordpress.com text widget, it is not possible to use that solution for adding a google calendar. It is understandable why wordpress.com are wary of the use of iframes and other programming tags.
  • WordPress.com have a great widget, the RSS widget, which can take RSS feed from other apps and display it nicely. Google Calendar do have a great service whereby the info from a public google calendar can be exported as a feed. Unfortunately, the RSS widget doesn’t really like the kind of XML which the google calendar emits. This is essentially because google calendar provide a choice of two kinds of links in their xml. The WordPress RSS widget happens to choose one which does not display in some browsers (IE7) 
  • Google calendar feed, in its “as-is” state, is labelled by “date added,” can include past as well as future events, and is not, by default, in the order you would need for an agenda.
About these ads