【Table of Contents Plus】ブログの目次を自動で作ってくれるワードプレスプラグイン

 

 

ワードプレスブログに自動で目次を設置してくれる、便利プラグイン『Table of Contents Plus』の使い方解説です。

 

１．Table of Contents Plus を公式サイトからインストールしよう

 

Table of Contents Plus はワードプレスの公式プラグインなので

ワードプレスの管理画面の プラグイン → 新規追加 から直接インストールすることができます。

 

公式サイトから直接プラグインをダウンロードする方は以下のリンクからどうぞ

外部リンクTable of Contents Plus 公式ページ

 

プラグインの追加方法がわからない方は、以下のページを参照してくださいね。

内部リンクWordPressにプラグインをインストールする2つの方法を解説

 

プラグインを追加ページで Table of Contents Plus と打ち込んで検索。

 

イカリマークを目印にプラグインを見つけたら 今すぐインストール → 有効化 とクリックしましょう。

 

これで Table of Contents Plus のインストールまでは完了しました。

続いて設定方法についても解説していきます。

 

２．Table of Contents Plus の設定方法

 ワードプレス管理画面の 設定 から TOC+ をクリックします。

 

 

色々設定項目があって複雑に感じるかもしれないので

今回は わー研。と同じ設定にする方法を紹介しておきますね。

 

位置：目次を表示したい位置です → そのまま

表示条件：自動で目次が表示される条件です → ４から２に変更

以下のコンテンツタイプ～：page(固定ページ)を外してpost(投稿ページ)にチェック

 

見出しテキスト

目次の上にタイトルを表示：チェックはそのままで Contents から 目次 に変更

ユーザーによる目次の～表示・非表示を切り替えを許可

テキストを表示：show から 目次を表示 に変更

テキストを非表示：hide から 目次を隠す に変更

階層表示：そのまま

番号振り：チェックを外す

スムーズ・スクロール効果を有効化：チェックを入れる

 

続いては外観部分の設定となりますが、ここは特にいじる必要はありません。

 

最後のプレゼンテーションという項目で

目次の見た目を変更できるのでここは好みで決めてもらってOKです。

終わったら下にある 設定を更新 ボタンを押して設定完了です。

 

あなたのサイトには、自動でこんな感じの目次が表示されているかと思います。

 

クリックするとその見出しまで一気にスクロールしてくれるのですごく便利なんですが、

すこし見た目が寂しい感じもしますよね？(笑)

 

 

ここからは Diver のテーマを使っている方向けの追加の設定方法を解説します。

 

３．Diverを使ってる方向けの追加の設定方法

１ ワードプレスの管理画面で Diverオプション → 投稿設定 へと移動しましょう。

 

２ Diverの投稿設定画面に移動したら、ずーっと下にスクロールしていくと

TOC+プラグインにDiverスタイルを適用する という項目があるのでチェックを入れましょう。

 

３ そうすると以下の画像のように、目次のカラーを設定する画面が開きます。

基本カラー(目次の枠の色) と 文字色(目次の文字の色) をあなたのサイトにあった色に変更しましょう。

Checkfa-arrow-circle-rightColorPick Eyedropper の使い方は以下のページの2番で解説してます。

内部リンクブログの配色どうしよう？⇒ 迷った時に使えるサイトとchromeプラグインがこれ

４ 最後に 変更を保存 ボタンをクリックすることをお忘れなく。

 

お疲れさまでした！これで設定は完了しました！

 

 

さいごに

自動であなたのブログに目次を設置してくれる

便利プラグイン Table of Contents Plus の使い方解説でした。

 

1度設定してしまえば後は手をかけることなく

すべてのページで目次を表示しつづけてくれるなんて便利すぎますよね！

 

さらに Diver だとこのプラグインと連携してくれるので

あっという間にブログにあったおしゃれデザインに変更することが可能。

 

ブログ運営に慣れてきたら細かい設定を変更してみるのもいいですね。