Display your ics calendar on your website

TL;DR: the repository of our fork of Leonaard’s original project is available here.

This started off as a simple-enough request to display a calendar in ICS format (RFC5545) on a web page.

Turns out, it’s not something so easily found. After searching for a while, it soon appeared that there was an elephant in the room that had not been addressed much to bring together the 2 big JavaScript projects around ICS and calendar display:
– ical.js (github repository)
– fullcalendar.js (website, github repository)

Eventually we spotted 2 small projects (turns out you don’t need a lot of code to get an ics URL converted and loaded into fullcalendar) doing just what we needed, and further work was done from Leonaard’s project icalendar2fullcalendar (github repository).
The edited code is terribly hack, but it does all we want so far, and it should work fine for 99% of use cases.

You can find everything on our gitlab repository which contains:

  • all code (including copy of ical.js and fullcalendar.js (in the versions that were used/modified for this particular project).
  • a README.md file containing information on where to set the ics feed(s)
  • a ‘‘french’ branch is also available on the repo

A working demo is running at https://nomagic.uk/js_calendar_from_ics/
(look for April 2019).

note: be mindful of CORS when testing with your own feeds. Also, many feeds out there do not have the CORS rule that would allow you to load them from your own domain.

One Reply to “Display your ics calendar on your website”

Leave a Reply

Your email address will not be published. Required fields are marked *