目次はHugo0.60.0から標準でサポートされています。(デフォルトMarkdownライブラリGoldmarkの機能)
config.tomlの設定
[markup]
[markup.tableOfContents]
endLevel = 5 # どのレベルまで目次に表示するか (h5)
startLevel = 2 # どのレベルから目次に表示する(h2)
テンプレートの修正
目次を表示したいテンプレートの任意の場所に以下を追加します。
{{ .TableOfContents }}
スタイルシートの設定
以下のようなHTMLが生成されるため適当なスタイルシートを設定します。
<nav id="TableOfContents">
<ul>
<li><a href="#mermaid">Mermaid</a></li>
<li><a href="#sample">sample)</a>
<ul>
<li><a href="#sample-1">sample-1</a></li>
<li><a href="#sample-1">sample-2</a></li>
</ul>
</li>
</ul>
</nav>