Table of Contents Plusを使って初心者でも簡単に目次を設定

Table of Contents Plusとは

記事の目次を簡単に自動生成してくれるプラグインです。記事の目次が自動で生成されるので、手動で目次を作成して更新したり、アンカーリンクを張る手間が省けますので目次を利用すれば、ブログやサイトに訪問した方が記事の内容を把握しやすく、見た目的にもよくなる為記事を読み進めやすくなります。

Table of Contents Plusのインストール方法

 

左の基本画面から「プラグイン」⇒「新規追加
Table of Contents Plusを検索してインストールして有効化しましょう。

 

Table of Contents Plusの設定

 

Table of Contents Plusで目次を自動生成するには記事の中に必ずh1~h6までの見出しを、作成する必要があります。

設定からTOC+をクリックして設定をしていきましょう。
Table of Contents Plusはサイトマップも作れます。当ブログではPS Auto sitmapを使っていますので、ここでは設定方法だけお伝えします。

 

表示する場所と条件

 

目次をどこに表示するか、表示させる条件を選びましょう

  • 最初の見出しの前
  • 最初の見出しの後
  • トップ
  • ボトム

目次を表示させる条件です。見出しが何個以上ある時に目次を表示させることが出来ます。
当ブログは3個以上にしています。

 

投稿タイプの選択

 

目次を表示させたい投稿タイプを選択しましょう。

項目 説明
post 通常の投稿記事
page 固定ページ
custom_css カスタムcss
customize_changeset カスタマイズチェンジセット
wpcf7_contact_form 問い合わせフォーム

当ブログは通常記事にしています。

 

見出しテキスト

目次のタイトルを設定します。

項目 詳細説明
目次の上にタイトルを表示 目次のタイトル。「目次」とするのが一般的です。
ユーザーによる目次の表示・非表示を切り替えを許可 チェックを入れると目次の開閉ができるようになり、許可しておくのが良いです。
テキストを表示 目次を開くリンクの名前を設定します。
テキストを非表示 目次を閉じるリンクの名前を設定します。
最初は目次を非表示 チェックを入れると最初は目次が非表示となります。好みで変えましょう。

いつでも変更はできますので、自分のブログにあった文言を入れるといいと思います。
物語のブログなどは、目次タイトルが「エピソード」に変えてあったりするのを見かけます。

画像は当ブログの設定です。

 

階層表示・番号振り・スムーズ・スクロール効果

項目 詳細説明
階層表示 目次の階層を表示するか設定します。目次は階層を表示させた方が断然見やすいですチェックでOK
番号振り 目次の階層に沿った番号を自動で入れてくれます。チェックでOK
スムーズ・スクロール効果を有効化 目次をクリックしたときに「ジャンプ形式」か「スクロール形式」か選べます。お好みでかまわないと思います。

 

外観設定

 

外観の設定はデフォルトのままがいいと思います。

 

プレゼンテーション

 

こちらはデザインの選択ですので、ブログに合ったデザインを選びましょう。

以上でTable of Contents Plusの基本設定は終わりです。「設定を更新」でOKです。

このままでも使えますが、さらに突っ込んだ設定がしたい方は「上級者向け」に進んで設定しましょう。

上級者向け

Table of Contents Plusは、日本語対応しており、上級者向けの説明も分かりやすく書いてありますが、一般的に変更するのは「見出しレベル」が多いです。
表示する見出しが多すぎると、目次のページが大きくなりすぎるので、記事の書き方や、ブログ方針により違いますので、ご自分のブログの目次を一度確認してから設定するのがいいと思います。

当ブログはデフォルト(最初)のまま使ってます。

サイトマップ

Table of Contents Plusでは目次だけでなく、サイトマップも自動生成することができます。

やり方は簡単で、サイトマップを表示させたい場所に[sitemap]と記述をすればOKです。

サイトマップに関する設定はTable of Contents Plus設定画面のサイトマップより行うことができます。

Table of Contents Plusのサイトマップでもいいのですが、デザイン変更などの細かい設定などがめんどくさいので僕はこちらを使っていますので参考にしてみてください。

サイトマップを作ってサイトを見やすくしよう(PS Auto Sitmap編)

 

いつもご覧いただきありがとうございます!
お役に立てましたらポチしてくださいm(__)m


人気ブログランキングへ

スポンサーリンク