ワードプレスの目次プラグインTable of Contents Plusの使い方

目次プラグインイメージ

ワードプレスでブログ記事をアップしたりオウンドメディアでコンテンツを作成する方は沢山います。誰でも無料でハイクオリティな情報サイトを作ることもできるため、サイトもコンテンツの質も年々、向上している傾向があり、記事のボリュームもアップしています。

1つのコンテンツの量が増えてきた際に非常に便利なのが目次機能です。

ワードプレスの目次機能は、目次に表示される見出しをクリックすることで目的の位置までジャンプすることができるようになっているため、長文の記事でも興味のある部分だけをつまみ食いすることができるようになりユーザーにとっても優しいコンテンツになります。

今回は、そんな便利な目次機能をショートコード1つで簡単に貼り付けることができるようになるプラグイン「Table of Contents Plus」の使い方を解説します。

設定は非常に簡単ですので、是非チャレンジしてみてください。

スポンサーリンク

目次の効果

table of contents plus

ワードプレスに目次を活用することによってユーザー視点でコンテンツが見やすくなるのはもちろんですが、SEO的にも有利に働くと言われています。

ブラウザで検索された時に目次を挿入した記事の場合、検索画面に目次の見出しが表示されることがあります。

タイトルに関連性の強い見出しが検索画面に表示されることによってユーザーからのクリック数がアップする可能性が高まり、検索上位になりやすいと言われています。

目次を使用した前ページが表示されるわけではありませんがSEOの視点から見ても少なからず分かりやすいコンテンツとして有利に働くことは確かでしょう。

Google検索結果

目次を活用することによる効果としてもう一つ上げられるのがコンテンツを作成する側として目次を意識することで、より明確なコンテンツを作りやすくなるということです。

文章の書き方にルールは特にありません。ただ人に分かりやすく物事を伝える上では一定の流れがあります。

コンテンツを作成する上で、まず目次を設定することで文章の質が上がりやすくなります。大筋の地図のような役目を果たす目次を設定することでゴールへの道のりが明確になり、流れを意識しやすくなるのは間違いありません。

現在、全く意識せずに文章を書くだけの方は是非、目次を活用して流れや起承転結のようなものを設定してから文章を書き始めてみてください。

きっとコンテンツの質がレベルアップするはずです。

Table of Contents Plusの使い方

ワードプレスの目次機能を簡単に設置できるプラグインの中で最もメジャーなプラグインである「Table of Contents Plus」の使い方を解説していきます。

事前にプラグインのインストールと有効化をしておきましょう。

プラグインのインストールが完了したら、まずはじめに管理画面から「設定」→「TOC+」をクリックして設定画面に入りましょう。

TOCをクリック

初期設定の画面が開きます。上から順に確認していきましょう。

TOC設定画面

  • 位置:目次の位置を選択します。
  • 表示条件:見出しが何個以上で目次を設置するか選択します。
  • 以下のコンテンツタイプを自動挿入:自動挿入するコンテンツタイプを選択します。
  • 見出しテキスト:目次のタイトルや表示/非表示の表記などを指定します。「最初は目次を非表示」にチェックを入れることでコンテンツが表示された時に目次を非表示にすることもできます。
  • 階層表示:チェックを入れると見出しの種類による階層表示ができます。
  • 番号振り:チェックを入れると見出しの大きさに対して番号が降られます。
  • スムーズ・スクロール効果を有効化:チェックを入れると目次までジャンプするのではなくスクロール動作で移動します。

外観

  • 横幅:目次の横幅を指定します。基本的にはデフォルトの「自動」を選択しておくことをおすすめします。
  • 回り込み:左右の回り込みを選択できます。
  • 文字サイズ:目次のテキストサイズを指定します。
  • プレゼンテーション:目次のデザインを選択できます。5種類のデザインと自分で色を指定できるカスタムが用意されています。

上級者向け

  • 小文字:アンカータグが小文字のみであることを確認したい場合はチェックを入れます。
  • ハイフン:アンカータグでハイフンを使用したい場合はチェックを入れます。
  • ホームページを含める:チェックを入れるとホームページ上でも見出しの数に応じて目次を表示します。
  • CSSファイルを除外:プラグインのCSSを読み込みたくない方はチェックを入れてください。
  • テーマの見出し番号を保持:テーマで使用しているリストマークなどを使用したい場合はチェックを入れます。
  • 見出しレベル:H1〜H6の見出しのチェックを外すことによって、特定の見出しを目次に含めないように設定できます。
  • 除外する見出し:ここに入力したテキストが見出しに入力された場合、目次を非表示にすることができます。
  • パス限定:こちらにパスを設定することで、パスを使用したページでのみ目次を表示することができます。
  • アンカーのデフォルト接頭辞:ページ内リンクのアンカーに使用したいテキストがある場合は、こちらに入力します。

サイトマップとヘルプはデフォルトのままで問題ありませんので割愛します。

上級者の設定も基本的にはデフォルトのままで大丈夫です。

これで設定は完了しました。

次に実際にコンテンツを作成して例を見てみましょう。記事作成画面で見出しを使いながら記事を作成します。

この時、プラグインで設定した見出しの数が入れば目次は自動で生成されます。

ただ自分で目次の位置を指定したい方も多いはず。そんな時は下画像のようにショートコードを挿入します。[toc]←ここでは全角の[]を使用していますが、半角にして挿入してください。

ショートコードを登録できるプラグインをインストールしておくと便利ですね。コンテンツの作成が完了したら保存して確認してみましょう。

TOC設定の確認

実際に表示される目次を確認してみました。

しっかりとコンテンツの特定の部分に目次が挿入されています。目次をクリックすることで瞬時に移動できるので、ユーザーにとっても快適ですね。

見出しの大きさを変えることで自動的に入れ子状態にして番号を振ってくれる機能も便利ですね。

目次の表示サンプル

目次を表示したくないコンテンツがある場合は記事内に下画像のようにショートコードを入力することで見出しを使った場合でも目次が表示されなくなります。

[no_toc]←実際に使用する時は半角の[]を使用してください。

目次を表示させないショートコード例

以上でTable of Contents Plusは完了です。

Table of Contents Plusのまとめ

Table of Contents Plusを活用することで誰でも簡単に目次を利用することができます。

過去に作成した記事であっても見出しを利用していれば目次が自動生成されるのでコンテンツの量が沢山有る方にも快適に使用できます。

1つのコンテンツのテキストの量も増えている昨今のメディアで、目次のないコンテンツと目次のあるコンテンツではユーザーの快適性に大きな違いが生まれます。

自分の興味のある部分のみを読みたいユーザーやより分かりやすいコンテンツが見たいユーザーにとって目次は必須条件とも言えます。

プラグインを活用して簡単に設定でき、SEO対策にもなるので是非この機会に目次を導入してみてください。

スポンサーリンク