markdown-it plugin for adding table of contents

Usage no npm install needed!

<script type="module">
  import okmarvinMarkdownItToc from 'https://cdn.skypack.dev/@okmarvin/markdown-it-toc';


Why another markdown-it table of contents plugin?

Most of the table of contents plugins for markdown-it out there wrap toc in <p></p>, i.e. they are inlined. When you have ul tag inside p, browsers would render it as:


It's ugly.

In @okmarvin/markdown-it-toc, it will be wrapped in a nav:

<nav class="toc">
<h2 class="toc__heading">Table of contents</h2>


var md = require('markdown-it')({
  html: true,
  linkify: true,
  typography: true
md.render('{:toc}\n# heading one')

Remember to add placeholder {:toc} to where you want table of contents be inserted in your markdown file.


You can specify options too:

Name Description Default
class css class for table of contents' container toc
hMin minimum heading level toc will show 1
hMax maximun heading level toc will show 6
enableHeadingIcon add an icon to heading anchor false
headingAnchorClass class for heading anchor anchor
headingAnchorPrefix prefix for heading anchor ``
title Heading Table of contents