簡単・おしゃれな目次自動生成プラグイン「Rich Table of Contents」

2021-07-29WordPress・プラグイン

はじめに

記事内から見出し（<h1>～<h6>）タグを拾い出して自動で目次の生成をしてくれる便利なプラグインは色々ありますが、有名なのは以下の２つです。

• Table of Contents Plus
• Easy Table of Contents

それぞれの使い方については以下をご覧ください。

 

上記2種のプラグインは、設定項目もデザインもよく似ていて、ほとんど変わりがありません。

 

「Rich Table of Contents」の特徴

上記２つのプラグイン同様の表示条件などの設定はもちろん可能ですが、独自の特徴があります。

 

初期デザインサンプル

 

インストール

プラグイン名：Rich Table of Contents

新規追加から検索し、インストール→有効化

 

設定

有効化するとダッシュボードメニューに「RTOC設定」が表示されます。

 

 

※選択すると右側にプレビューが表示されます。

 

同様に、枠のデザイン（５パターン）、表示アニメーション（３パターン）から好みのものを選択します。

枠のサンプル

 

 

カラーパターンのサンプル

 

カスタムカラーにする場合は、その下にある「カラー設定」から好きな色を指定できます。

※こちらで色を変更しても、プレビューが表示されます。

 

ボタンの位置やテキストなど細かな設定も可能。

 

最後に「変更を保存」を押します。

 

以上で完了です。

 

設定項目では変更できないカスタマイズは以下も参考にして下さい。

 

ショートコード

ショートコードタブで、表示されるコードを記事内に挿入する事で、好きな位置に目次を表示する事も可能です。

１つの記事内に１つしか設置できないので、通常の自動挿入の目次利用をしている場合は使えません。

 

値	コード	解説
title=""	任意のテキスト	目次のタイトルを設定できる項目です。この値が設定されていない場合管理画面の設定が反映されます。
title_display=""	left,center	leftを入力するとタイトルは左寄せ、centerを入力するとタイトルは中央寄せになります。
heading=""	h2,h3,h4	どの見出しを表示させるかを設定できます。例えばh3としておくと、h2〜h3までの見出しが目次に表示されます。
list_h2_type=""	round, number1, number2	roundを入力すると●が、number1,number2を入力すると数字がh2見出し前に表示されるようになります。
list_h3_type=""	round, number1, number2	roundを入力すると●が、number1,number2を入力すると数字がh3見出し前に表示されるようになります。
display=""	open, close	openと入力すると目次が開いた状態で、closeと入力すると目次が閉じた状態で表示されます。
frame_design=""	frame1, frame2, frame3, frame4, frame5	目次の枠のデザインを設定できます。
animation=""	fade, slide, none	目次の表示アニメーション設定を行うことができます。