『WordPress』のブログ記事に目次を表示させる方法｜『Table of Contents Plus』で簡単に出来る！

ブログ記事に目次を表示させるとSEO的に効果があるともされています。

それがどの程度なのかを感じ取ることは難しいと思いますが、見栄えが多少豪華になったり、そのページの大まかな流れや、どんな記事で構成されているがなどを読み取ることが出来るので、読む側にとってはあった方が便利と言えるでしょう。

ここでは、自動で目次を作ってくれるプラグインの、インストールから設定の仕方まで解説します。

まず始めにプラグインをインストールする

最初に「Table of Contents Plus」というプラグインをインストールします。

手順１

まず、WordPressのダッシュボードの「プラグイン」を選択します。

手順２

そして、プラグインのページ内の左上にある「新規追加」をクリックします。

手順３

次にプラグインの追加のページの上部右上のプラグイン検索の窓に「Table of Contents Plus」と文字を入れます。

手順４

すると、いろいろなプラグインが紹介されていますが、「Table of Contents Plus」の「有効」をクリックするとインストールされます。

『Table of Contents Plus』の設定

今度は実際に使えるように設定していきます。

手順５

今度は「プラグイン」の「インストール済みプラグイン」を選択します。

インストール済みのプラグインの中にある「Table of Contents Plus」の設定をクリックします。

手順６

設定画面では次の画像と同じようにチェックと記入をしていけば、OKです。

• 「位置」はデフォルトのままでOKです。
• 「表示条件」は２つ以上見出しがある時と、しておきます。

その他、チェックは画像と同じ所に入れて下さい。

• 「見出しテキスト」では、実際に目次が表示された時、ブログに訪れた人が分かりやすいように、「目次」、「表示」、「非表示」と日本語で記入してありますが、最初は英語になっているので、英語のままでいいという人は、直さなくても大丈夫です。

手順７

ページ中段もこのようにチェックしていきます。

デフォルトとなっている所はそのままでも問題はありませんが、必要に応じて設定してもいいでしょう。

• 「横幅」では目次のサイズを選ぶことが出来ます。
• 「回り込み」では目次を左寄せ、中央寄せ、右寄せに設定出来ます。

手順８

目次の背景色も変えることが出来るので、好きな色にチェックを入れて選びます。

すべてが済んだら、「設定を更新」をクリックすれば設定は、すべて完了です。

表示出来たかを確認してみる

これまで私が運営しているサイトを例に解説してきましたが、設定が完了するとこのように表示されます。

• 「１」、「２」、「３」はh2の見出し
• 「１．１」、「２．１」、「３．１」「３．２」はh3の見出し

というように、見出しごとに上手く分けられていることが分かります。

見出しの入れ方はこちらを参照>>小見出しを入れる

まとめ

このように記事内の最初の見出し手前に目次を設置することで、ブログの充実感もけっこう変わってきます。

後は記事を書くだけで、プラグインが自動的に目次を作って設置してくれるので、その都度、何かの設定をするというような苦労もありません。

また、この目次はただ表示しているだけではありません。

例えば、いつまで続くんだというくらい、とてつもない長さの記事になると、途中で読み飛ばしたくなる時もありますが、そういう時に目次から気になる記事を選んで、そこにジャンプするという使い方も出来るので、とても機能的だといえます。

テンプレートによっては相性が合わない場合もある

私が運営しているブログの中でも、本サイトに表示している目次は大きく表示されていますが、使っているテンプレートとの相性の絡みもあって、サイズと背景色の設定が反映されません。

解説で使ったＦＸ教材サイトのテンプレートとの相性は、どうやらいいようですが・・・

そこで他の目次設置用プラグインがあったので試してみたところ、本ブログのテンプレートとの相性は良いようで、サイズの変更も出来たのですが、目次のデザインが気に食わなかったので、妥協して「Table of Contents Plus」で手を打った次第であります。

しかし、このプラグインは目次以外に、サイトマップを作れてしまうというスグレ物なので、インストールしておいて損はないでしょう。