I’ve yet to see a good event calendar in any of the CMSes I’ve tried that properly handles recurring events and makes it easy for the layman to update calendar events. I’ve therefore recently implemented a small macro for Umbraco that displays Google Calendar events from a cached XML calendar feed. I did this using the excellent FeedCache plugin and some XSLT.

My one gripe with FeedCache is that you can’t edit the feeds.config file using ConfigTree, but rather need file-level access to it. This is a major bummer, as I wanted to test it on Umbraco Trials.

I won’t post any CSS, but the XSLT caters for styling as it uses bulleted lists and spans around key areas.

The feed will then be displayed similar to below:

Today

* Test Event (19:30-21:30)

Friday 16th October

* Meeting (19:30-21:30)

Sunday 18th October

* Seminar (10:30-12:30)
* Lunch (13:00-14:00)
* Games/Activities (14:30-15:30)

Here’s a screenshot of it working on an Umbraco Trials site. I found a random Google Calendar feed and used that for the demo. Note that I didn’t put any effort into styling the results:

Basically, what you need to do is:

1. Install FeedCache
2. Install the GCal Events List package
3. Set up the calendar feed in FeedCache’s feeds.config. The feeds.config entry should look like this:

   <feed>
    <url><![CDATA[http://www.google.com/calendar/feeds/calendar@example.org/public/composite?orderby=starttime&sortorder=ascending&futureevents=true&singleevents=true]]> </url>
    <localFile>GoogleCalendarFeed.xml</localFile>
   </feed>

4. Insert a macro wherever you need it, and fill out the parameters;
   1. numberOfDays – (integer) how many days worth of events you would like to display
   2. xmlFileName (string) the exact file name of the cached XML file in the umbraco\plugins\FergusonMoriyama\feedcache\ folder. eg. googleEvents.xml
5. Call FeedCache from your browser to trigger a pull of the feed(s): http://example.org/umbraco/plugins/FergusonMoriyama/FeedCache/FeedCache.aspx
6. View the page that contains the macro inserted in step 4.