MENU
無料でプレスリリース「ブロググ」
WP-Search
WordPressサイト解析「WP-Search」
WP-Search

Rich Table of Contentsの設定方法と使い方【JIN:RやJINにおすすめ】

この記事では、目次プラグイン「Rich Table of Contents」の初期設定と使い方を、画像を用いてわかりやすくご紹介します。

RTOC」の略称でお馴染みの国産プラグインで、JIN・JINRの開発チームが開発しています。

Rich Table of Contents」は、WordPressテーマ「JIN:R」を使用する場合に特におすすめです。

suya

初心者向けの目次プラグインです。

なるほどくん

なるほど!簡単そうですね。

JINの開発チームから、新テーマ「JIN R」が発売開始されました。(2022年11月)

詳しくは以下をご覧ください。

この記事でできること
  • Rich Table of Contents」の初期設定が完了できる
  • 設定項目の重要度がわかる
  • サイドバー目次追尾の設定方法がわかる
この記事を書いた人

suya @suyasite

この記事を最後まで読めば、WordPress(ワードプレス)で目次生成がすぐ完了します。

ぜひ最後まで進めてみてください。

すでに途中まで進めている人は、目次から該当箇所に飛ぶこともできます。

\ かわいい&おしゃれ /

目次

目次プラグインが必要なケース

目次プラグインは、使用テーマに目次機能がない場合、もしくは目次機能はあっても機能が不足している場合などに使用します。

目次機能のないテーマ
目次機能のあるテーマ

「Rich Table of Contents」はJIN:Rテーマの必須プラグイン

WordPressテーマ「JIN:R」を利用する場合は、必ずインストールするようにしてください。

既存の目次プラグインがある場合も、JIN:Rとの相性もあるので可能なら移行することをおすすめします。

その他の目次プラグインの例

Rich Table of Contents」とWordPressテーマ「JIN:R」は開発者が同じなので、JIN:Rとの相性も抜群です。

目次機能のあるWordPressテーマの場合は、機能が重複することがあります。

1) プラグイン「Rich Table of Contents」をインストール

WordPress(ワードプレス)にログインしたら、左メニューの[プラグイン][新規追加]をクリックして、[プラグインの検索]をします。

WordPress(ワードプレス)のプラグインを検索して新規追加
[プラグイン]→[新規追加]から、[プラグインの検索]

Rich Table of Contents」を検索して、[今すぐインストール]した後に[有効化]します。

WordPressプラグイン「Rich Table of Contents」のインストール
「Rich Table of Contents」をインストール・有効化

以上で、目次プラグイン「Rich Table of Contents」のインストール・有効化は完了です。

2) プラグイン「Rich Table of Contents」の初期設定

デフォルト設定のままでも大丈夫な項目が多いです。

変更したほうがいい項目がわかりやすいように、重要度別に記すので参考にしてください。

1) 目次設定 – 基本設定(重要度:

左メニューの[RTOC設定]から[目次設定]を開き、[基本設定]タブを開きます。

設定はほぼこの1ページで完了します。

WordPressプラグイン「Rich Table of Contents」の目次設定(基本設定)
RTOCの基本設定
重要度設定項目説明
目次のタイトル目次上のタイトル
→ わかりやすいタイトルに変更
目次を表示させるページ投稿、固定ページから選択
→ 固定ページに表示したくない場合は変更
表示させる見出し設定H何まで目次に表示するか
→ お好みで
表示条件見出しが何個から目次を表示するか
→ お好みで
フォント設定目次のフォント設定
→ 外部読み込みのあるNoto Sans以外で

フォント設定をNoto Sansにすると、外部サーバーからアイコンフォントの読み込みが発生します。

表示速度の高速化を優先する場合は、Noto Sansを選択しないようにしましょう。

2) 目次設定 – デザイン設定(重要度:

WordPressプラグイン「Rich Table of Contents」の目次設定(デザイン設定)
RTOCのデザイン設定
重要度設定項目説明
タイトル表示設定左寄せか中央寄せか
→ お好みで
H2のリスト形式丸、番号など
→ お好みで
H3のリスト形式丸、番号など
→ お好みで
枠のデザイン→ お好みで
表示アニメーションフェード、スライド、なし
→ お好みで
スムーススクロール設定なめらかに動くスクロール
→ 長文記事が多いならOFFに変更

長い記事の場合、スムーススクロールは該当箇所に移動するのに時間がかかります。

そのため、長文記事が多い場合はOFFに設定しておきましょう。

3) 目次設定 – プリセットカラー設定(重要度:

WordPressプラグイン「Rich Table of Contents」の目次設定(プリセットカラー設定)
RTOCのプリセットカラー設定
重要度設定項目説明
定番カラーデザイン済みのカラーセットを選択
→ お好みで

4) 目次設定 – カラー設定(重要度:

WordPressプラグイン「Rich Table of Contents」の目次設定(カラー設定)
RTOCのカラー設定
重要度設定項目説明
カラー設定細かくカラー設定を変更
→ お好みで

5) 目次設定 – 応用設定(重要度:

WordPressプラグイン「Rich Table of Contents」の目次設定(応用設定)
RTOCの応用設定
重要度設定項目説明
目次に戻るボタン目次に戻るボタン
→ トップに戻るボタンがあるならOFFに変更
PCでも目次に戻るボタンを表示PCでも目次に戻るボタン
→ お好みで
TOPページに目次を表示させないトップページの目次表示
→ 固定ページを設定しているならONに変更
目次に戻るボタンの位置左寄せか右寄せか
→ お好みで
目次へ戻るボタンのテキスト目次に戻るボタンの説明文
→ お好みで
上下調整目次に戻るボタンの位置
→ お好みで
除外する投稿IDIDで投稿除外
除外する固定ページIDIDで固定ページ除外
目次のデフォルト表示設定最初から表示させるか、閉じておくか
→ お好みで
開閉ボタンの開くテキスト最初から表示させる場合
→ お好みで
開閉ボタンの閉じるテキスト最初から表示させる場合
→ お好みで
開閉ボタンを非表示にする開閉ボタンの有無
→ お好みで
プラグインのCSSを読み込まない自分でデザインするときの設定
→ CSS書かないならOFFのまま
7日間目次使用率を計測する目次使用率をエディタ画面下部に表示
→ 計測したいならONに変更

目次に戻るボタンは、以下のように表示されます。

WordPressテーマ「JIN:R」の目次に戻るボタン(Rich Table of Contents)
RTOCの目次に戻るボタン(SP)

変更したら、忘れずに[設定を保存]をクリックしてください。

6) ショートコード

目次は、ショートコードでも設置できます。

[rtoc_mokuji title="" title_display="" heading="" list_h2_type="" list_h3_type="" display="" frame_design="" animation=""]

3) サイドバーに目次を追尾表示する方法

上記のショートコードを、追尾サイドバーウィジェットに設置すれば、目次を追尾表示することができます。

JINRの場合、以下のように「サイドバー追尾【PC】」にカスタムHTMLなどで記載します。

WordPressテーマ「JIN:R」のサイドバー追尾ウィジェット(Rich Table of Contents)
RTOCのサイドバー追尾ウィジェット(PC)

JINRだと、以下のように表示されます。

WordPressテーマ「JIN:R」のサイドバー追尾目次(Rich Table of Contents)
RTOCのサイドバー目次追尾表示(PC)

この記事のまとめ

プラグイン「Rich Table of Contents」の初期設定と使い方を見てきました。

重要度の高いところだけでも、設定を確認してみてください。

なるほどくん

設定忘れてました。

JINの開発チームから、新テーマ「JIN R」が発売開始されました。(2022年11月)

詳しくは以下をご覧ください。

読者の声を紹介させてください

この記事をご紹介いただいた方がいらっしゃいましたら、読者の声として掲載させていただきます。

ぜひご連絡いただければと思います。

この記事が役に立ったらご紹介ください!

コメント

コメントする

目次