WordPress

WordPressの投稿ページに目次を自動で表示する方法

目次とは

WordPressは、ページ内のh2,h3,h4などの見出しタグから自動で目次を表示することができます。

目次を表示することによって、ユーザーに対してページのコンテンツを分かりやすく伝えられるだけでなく、検索エンジンに対してもページのコンテンツを伝える役目を果たしてくれます。

特にコンテンツの量が多いページになると、目次無しではかなり読みづらくなってしまうので、事情が無ければ目次は表示するようにした方がいいでしょう。

目次を追加するプラグイン

WordPressの投稿に目次を自動で追加してくれるプラグインが、Table of Contents Plusです。

インストールするだけで簡単に目次を追加することができ、カスタマイズもできる万能プラグインです。

上記のプラグイン以外にも目次を表示できるものはありますが、使いやすさや分かりやすさではこのプラグインが最もおすすめだと思います。

Table of Contents Plusの設定方法

まずは、WordPressの管理画面からプラグイン>新規追加を選択し、「Table of Contents Plus」のインストールと有効化を行います。

有効化が完了したら、管理画面の「設定」の中に「TOC+」という項目が新しく追加されるので、そこを開くと、下記のような設定画面が表示されます。

おすすめの設定は、下記の通りです。

  • コンテンツタイプの「post」を選択
  • 表示条件を3つ以上に変更
  • 番号振りをオフに変更

デザインをカスタマイズする方法

TOC+では、予め用意されている目次のスタイルがいくつかありますが、自分でCSSを書いてカスタマイズすることも可能です。

  1. TOC+の設定画面の一番下にある「上級者向け」をクリック
  2. 「CSSファイルを除外」にチェックを入れる
  3. 「設定を更新」をクリック

これで、プラグイン側のCSSは出力されなくなるので、自分でCSSを書けばオリジナルのスタイルを当てることができます。