どうも、笹塚神之介です。

ここではワードプレスの記事に目次を追加するプラグイン「Table of Contents Plus」の設定方法や使い方について解説していきます。

 

まず、目次についてですが、読者はまず記事タイトルを見て、興味があるからクリックをして記事内に入ってくると思います。

その後、記事内に入ってきた時に重要になってくるのが目次になります。

※ちなみに↓がTable of Contents Plusで表示される目次になります。



記事に目次を表示させるTable of Contents Plusについて解説!

記事を読み始める前に、読者が考えるところは「この記事にはどんな事が書いてあるんだろう?」と言った内容になります。

それを解決するワードプレスのプラグインが【Table of Contents Plus】になります。

目次を追加することで得られるメリットは以下になります。

①読者の利便性を高める

幼い頃から誰もが小説や教科書など、自然と目次を利用しているはずですので、その存在意義については言わずもがなかと思います。

しかし紙媒体では一般的でも、ブログとなると「目次」を全ての管理者が用意してくれているわけではありません。元々ブログは日記のようなものとして広まってきたという背景もあってか、もしかすると「ブログ=本」といった認識になっていないのかもしれませんね。日記にわざわざ目次を付けたりはしませんから。

しかし多くの方がブログで有益な情報を発信するような時代になってきて従来のように目次を表示させないのは、単純に不利益に繋がるように変化してきました。
そういった際には目次があると読者にとってブログを読む際の利便性がとても向上します。

②Googleの検索結果に「〜に移動」と表示される

上図のような検索結果をご覧になったことはないでしょうか。実はこれ、見出しにidを付け、ページ内リンクを設定することで表示されるようになります。

こういったニーズの読者に対し、ページ内で該当する内容を探す手間を省いてあげるべく、このような検索結果を実装しているというわけです。


Table of Contents Plus でできること

様々な設定ができる Table of Contents Plus ですが、代表的な機能をいくつかご紹介いたします。

※記事内に見出し(H1やH2など)を記載していない場合は、このプラグインを利用しても目次を表示してくれません。

自動で目次を作成してくれる

既に大量のブログ記事を公開してしまっている場合、過去に遡って見出しを一つずつ設定していくのは大変です。また新しい記事の公開の際にも毎回目次を作るのは意外に大変です。

Table of Contents Plus では過去記事も遡って目次を追加してくれますし、新しい記事も目次が自動作成してくれます。

階層にして表示してくれる

H1とH2を単純に並べて表示してしまうと、大見出し、小見出しの区別が付きません。

しかし Table of Contents Plus では自動でH1、H2など見出しレベルを判定し、階層化(入れ子)にして表示してくれますので、そういった手間も必要ありません。

カスタム投稿タイプも対応

「投稿」だけに目次をつけたり、「固定ページ」や「カスタム投稿タイプ」にのみ目次を自動表示することも可能です。

またカスタム投稿タイプが複数ある場合には、特定のカスタム投稿タイプだけに限定して表示することが可能です。

自動表示の条件も設定できる

見出しが一つしか無い場合に目次を作ってしまうと、違和感がありますよね。

なので「見出しが3つ以上あるときのみ」ということも可能です。また「H5〜は目次に加えない」といった条件でも設定することができます。

サイトマップも作成できる

サイトマップページを自動で作成してくれるプラグインは既に存在していますが、Table of Contents Plus でもサイトマップページを簡単に作成する機能が付いています。

※ただ、こちらの機能はあまりおすすめではないので使用しなくていいです。

デザインも設定できる

デザインの種類もいくつか事前に用意されていますので、ご自身のブログに合うようなデザインを選択することができます。もちろんオリジナルでもデザインを設定することができます。


Table of Contents Plusの設定方法

それでは早速使ってみましょう。

インストールする

まずは管理画面から「Table of Contents Plus」と検索してインストールをするか、こちらのページからダウンロードしてサーバーのpluginフォルダにアップロードしてください。

設定を変更する

設定はメニューに表示されている「TOC+」から変更可能です。

基本設定する

まずは目次を表示する「位置」、「表示条件」、「以下のコンテンツタイプを自動挿入」の設定をしましょう。

「見出しテキスト」もデフォルトでは英語になっていますので、日本語に変更しましょう。この際、初期表示で目次を折りたたんだ状態で表示するかどうかも選択することができます。

「階層表示」は入れ子にするかどうかの選択です。

「番号振り」は目次の前に番号を挿入してくれます。階層化されたページは「1. 2」といった番号振りをしてくれます。

あとは好きな外観を選べば完了です。

上級者向けの設定

上級者向けの細かい設定も用意されています。

その中でもよく使いそうなものとしては、

「CSS ファイルを除外」

オリジナルのCSSを適用したい場合は、こちらにチェックを入れましょう。

「見出しレベル」
特定の見出しのみを表示・非表示を選択することができます。(例:h5だけは非表示)

「除外する見出し」
特定のキーワードを含んだ見出しを表示したくない場合は、こちらに設定しましょう。

手動で挿入する場合

デフォルトの設定では、全ての記事に目次を作成してしまいます。そうではなくて、任意のページのみに手動で目次を設定したい場合もあるのではないでしょうか。またページの途中の任意の位置に入れたいということもあるでしょう。

そういった際は、

と入力することで任意の記事に、任意の箇所に表示することが可能です。

オリジナルのデザインを適用する場合

デザイン選択の際に「カスタム」を選択し、好きな色を設定することができます。

以上で、Table of Contents Plusの設定方法の解説は終わります。

最後

ここでは記事の冒頭に目次を表示するワードプレスプラグインのTable of Contents Plusについて設定方法などを解説しました。

目次は読者にとってあると親切に思われるので、是非設置して頂ければと思います。

また、これ以外にお勧めのワードプレスプラグインをご紹介しているので興味がある方はご覧ください。