I recently made the switch to Jekyll as my publishing tool for this website. I love it, not least as it lets me serve content directly from Github. Updating the site is as simple as pushing into my repository. I have no servers to maintain and no extra monthly costs. For a low traffic site it seems, for now at least, like the perfect solution.
To me, one of the most interesting things about writing a blog is the ability to look back, to make old posts new again with an easily navigable archive section. A key part of that is the ‘archives for year …’ page. However, hosting with Github pages means that I can’t use plugins for Jekyll that you’d normally need to achieve this. Jekyll doesn’t really offer much in the way of core functionality for archives, but with a bit of hacking you can create an archive page for every year in a way that doesn’t suck.
We can use the power of Jekyll collections to somewhat automatically generate an archive page for each year your site has posts. There’s three main parts to the setup:
- Configure a collection for archives.
- Create a post for each year for which you want an archive page.
- Create a layout for processing each archive post into HTML
Configure the archives collection
First, we need to tell Jekyll about our new collection. In my site configuration file, (usually
_config.yml) I added the following:
collections: archives: output: true permalink: /archives/:path/
This tells Jekyll that we want a collection called archives, that we want it to output an
index.html for each item in the collection, and we want it to do so under the
Create a post per year
Our new archives collection will read any markdown files in a folder named
_archives, so we’ll have to create a post for each year your site has posts in this folder. This is why I say that this method is only somewhat automatic, however we’ll only every have to worry about updating this once per year.
For example, if we want an archive page for 2015 at
archives/2015 we’d create the post
_archives/2015.md. The only thing that’s really required here is YML front matter, here’s a simplified version of my
--- title: Archives for 2015 year: "2015" layout: archive-year ---
Don’t forget the quotation marks, the reason for them will shortly become apparent.
Archive page layout
Now we need to define a layout that Jekyll will use to output each archive page. I did this in a layout
_layouts/archive-year.html. Here’s a simplified version of my file:
--- layout: default --- <h1></h1> <ul> </ul>
Its all pretty simple really. We’re looping though all the posts on the site, and only displaying them if they match the target year. By the way, those quotation marks from earlier are required for matching the
page.year, which both have to be strings
And that’s it. A sort-of automatic way to generate an archive page-per-year.