Rich Table of Contentsの使い方を解説！表示されない時の対処法も

ここでは記事の目次を作成するプラグイン、Rich Table of Contentsの使い方を解説していきます。

目次が表示されない時の対処法や入力項目のおすすめ等についても触れていきます。

WordPressで目次作成プラグインで悩んでいる方は是非参考にしてみて下さい。

カツオ

先にこの記事のポイントをまとめますね！

Rich Table of Contentsの使い方はそんなに難しくない。
目次が表示されない時は「目次を表示させるページ」「表示条件」を確認しよう。
読者に分かりやすい名前の目次にしよう。

カッパ君

という事で本文に入っていきますよ！

タップできる目次

Rich Table of Contentsの使い方を解説！
1. 基本設定
2. 応用設定
Rich Table of Contentsの目次が表示されない時の対処法！
目次を作る時のポイントを解説！

Rich Table of Contentsの使い方を解説！

①「プラグイン」→「新規追加」で「Rich Table of Contents」と検索し、インストールし有効化します。

②有効化するとメニューに「RTOC設定」と表示されますので、そちらをクリック。

③「Rich Table of Contents」の画面にジャンプしますが、基本的な使い方は「目次設定」の項目を調整する事で事足ります。

④目次設定では

基本設定
デザイン設定
プリセットカラー設定
カラー設定（上級者向け）
応用設定

と設定項目が用意されていますが、特に重要なのが「基本設定」と「応用設定」です。

カツオ

その他は自分の感覚で色々触って、理想形に近づけていく、くらいの感じでOK。

基本設定

各入力項目について表で解説していきます↓

目次のタイトル	文字通り、目次のタイトルを入力しましょう。よくあるパターンではcontents、もくじ、目次とありますが、読者が「あ、これは目次なんだ」と分かりやすい文言が良いです。
目次を表示させるページ	「投稿」と「固定ページ」、目次を表示させたいものにチェックをいれましょう。僕は両方にチェックを入れてます。
表示させる見出し設定	「H2まで表示」から「H4まで表示」を選択できます。 H4まで表示させるとかなり目次が長くなってしまう事もあるので、僕はH3までとしていますが、好みですね。
表示条件	ここで設定した見出しの数以上の見出しがある場合に目次が表示されます。多すぎる数を入力すると目次が表示されなくなるので注意。
フォント設定	好みです。色々試して、好みのフォントを選びましょう。

カツオ

とりあえずソッコーで目次を使えるようにしたいという人は下記の通り設定してください。

目次のタイトル
→「タップできる目次」と入力。
目次を表示させるページ
→「投稿」「固定ページ」の両方をチェック。
表示させる見出し設定
→H3
表示条件
→2

「色々設定があって、よく分からん！」という人は「基本設定」で上記のように設定しておけばOK。

最悪、これだけやっておけば目次が出来ますので。

細かいところは使いながら調整してみて下さい。

応用設定

こちらでも各入力項目について表にて説明していきますね↓

目次に戻るボタン	スマホでブログを見た際に表示される「目次に戻るボタン」を表示させるかどうかを選択します。
目次に戻るボタンの位置	「目次に戻るボタン」の位置をスマホ画面の右か左か決めます。
目次に戻るボタンのテキスト	「目次に戻るボタン」のテキストを決めます。僕は「目次へ」にしてます。
上下調整	「目次に戻るボタン」の上下の位置を調整します。スマホでの表示は微妙な位置の違いでユーザービリティが違ってきますので、研究したい方はいじってもいいでしょう。僕はデフォルトのまま使用してます。
除外する投稿ID	「目次に戻るボタン」を表示させたくない投稿のIDを入力します。
除外する固定ページID	「目次に戻るボタン」を表示させたくない固定ページのIDを入力します。
Table of Contents default display settings	目次を最初から表示させるか、閉じておくかを選択します。
開閉ボタンの開くテキスト	「OPEN」や「開く」が一般的です。
開閉ボタンの閉じるテキスト	「CLOSE」や「閉じる」が一般的です。
プラグインのCSSを読み込まない	これにチェックを入れると、Rich Table of Contentsの設定で調整したデザインが反映されません。独自にCSSなどをいじって、デザインしたい人はチェックを入れますが、ほとんどの場合はチェックを外しておいてOK。