WordPressにアンカーリンク付きの目次を記事内に自動挿入させるプラグイン「Table of Contents Plus」

WordPressのカスタマイズ プラグイン

疑問点の解決に急ぐユーザーにとって、ページが持つ情報を簡潔にまとめてくれる目次の存在はありがたいものです。
ただ毎度いそいそリンク貼って用意するのはできなくはないですが、手間がかかります。かかりました(実体験)
せっかくのワードプレスなので、こういう面倒はプラグインでさくっと解決してしまいましょう。

今回はそんな便利な見出しを元にページ内リンク付きの目次を自動で入れてくれるプラグイン
「Table of Contents Plus」をご紹介します。

Table of Contents Plus をインストールする

管理画面サイドバーのプラグイン->新規追加から、検索窓に
Table of Contents Plus」と入力して検索します。

見つかったのでこちらをインストール。
有効化も忘れずに。

目次の設定をする

目次の設定はプラグイン一覧、もしくはサイドバーの設定->TOC+ の設定ページから行います。


設定ページはこんな感じです。
基本的な設定から、上級者向けの設定まで用意されています。
上級者向け設定は「上級者向け」の右にある(表示)をクリックして展開できます。

位置

目次を表示させる位置を選べます。

最初の見出しの前(デフォルト) この位置がデフォルトです。記事の中で1つ目の見出しより前に表示します。
最初の見出しの後 記事の中で1つ目の見出しの次に表示します。
記事本文の前に表示します。
記事本文の後ろに表示します。

表示条件

目次を表示させるための条件を設定することができます。
ここでは記事に含まれる見出しの数から設定できます。

以下のコンテンツタイプを自動挿入

ここではショートコードなどを使わず自動で挿入させる投稿タイプを指定できます。
他のプラグインやカスタム投稿タイプなどで増やした投稿タイプも選択できます。

post 普通の投稿に自動挿入したい場合ここにチェックを入れます。
page 記事の中で1つ目の見出しの次に表示します。
(カスタム投稿タイプ名) カスタム投稿タイプも選択できます。特定のカスタム投稿タイプにのみ設定もできます。

見出しテキスト

目次リストの上に表示させる文字です。当サイトでは「目次」にしています。
その他、閲覧者に表示・非表示を切り替えさせるかの設定があります。

階層表示

見出しタグの通りに入れ子表示にするか選択できます。

番号振り

見出しの前に連番を入れてくれます。

スムーズ・スクロール効果を有効化

ぬるっとスクロールしてくれます。

外観

目次のデザインを変更することができます。

横幅 目次の横幅を設定できます。
pxで設定する固定幅、%で設定する相対幅、px/%/emで設定するユーザー指定があります。
回り込み 目次を
文字サイズ カスタム投稿タイプも選択できます。特定のカスタム投稿タイプにのみ設定もできます。
プレゼンテーション 大まかなスタイルを選択できます。(6種)

プレゼンテーションで「カスタム」を選択すると詳細な色味を設定できます。

上級者向け

他にも、目次に含む見出しレベルの指定や、特定の文字のみ除外する指定など
上級者向けの詳細な設定ができます。

設定した条件の記事に目次が表示される

上の設定で自動挿入を指定していれば、その条件にあたる記事には
自動で表示されるようになっているはずです。

手動で目次を表示させたいときはショートコード

自動挿入させない条件の記事にも目次を表示させたい場合、
記事本文の目次を入れたい場所に以下のショートコードを入れれば表示できます。

[toc]

まとめ

手動で一つ一つアンカーリンクを打っていく手間がプラグイン一つでなくなりました。
設定が簡単でカスタマイズ性の高いプラグインなので、どのテーマでも手軽に利用できるのがいいですね。
記事を見る側としても目次の存在はありがたいので、是非是非インストールしてみてください。
 

WordPressのカスタマイズ プラグイン

関連記事