【WordPressプラグイン】Rich Table of Contents でおしゃれな目次が作れる!

ブログ初心者

本ページはプロモーションが含まれている場合があります。

ちち
ちち

今回は、WordPress初心者のちちが、使用中のプラグイン、簡単におしゃれな目次がつくれる、「 Rich Table of Contents 」のご紹介です!

スポンサーリンク

WordPressに簡単に目次を作る方法

簡単におしゃれな目次をつくれるプラグイン、「 Rich Table of Contents 」

通称「 RTOC 」をインストールすれば、初心者でも簡単につくることが出来ます!

RTOCプラグインは、人気のWordPressテンプレート「JIN」を作ったひつじさんという方が作られた国産の目次作成の無料プラグインです。

このRTOCプラグインは、項目に沿って選択していくだけで初心者でも簡単にWordPressに目次が設定出来て、色合いも自分好みにつくることが出来ます。


RTOCプラグインの導入方法

それではWordPressの管理画面から、 RTOCプラグインを導入しましょう。


RTOCプラグインのインストールの流れ

  1. WordPress管理画面
  2. プラグイン
  3. 新規追加
  4. 右上検索ボックスに、RTOCと入力して検索
  5. インストール
  6. 有効にする

次に、初期設定をします。


RTOCプラグインの初期設定

インストール、有効化した後、ダッシュボードのメニュー欄に 「RTOC設定」が追加されます。

右側には、目次デザインのプレビューが表示されます。

設定をしながら、目次デザインの確認が出来ます。


基本設定

  • 目次のタイトル…デフォルトでは、Contentsになっています。分かりやすく日本語で、「目次」などでも良いと思います。
  • 目次を表示させるページ…「投稿」と「固定ページ」で設定できます。通常の記事は、目次を表示させるので、「投稿」にチェックを入れます。「固定ページ」にも目次が必要ならチェックを入れましょう。
  • 表示させる見出し設定…見出し(H2,H3,H4)のどこまで、目次に表示させるか設定します。H3まで表示させるで良いかなと思います。
  • 表示条件…記事内に見出しをいくつ入れたら目次を表示させるかを設定します。「5」なら見出しが4以下なら、目次が表示されません。1~10まで設定できます。
  • フォント設定…目次のフォントは3種類から選べます。


デザイン設定

デザイン設定では、目次で表示される項目のデザインや枠の見た目を選びます。

  • タイトルの表示設定…目次のタイトルを「左寄せ」、「中央寄せ」の2つから選びます。
  • H2のリスト形式
  • H3のリスト形式…共に、見出しの項目を目次で表示させる時のデザインを4種類から選びます。
  • 枠のデザイン…目次の枠は5種類あります。
  • 表示アニメーション…目次の表示アニメーションの設定は、3種類から選びます。
  • スムーススクロール設定…スムーススクロールとは、目次の項目をクリックしたときに、スクロールしながら、移動する動きの事をいいます。オフにするとクリックした瞬間に、その項目までジャンプして飛びます。


プリセットカラー設定

ちち
ちち

プリセットカラー設定は、7種類のセットされた中から、好みのものを選びます。

プレビューで確認できるので、イメージしやすいですね!


カラー設定(上級者向け)

カラー設定(上級者向け)では、「プリセットカラー設定」で決めたものから、色を選択できます。

自分好みに変更したい方は、こちらで選択してください。


応用設定

応用設定では、「目次に戻るボタン」や「目次を除外する記事」などを選ぶことが出来ます。


  • 目次に戻るボタン…スマホ表示のみ。OFFにすると表示されなくなります。
  • 目次に戻るボタンの位置…表示させる場合、ボタンを画面の左右どちらに表示させるかを選びます。
  • 上下調整…目次に戻るボタンの上下の位置を調整出来ます。
  • 除外する投稿ID…投稿で目次を表示させたくない記事を特定します。投稿IDは投稿一覧で確認出来ます。
  • 除外する固定ページID…固定ページで目次を表示させたくないページを特定します。こちらもIDは、固定ページ一覧で確認出来ます。
  • 目次のデフォルト表示設定…目次を最初から「表示させておく」か、「閉じた状態にしておく」か選びます。
  • 開閉ボタンの開くテキスト…デフォルトは「OPEN」。日本語で「開く」でも良いかもしれません。
  • 開閉ボタンの閉じるテキスト…デフォルトは「CLOSE」。こちらも「閉じる」でも良いかもしれません。
  • プラグインのCSSを読み込まない…基本的にチェックは入れなくても問題ないです。

「変更を保存」をクリックして保存します。

これで、RTOC設定は完了です!


「Rich Table of Contents」のまとめ

ちち
ちち

お疲れさまでした!

このまま、確認でプレビューしても、目次が表示されていませんが、ご安心を!

投稿を公開後、しっかりとおしゃれな目次が表示されます!

RTOCプラグイン「 Rich Table of Contents 」を使えば、WordPress初心者でも簡単に、おしゃれな目次をつくる事が出来るので

是非試してみてください!

コメント

タイトルとURLをコピーしました