WordPressで自動で目次を作るプラグイン「Table of Contents Plus」を使おう

PHP WordPress

WordPressで記事を書いていると見出しごとに目次を作りたいと思うこともあると思います。しかし手動ですべて設定していくのはとても大変ですし、記事を変更した場合などにとても弱いです。
そんなときは自動化で済ませてしまいましょう!
WordPressプラグイン、「Table of Contents Plus」を導入してサクッと目次を作っていきます。

Table of Contents Plus

インストール

「Table of Contents Plus」はWordPressの公式レポジトリから配信されているので、WordPressの管理画面からインストールすることが出来ます。
メニューの「プラグイン」→「新規追加」から検索画面で「Table of Contents Plus」と入力して以下の画像のプラグインをインストールしましょう。

インストール完了後、「有効化」をクリックして有効にしましょう。管理画面の「設定」のところに「TOC+」というメニューが追加されていればインストール完了です!

実際に使ってみる

記事に対して見出しを意味するHTML、「h1〜h6」タグを使用すれば自動で目次を設定してくれます。
また見出しが深くなれば自動でネストしてくれるのでそういう部分も意識しながら見出しタグを使用するとよいでしょう。

例えば以下のようなHTMLを記事内に打つとコード下の画像のような目次が最初のh2タグの前に自動で作成されます。

<h2>このプラグインを使うと自動で目次が作れます</h2>
<h3>キレイな目次です</h3>
<h3>ネストにも対応しているのでうまく使いましょう</h3>
<p>手動で目次を作るのは面倒ですね</p>
<h2>オプションで目次を作らないようにすることも可能です</h2>
<h2>目次が欲しくなったらこのプラグインを使うことを検討してもよいでしょう</h2>

最初の見出しタグの前に目次が自動で挿入されるようになっているのでそのことを意識しながら記事を書くとうまく反映されます。
これで目次の自動作成のためのプラグインを使うことが出来ました。

設定を少し触ってカスタマイズしてみる

「Table of Contents Plus」にはもちろんカスタマイズするための画面もあります。例えば見出しが3つ以上あるときだけ目次を自動生成するようにしたり、目次の位置を変更したり、目次をクリックしたときのスクロールをスムーズに変更したりすることが出来ます。

WordPress管理画面から「設定」→「TOC+」をクリックしましょう。
そうすると以下のようなページが表示されます。

目次の位置を調整する

最初の「位置」から変更することが出来ます。デフォルトでは「最初の見出しの前」に設定されているため今のような表示の方法になっています。例えばこれを「最初の見出しの後」に変更すればそのとおりになりますし「上」や「下」に設定することで目次の位置を固定して作成出来るようになります。

またショートコードとして[toc]というショートコードを使うことが出来るので自分の好きな位置で目次を挿入することも可能です。うまく利用して目次を自分の思い通りの場所に表示しましょう。

見出しがN以上のときだけ目次を作成するようにする

「表示条件」の部分を変更しましょう。このブログでは3つ以上見出しがあるときのみ目次を表示するようにしています。2つだけの見出しのときはおそらくそこまで長くない文章になるでしょうし必要ないかな、という理由です。

目次を作成したくない記事の場合は

記事にもよると思いますが、目次をこの記事にはつけたくない!と思うこともあるかと思います。
その場合はその記事内に[no_toc]というショートコードを書きましょう。そうすることで「Table of Contents Plus」がそのことを認識して、その記事内では目次をつけなくなります。便利ですね。

まとめ

このプラグインを使うことで目次を自由自在に操ることが出来ます。
これらの他にもサイトマップを作成してくれたりしますが、メインの使い方は目次の生成なのでそこに絞って記事を作成しました。
気になる方は公式のレポジトリの説明などを見てみるとよいかと思います。

参考

https://ja.wordpress.org/plugins/table-of-contents-plus/