
こんにちは、chieです(^^)
今回は、記事に付けた見出しを目次で表示させてくれるプラグイン【Table of Contents Plus】のインストールから使い方まで、図解入りで詳しく解説します。
せっかく見出しを付けて記事の文章に区切りを付けても、記事を初めて見た人にとっては、どこに何をまとめて書いてあるのかが分かりにくいです。
しかし、見出しを目次に反映させる事で、何をどこに書いてあるのかを明確にし、読者が好きな場所から読み始める事も可能にします。
今ご覧になっているこの記事にもTable of Contents Plusで設定した目次が表示されています。
目次があるだけでぐっと整理された記事に変わるので、ぜひ導入するようにして下さい^^
目次
目次ありと無しの記事の見え方の違い
まずは、目次がある時と無い時の記事の見え方の違いについて画像で説明します。
まずは目次無し。
Table of Contents Plusを導入していない場合の見え方です。

見出しを3つ付けていますが、この1つの見出しごとに文章が長くなった場合、下まで全て見ないと、どんな見出しでどんな内容なのかという事が全く分かりませんね。
次に、Table of Contents Plusを導入した時の目次ありでの記事の見え方です。

記事の導入文のすぐ下に目次が表示されています。
これなら、1つの見出しの文章がどれだけ長くなろうと、目次に表示された見出しの文字を見るだけで、何について書いている箇所なのか。
という事が一目で分かります。
また、この目次の文字をクリックする事で該当の見出しへと移動する事ができるので、読者が見たい箇所を選ぶことが出来ます。
以上、記事の見え方の違いについてお話しました。
目次があった方が、圧倒的に見やすい記事になる。という事が分かったと思います^^
Table of Contents Plusのインストール
さっそくインストールしていきましょう♪
まず、ワードプレスのダッシュボードから【プラグイン】→【新規追加】をクリック。


①左上の検索窓にTable of Contents Plusと入力。
②今すぐインストールをクリック。

有効化をクリック。
これでインストールは完了です^^
Table of Contents Plusの設定方法
続いて、設定を行っていきましょう。
ダッシュボードの【設定】→【TOC+】をクリック。

設定画面が表示されました

①目次が表示される位置を決めます。
デフォルトでは、最初の見出しの上に出るようになっています。
そのままにしておきましょう。
②見出しが何個以上あったら目次が表示されるかを決めます。
デフォルトの2のままにしておきましょう。
③目次を表示させたいページを選択します。
post(投稿記事)とpage(固定ページ)にチェックを入れましょう。
④目次の上に表示させるタイトルを記入して下さい。
タイトルがいらない場合はチェックを外します。
⑤チェックを入れておくと、読者が目次を閉じたり開いたりする事が出来ます。
その際に表示させる文字を記入してください。
⑥ページを開いた時に、目次を閉じた状態にするかを決めます。
開いていた方が見やすいので、チェックは入れないでおきましょう。

①目次を断層として表示させるかどうかを決めます。
チェックを入れておきましょう。
②目次の見出し文字に番号を付けるかを決めます。
チェックを入れておきましょう。
③目次の見出し文字をクリックしたときに、パッとジャンプするかスクロールで移動するかを選びます。
④目次の幅の設定です。そのままにしておきましょう。
⑤目次の位地が右よりか左よりかを設定できます。
そのままにしておきましょう。
⑥記事の文章の文字サイズに対して、どのくらいのサイズで目次の文字を表示させるかの設定です。
そのままで大丈夫です。

表示される目次のデザインを決めます。
お好きなものを選んでください。
次に、上級者向け(表示)の文字をクリック。

見出しレベルを設定していきます。

全部にチェックを入れておいて大丈夫ですが、記事を書いていく時に使うのはh2以降でh1は使わないので注意してくださいね。

最後に、設定を変更をクリック。
これで設定は完了です。
記事を見て確認してみて下さいね^^
関連や共通:が目次に表示されてしまう場合

このように目次に関連や共通:が表示されてしまった場合は、

除外する見出しに 関連|共通: を入力したらOKです。
表示がされなくなったか確認してみてくださいね!
変わらない場合は、共有:|関連などと順番を入れ替えてやってみてください。
まとめ
これで、見出しを付けた記事には目次が表示されるようになりました。
見出しは、タイトルを見てどんな内容を書いているのかがすぐに分かるものを付けるのがポイントです。
そうする事で、読者も記事が読みやすくなります。
分かりやすいタイトル付けを意識しましょう^^