💅 Hugoで目次をページの中の好きなところに配置する

タイトルの通りなのですが、Hugoでページの中に目次を配置しようと思ったら、 Table of Contents の機能を使用して以下のように記載すれば良いようになっています。

<aside>
{{ .TableOfContents }}
</aside>

なのですが、上記の方法はテンプレートの中に記載する必要があって、記事ファイルの*.mdでは展開されないので、ページ中の任意の箇所に展開したり、特定のページのみで使用したりなどが実現しづらく、今ひとつ使い勝手の悪さを感じておりました。

というわけで何か方法が無いか考えていたのですが、どうやらショートコードの中に入れておく事で*.mdの中に記載できるようになるみたいでした。

layouts/shortcodes/toc.html にファイルを作成し以下のように記載します。

<aside class="toc">
{{ .Page.TableOfContents }}
</aside>

*.mdの中では以下みたいな感じで使用できます。

{< toc >}}