@codegouvfr/eleventy-plugin-calendar NPM

eleventy-plugin-calendar

Eleventy plugin containing filters for generating ICS calendar and ICS events using the Nunjucks templating engine.

Motivations

Turn your posts directly into events that will show up in a published ICS calendar, or that you can import into another calendar!

Installation

npm install @codegouvfr/eleventy-plugin-calendar

Open up your Eleventy config file (probably eleventy.config.js) and use addPlugin:

const calendarPlugin = require("@codegouvfr/eleventy-plugin-calendar");

module.exports = eleventyConfig => {
    eleventyConfig.addPlugin(calendarPlugin);
};

You're now supplied with the following filters:

slugifyEvent: slugify event name and date. Useful for setting calendar event permalink.
toCalendar: turn a collection into an ICS calendar.
toCalendarEvent: turn an event into an ICS event.

Options

const calendarPlugin = require("@codegouvfr/eleventy-plugin-calendar");

module.exports = eleventyConfig => {
    eleventyConfig.addPlugin(calendarPlugin, {
        defaultLocation: "online",
        defaultOrganizer: {
            name: "hjonin",
            email: "h@jon.in"
        }
    });
};

Usage

See sample/calendar.njk for an example ICS calendar template and sample/calendar-event.njk for an example ICS event template.

Copy and paste these templates and modify the YAML frontmatter to match your calendar’s needs. Make sure collections.events (the collection of post files using the events tag) matches the template collection you want to provide a calendar and calendar events for.

Place the files anywhere in your project and they will be transformed into a calendar.ics and calendar/{eventName-eventDate}.ics file at the root of your website (or depending on your calendar and events permalinks if you've changed them) when Eleventy builds it.

Ultimately your calendar will be available at https://yourwebsite.com/calendar.ics.

See sample/event-all-day/index.md and sample/event-with-time/index.md for example events. Event variables are:

{
  "title": "string",
  "description": "string",
  "start": "date",
  "end": "date",
  "duration": {
    "days": "number",
    "hours": "number",
    "minutes": "number"
  },
  "location": "string",
  "organizer": {
    "name": "string",
    "email": "string"
  }
}