add id attributes package

eleventy.config.js

@@ -2,6 +2,7 @@ import { eleventyImageTransformPlugin } from "@11ty/eleventy-img";
 
 import { attrs } from "@mdit/plugin-attrs";
 import { markdownitLinkAttributes } from 'markdown-it-link-attributes';
+import markdownitIdAttributes from "markdown-it-anchor";
 
 import path from "node:path";
 
@@ -12,7 +13,7 @@ export default async function (eleventyConfig) {
 	eleventyConfig.amendLibrary("md", (mdLib) => mdLib.use(attrs));
 
 	/* Markdown apply target="_blank" to all external links */
-	const milaOptions = {
+	eleventyConfig.amendLibrary("md", (mdLib) => mdLib.use(markdownitLinkAttributes, {
     matcher(href) {
       return href.match(/^https?:\/\//);
     },
@@ -20,8 +21,13 @@ export default async function (eleventyConfig) {
       target: "_blank",
       rel: "external",
     },
-  };
-	eleventyConfig.amendLibrary("md", (mdLib) => mdLib.use(markdownitLinkAttributes, milaOptions));
+  }));
+
+	/* Markdown apply ID attributes to headers */
+	eleventyConfig.amendLibrary("md", (mdLib) => mdLib.use(markdownitIdAttributes, {
+		level: [2, 3, 4],
+		tabIndex: false,
+	}));
 
 	/* Bundles */
 	/* CSS */