Table of Contents Plusとは？使い方と設定方法・表示させるコツ

今回は、ユーザビリティやSEOに良い影響をもたらすWordPressプラグイン「Table of Contents Plus」をテーマとした記事です。

Table of Contents Plusをインストールすると、WordPressページ上に「目次を設置」できます。目次を設置するとユーザーがコンテンツの全体像を把握できるだけでなく、目次をクリックして任意の見出しまで移動できるなど、メリットは1つではありません。

Table of Contents Plusがどのような機能なのかという点にくわえて、使い方やカスタマイズ方法、表示されない場合の設定方法などについて解説します。

Table of Contents Plusは、WordPress上の記事に目次を設置できるプラグインの1つです。記事内に設置した見出し（H1〜H6）を元に目次を自動生成し、目次をクリックしたユーザーを任意の見出しの位置まで移動させます。

特に文字数の多い記事の場合、目次を設置することでユーザーが必要な情報に辿り着きやすくなり、ユーザビリティ向上に役立ちます。プラグインをインストールして有効化するだけで、手軽に導入できるのもメリットです。

またTable of Contents Plusを使えば、サイト訪問者向けにコンテンツ一覧を紹介するHTMLサイトマップも作成できます。

WordPress記事に設置する目次の役割はさまざまです。記事内容を一目で分かるようにする、知りたい情報が書かれた見出しにユーザーを移動させるなど、ユーザビリティの観点から見ると大きなメリットと言えるでしょう。

ここでは、Table of Contents Plusで目次を作成するメリットを解説します。

WordPressプラグインのTable of Contents Plusで目次を作成すると、2つの点からユーザーの利便性を高められます。

1つ目は、ユーザーがサイトの全体像を瞬時に把握できる点です。記事にどのような内容が書いてあるかという情報を事前提供することで、ユーザーの興味を高める効果も期待できます。

2つ目は、目次をクリックすればユーザーが本当に興味のある見出しにすぐ移動できる点です。知りたい情報にスムーズに辿り着ける動線が整っていると、ユーザーにとって使いやすい記事コンテンツとなり、Googleからも評価されやすくなります。

サイトのユーザビリティを向上させたい場合は、Table of Contents Plusを活用するとよいでしょう。

目次と、ヒートマップというツールを併用すれば、サイト内でよく読まれている箇所を把握できます。ヒートマップとは、ユーザーがクリックした箇所やマウスの動き、エリアごとの滞在時間などを色で表現してくれるツールです。

ヒートマップを使えば、目次内のどの見出しがよくクリックされているかを確認できます。目次でほとんどクリックされていない箇所があれば、見出しタイトルを工夫したり、見出し自体を削除してリライトしたりと、さまざまな対策を実施するヒントにもなります。

目次を設置することで、Googleがコンテンツを理解しやすくなる点もメリットです。

Googleは、クローラーと呼ばれるロボットにサイトを巡回させ、検索順位を決める情報を収集します。クローラーはリンクを辿って巡回するため、見出しとリンクした目次を置くことで、クローラーがコンテンツをスムーズに理解しやすくなり、SEO効果が期待できます。

目次に列挙する見出しタイトルには、リンク先の情報を分かりやすくまとめ、本文内容との乖離もなくすなどしてGoogleの評価が下がらないように努めましょう。

目次には、サイトを訪れたユーザーの直帰・離脱を防ぐ効果が期待できます。特定の情報だけ収集したいユーザーは、目次で知りたい情報が記載されているかを確認する傾向があります。

目次がなければ、知りたい情報があるかどうか分からず、スクロールして探すより離脱してしまうケースも珍しくありません。ユーザーの直帰や離脱を予防するには、冒頭に目次を設置して、知りたい情報があることを分かりやすく示す方法が有効です。

目次を設置して適切なタグでマークアップすると、見出しを検索結果に表示できる可能性が高まります。マークアップとは、サイトの文書構造をコンピュータが正しく認識できるよう、タグで意味付けをすることです。

HTMLの場合、見出しを意味するhタグやジャンプリンクに使うaタグなどを適切に設置すると、検索結果のタイトル下に追加のリンクが表示される場合があります。

タイトル下領域に表示されたリンクをクリックすれば、ユーザーは検索画面から直接気になる見出しに移動できます。サイトの利便性向上やクリック数の上昇を狙う場合は、積極的に目次を取り入れましょう。

Table of Contents Plusで目次を作成すれば、サイトの利便性が上がったり、よく読まれている箇所を把握できたりと、さまざまなメリットを得られます。ここからは、Table of Contents Plusのインストール・設定方法について、4ステップに分けて紹介します。

Table of Contents Plusのインストール方法は、ほかのWordPressのプラグインと同じです。まず、WordPressにログインして管理画面を開きましょう。左側にある「プラグイン」というボタンをクリックしたら、続いて表示される「新規追加」をクリックします。

「プラグインを追加」というページが開いたら、右上の検索窓に「Table of Contents Plus」と入力してください。入力後は自動で検索結果が表示されるため、Table of Contents Plusのプラグインを探して「今すぐインストール」をクリックしましょう。

インストール後に表示される「有効化」というボタンをクリックしたら、プラグインの導入は完了です。

インストールしたTable of Contents Plusの基本設定をします。管理画面左側にあるメニューの中から「TOC+」をクリックしましょう。上部に「Table of Contents Plus」と記載されたページが開いたら「基本設定」タブから各種設定を進めます。

まず「位置」という項目で、目次を表示するエリアを決定しましょう。「最初の見出しの前」「最初の見出しの後」「上」「下」という選択肢が表示されるため、サイトに合った位置を選んでください。「上」の場合は記事の最上部、「下」の場合は記事の最下部に目次が表示されます。

次に「◯つ以上見出しがあるとき」という形で表示条件を指定します。◯の部分に指定した数字より見出しの数が少ない場合は、プラグインが正常に動作していても目次は表示されません。

続いて「以下のコンテンツタイプを自動挿入」という項目を設定します。「page」にチェックを入れると固定ページに、「post」にチェックを入れると投稿ページに目次が表示される仕組みです。

下側の「見出しテキスト」「階層表示」「番号振り」という項目では、目次の見出しとして表示される文言や階層表示・見出し番号の有無を指定できます。

また「スムーズ・スクロール効果を有効化」にチェックすると、目次をクリックした際にジャンプではなくスクロールで対象見出しに移動します。「外観」という項目では、目次デザインを調整可能です。

「基本設定」タブの下部にある「上級者向け設定」をすることで、さらに細かな設定を変更できます。上級者向け設定はデフォルトのままでも問題ありませんが、こだわりがある場合は項目ごとの説明文を読んだ上で設定しましょう。

特に注目すべきは「見出しレベル」という項目です。h1やh2といった選択肢が並んでおり、チェックを入れた見出しのみが目次に表示されます。設定は後から変更できるため、初心者はまずデフォルト設定のまま使用して、慣れてから調整するのもおすすめです。

Table of Contents Plusでは、目次だけでなくHTMLサイトマップも作成できます。サイトマップをつくるには、基本設定の右横にある「サイトマップ」というタブを開きましょう。

サイトマップのタブでは、固定ページリストやカテゴリリストの表示設定を変更できます。また、サイトマップの見出し設定や固定ページ・カテゴリページのラベルも調整可能です。

設定後、ページに[sitemap]のショートコードを貼り付けることで、自動でサイトマップを表示できます。なお、サイトマップの作成が不要な場合は、設定変更は必要ありません。

Table of Contents Plusでは、ショートコードを使用することで、特定ページの目次を好きな場所に移動させたり非表示にしたりできます。

ここでは、Table of Contents Plusのカスタマイズに使えるショートコードを2種類紹介するため、ぜひ記事作成の参考にしてください。

目次を好きな場所に移動させたい場合は、記事内に[toc]のショートコードを貼り付けましょう。原則として、目次は基本設定の「位置」の項目で選択した場所に表示されます。しかし[toc]を手動挿入することで、基本設定とは異なる場所に自由に目次を移動可能です。

[toc]を使用したページには「位置」で選択した場所の目次は表示されないため、目次が重複する心配はありません。記事構成の都合で、特定ページだけ目次の表示位置を変えたい場合は、[toc]のショートコードを活用してみてください。

記事の本文中に[no_toc]のショートコードを設置すれば、特定ページのみ目次を非表示にできます。[no_toc]の設置場所は、本文中であればどこでも問題ありません。

通常、目次が入っている記事冒頭に設置すれば、後から見直した際に非表示になっていることが分かりやすくなります。目次を表示させたくない記事があれば、[no_toc]のショートコードを活用しましょう。

Table of Contents Plusの機能を生かして正しく目次を表示させるには、h1～h6までの見出しタグを正確に記述することが大切です。

ここでは、Table of Contents Plusで正しく目次を表示させるコツを2つ紹介します。ぜひ、これから目次を作成する際の参考にしてください。

記事には、見出し用のHTMLタグを記述しましょう。見出し用のHTMLタグには、以下の6種類があります。

使用するのはh1〜h6までのタグで、h7以降はありません。h1は最も上位の見出し階層で、通常は記事タイトルを記載します。h2は大見出し、h3は中見出しというように、数字が増えるごとに階層が下がる仕組みで、下の階層の見出しは上の階層の見出しに包括されます。

見出しタグを使用する際は、<h1>記事タイトル</h1>、<h2>大見出し</h2>のように、見出しタイトルをタグで挟むように記述しましょう。タグに記述ミスがあると、正常に見出しや目次が表示されないため注意が必要です。

見出しタグは、階層のルールに沿って記述します。最上位の見出しであるh1は、記事中で1度だけ使用するのが基本です。多くの場合、トップページならサイトタイトル、記事ページなら記事タイトルを記載します。

記事本文では、主にh2〜h6のタグを使います。h2〜h6タグの使用回数にルールはありませんが、見出しの順番は守りましょう。例として、記事ページを作成するときは以下のような見出し階層を意識してみてください。

h2のテーマを複数のセクションに分けたいときはh3、h3のテーマをさらに複数に分けたい場合はh4を使うイメージです。見出しデザインなどの都合で、h2の下にいきなりh4を設置するような構成にすると、階層構造が乱れてしまうため注意しましょう。

HTMLの見出しタグとは｜効果的な使い方や正しく使う方法を解説

見出しタグを正しく使用することで、ユーザーが理解しやすいコンテンツになったり、検索エンジン最適化につながったりします。当記事では、見出しタグ（hタグ）の概要やメリット、見出しタグの書き方から、正しい使い方・効果的な使い方まで解説します。

Table of Contents Plusを使用中、設定したはずの目次が表示されなかったり、表示されていた目次が急に表示されなくなったりすることがあります。

表示されていた目次が非表示になった場合、プラグイン更新時に「見出しレベル」の設定が初期化されている可能性があります。設定画面の「上級者向け設定」を開き、見出しレベルにチェックを入れ直しましょう。

ここでは、Table of Contents Plusのインストール・初期設定後に見出しが表示されないケースの対処方法を解説します。

プラグインが有効化されているかを確認し、無効になっている場合は有効化しましょう。プラグインが有効化しているかどうかは、WordPress管理画面で「プラグイン」→「インストール済みプラグイン」で確認できます。

Table of Contents Plusという名称の下に「有効化｜削除」の文言が出ている場合は、プラグインが無効化しているため、有効化をクリックしましょう。「設定｜停止」という文言が出ていればプラグインは有効化しており、目次が表示されない原因は別にあると考えられます。

WordPressの管理画面で「TOC+」をクリックし「基本設定」タブの「以下のコンテンツタイプを自動挿入」の設定を確認しましょう。Table of Contents Plusでは、設定項目で「page」にチェックを入れると固定記事に、「post」にチェックを入れると投稿記事に目次が表示されます。

例えば、投稿記事に目次が表示されない場合「post」にチェックが入っているかどうかを確認してください。コンテンツタイプを正しく設定することで、記事に目次が表示される可能性があります。

「基本設定」タブの「表示条件」の項目も確認しましょう。「◯つ以上見出しがあるとき」という表示があり、◯に入っている数字より記事の見出し数が少ない場合は、見出しが表示されません。該当する場合は、◯に入る数字を小さくするか、見出し数を増やすことで目次を表示できます。

「基本設定」タブの下部にある「上級者向け設定」から「見出しレベル」の項目をチェックしてみてください。h1やh2などの選択肢が並んでおり、左側のボックスにチェックを入れた階層の見出しのみ目次に表示されます。チェックがすべて外れている場合、目次が表示されないため注意が必要です。

WordPressプラグイン「Table of Contents Plus」をインストールすると、ページ上に目次を設置できたりHTMLサイトマップを作成できたりします。目次を設置するメリットは、ユーザビリティ向上とSEO効果が期待できる点です。

ユーザーだけでなくGoogleからもサイト評価向上につながるため、目次を設置していない方は、ぜひTable of Contents Plusをインストールして活用しましょう。