目次
hugoを使って出力しているブログに目次を付けました。
hugoに目次用の変数があったのでそれを使って簡単に実装できました。
目次用の変数を記事のテンプレートに記載する
hugoに目次用の変数{{ .TableOfContents }}があったので記事のテンプレートに記載するとリスト形式で目次を出力してくれます。
CSSで見た目を整えるだけで目次自体は実装できました。
折りたためるようにする
CSSとHTMLタグだけで実装したかったので、<details>タグを使って折りたためるようにしました。
最終的に下記のようになりました。
<details>
<summary>目次</summary>
{{ .TableOfContents }}
</details>
