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 day8.md (will I ever learn?) but I've set the permalink tag to:
---
permalink: "custom-url-slugs-in-11ty/"
---
so if you hit up mrqwest.co.uk/blog/custom-url-slugs-in-11ty; you'll end up here!
Sweet.
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 http://mrqwest.co.uk/well/this/isnt/a/great/url/but/its/deep/and/acts/as/an/example/custom-url-slugs-in-11ty/
Ridiculously long and wouldn't happen around here but it proves a point.
Now to set the permalinks on the rest of my posts!