このブログでは、↓このように記事の目次を表示しています。
この目次の表示には、Table of Contents Plusというプラグインを使っています。
今回はTable of Contents Plusの基本的な使い方と設定方法を説明します。
Table of Contents Plusとは
Table of Contents Plusは、ブログ記事の目次を表示するプラグインです。
プラグインを導入するだけで目次を利用することはできますが、自分で設定をすると、好きな見出し階層（H2、H3など）のみの目次を表示したり、目次のデザインを変更することもできます。
プラグインの導入方法
WordPress管理画面左側のメニューから[プラグイン]→[新規追加]をクリックします。
Table of Contents Plusが表示されたら、[今すぐインストール]をクリックしてプラグインのインストールをします。
インストールが済んだら有効化してください。
使い方
目次が自動挿入になっている場合は、指定の場所に自動で挿入されます（何も設定していなければ自動になっています）。
ここでは手動で挿入する場合の使い方を説明します。
自動挿入をやめる方法は後述しています。以下のコンテンツタイプを自動挿入の項目を確認して下さい。
任意の位置に目次を挿入する方法
記事の投稿画面で、任意の位置にショートコード[ toc ]を入力します。（コピペする場合はtocの両側のスペースを削除してください。）
これで、基本の目次が表示されます。
▼今回の記事の見出し
H2（見出し2）のみ表示する
ショートコードに要素を追加することで、目次を変更することができます。
[ toc heading_levels=2 ]
目次のタイトルを変更する
[ toc label=”もくじ” ]
基本設定
Wordpress管理画面左側の[設定]ー[TOC+]をクリックします。
Table of Contents Plusの設定画面が表示されます。
1つずつ説明していきます。
位置
目次を表示する位置を設定します。
この設定は、Table of Contents Plusの目次を自動で表示する場合のみ、有効です。
表示条件
見出しがいくつ以上あるときに目次を表示するかを設定します。
例えば、3に設定したとき、見出しが2つ以下しかない記事には目次は表示されません。
以下のコンテンツタイプを自動挿入
ここでチェックを入れたコンテンツタイプでは、自動で目次が表示されます。
例えば、「post」にチェックを入れると、記事ページでは自動で目次が表示されます。
その際には、「位置」で選択した位置に表示されます。
僕は手動でショートコードを使って挿入しているため、チェックを外しています。
見出しテキスト
目次タイトルを表示するか、表紙する場合は表示名を設定します。
「ユーザーによる目次の表示・非表示を切り替えを許可」にチェックを入れると、ユーザー（読者）が目次の表示・非表示を切り替えられるようになります。
「最初は目次を非表示」にチェックを入れると、記事の読み込み時は目次が非表示になります（読者が自分で表示させることができます）。
階層表示、番号振り、スムーズ・スクロール効果を有効化
「階層表示」にチェックを入れると、H2、H3などの階層に合わせて目次がインデントされます。
チェックを外すと階層表示がされなくなります。
「番号振り」にチェックを入れると、目次に自動で番号が振られます。
横幅
「横幅」では目次の横幅を設定します。
▼自動（デフォルト）
▼100%
プレゼンテーション
目次の見た目を設定します。
「カスタム」を選択すると、色を自分で設定することができます。
上級者向け設定
上級者向け設定は色々ありますが、使いそうなものを説明します。
CSSファイルを除外
「CSSファイルを除外」にチェックを入れると、Table of ContentsのCSSを読み込まない設定になります。
自分でスタイル指定をする場合などに使います。
▼チェックを入れた場合。何も装飾しないと番号なしリストの表示になります。
見出しレベル
ここで設定したレベルの見出しのみ表示されます。
ショートコードを利用して見出しを挿入する場合、ショートコードで個別に指定することもできます。
▼H2、H3
▼H2のみ
さいごに
Table of Contents Plusはとても便利なプラグインで、多くのブログで利用されています。
カスタマイズもしやすくて良いと思います。
Comments