Day 8 - Custom URL slugs in 11ty

Silly me.

I've just spent some time refactoring the code blocks in the past 8 posts I've written and I realised that each markdown file I've written is named day1, day2 etc which doesn't make for a semantic URL.

So I hit up my new favourite site, the 11ty docs on Permalinks which shares a useful tag that can be dropped into our front matter

enter permalinks

So dropping a permalink tag into our front matter followed by a string will tell 11ty to interpret that string and set is as the permalink URL for your piece of content, despite the filename.

This file for instance, is called (will I ever learn?) but I've set the permalink tag to:

permalink: "custom-url-slugs-in-11ty/"

so if you hit up; you'll end up here!


Now make sure you use a trailing slash on the permalink otherwise your browser may not know what to do with the file. And if you want to bury your post further down the URL tree, add that in to. For example

permalink: "well/this/isnt/a/great/url/but/its/deep/and/acts/as/an/example/custom-url-slugs-in-11ty/"

will resolve to

Ridiculously long and wouldn't happen around here but it proves a point.

Now to set the permalinks on the rest of my posts!