@11ty plugin for adding ids to html headings and other elements
<h1>Foo Bar</h1>
will become
<h1 id="foo-bar">Foo Bar</h1>
npm install @orchidjs/eleventy-plugin-ids
Add eleventy-plugin-ids to your .eleventy.js file
module.exports = function(eleventyConfig) {
//...
const anchors_plugin = require('@orchidjs/eleventy-plugin-ids');
eleventyConfig.addPlugin(anchors_plugin);
//...
}
module.exports = function(eleventyConfig) {
//...
const anchors_plugin = require('@orchidjs/eleventy-plugin-ids');
eleventyConfig.addPlugin(anchors_plugin,{
selectors: ['h1','h2','h3','h4','h5','h6'],
prefix: 'custom-id-prefix-',
formatter: function(element,existing_ids_array){
return '--generate-a-custom-id-here-',
}
});
//...
}