How to add a custom slugify filter to 11ty
During my recent blog migrations, I discovered the new slugify filter handles apostrophes differently. I'd prefer they were dropped. Here are the steps.
I finally found the exact answer on 11ty.rocks, so please go check out the site! What a really great resource. This is a note for me when I'm redoing one of my blogs, and I've forgotten how to do this.
My requirement is to remove apostrophes instead of replacing them with dashes, which is the default behavior of the 11ty slugify filter.
Example: If I have a blog post titled "I've lost my keys", I want the URL to read /ive-lost-my-keys/ instead of the default behavior, which is /i-ve-lost-my-keys/.
The fiddly bits
// Import prior to `module.exports` within `.eleventy.js`
const slugify = require("slugify");
eleventyConfig.addFilter("slug", (str) => {
if (!str) {
return;
}
return slugify(str, {
lower: true,
strict: true,
remove: /[']/g,
});
});