1. TOP
  2. Table of Contents Plusで記事目次を自動作成

Table of Contents Plusで記事目次を自動作成

ワードプレス この記事は約 5 分で読めます。

動画や音楽などの高容量化に乗っかっているのか、最近はコンテンツも量が多いものが増えてきました。

昔は一ページに収める、スクロールをあまりさせない美学のようなものもあった気がしますが、最近はそれよりもコンテンツの質が重視されている気がします。

 

それに呼応して、目次がある記事が増えてきたと思っていて、僕もそれをやろうと思った矢先、非常に便利なプラグインを見つけたので、早速ご紹介します。

※目次の紹介のために色々見出しを使っていますので、この記事の見出しは少しおかしくなっています。
すみません。

 

 


Table of Contents Plusというプラグイン

それは、Table of Contents Plusというプラグインです。

導入の方法はいたって簡単。
まずはダッシュボードから「プラグイン」→「新規追加」と進み、

2016-03-20_105507

「Table of Contents Plus」と入力した後、エンターを押して検索します。

2016-03-20_105527

すると対象のプラグインが出てきますので、「今すぐインストール」をクリックし、

2016-03-20_105539

「プラグインを有効化」をクリックすれば、インストール自体は完了です。

 

 

実際使っていくためには設定が必要

しかし使うためには設定が必要になります。
自動で目次を作成してくれるとはいえ、もちろんhtmlタグで指定する必要があり、このプラグインの場合「h1」~「h6」で指定した見出しに対して目次が自動に作成されていきます。

 

なのでその順番がめちゃくちゃだと、目次もめちゃくちゃになります。

よほどの長文でない限り、「1」~「6」をフルフルで使う必要もないんじゃないかと。

 

ちなみにこのサイトでは、「h3」の見出しタグを基本的に使ってます。

 

「h3」見出し(これはテストです)

 

特に深い理由はないですが、個人的に一番見やすかったので。

ちなみに他はこんな感じです。

 

「h1」見出し(これはテストです)

 

「h2」見出し(これはテストです)

 

「h4」見出し(これはテストです)

 
「h5」見出し(これはテストです)
 
「h6」見出し(これはテストです)
 

基本的に同じ見出しの回数分だけ番号をふってくれますので、例えば「h3」を3回使えば、目次には見出しごとに1~3まで番号がふられます。

 

そして例えば1つ目「h3」の見出しの中で、「h4」の見出しを1つ使えば、見出しの前に「1.1」という番号がふられ、今回の記事で
「h3」見出し(これはテストです)
というのは「h3」の3つ目なので、ここで「h4」を3つ使えば、上の目次のようになります。

「h4」見出し(これはテストです)3.2

「h4」見出し(これはテストです)3.3

※上で「h4」を1つ使っています。

 

ちなみに見出しタグについては、「h3」であれば、
<h3>見出し<⁄h3>
で作成することができます。

 

Table of Contents Plusの設定について

ただ、実際に使っていくためにはもう少し設定が必要です。

ダッシュボードから「設定」→「TOC+」と進むと、Table of Contents Plusの設定画面に入ります。

2016-03-20_105836

まず、「表示条件」ですが、デフォルトは「4」ですが、オススメは「2」です。
あとは記事で目次を表示するために、「post」のチェックを入れましょう。

2016-03-20_110650

その後に上級者向けの「表示」をクリックします。

2016-03-20_110650

ここで、もし見出しのバリエーションはそこまで求めてないのであれば、不要なものはチェックを外しましょう。

僕は「h3」とせいぜい「h4」ぐらいと思うので、画像のようにチェックを入れて、更新をクリックしました。

2016-03-20_115328

あまり階層を深くすると複雑になりますので、ユーザビリティも下がる可能性があります。
個人的には2階層程度がベターではないかと。

まあ、これも好みなので、任意に設定はやってみてくださいね。

 

ちなみに僕は3と4しか使わない設定なので、今回1~6、までフルで使ってますが、目次の階層は2までになっています。

 

ですが、ページの中で1~6までフルで使わなければ、基本的にその階層までの目次ですのでご安心を。
※設定がどうであれ「h3」しか使ってなければ、普通に1から番号をふってくれます。

 

なにはともあれこの設定が終われば、それぞれの記事ごとに目次が作成されます。

2階層の場合はこの記事の目次を見てもらって、1階層の場合は下の画像のような感じです。

2016-03-20_111006

プラグインの記事は久々に書きましたが、このプラグインはなかなか秀逸だと思います。

ぜひとも導入してみてくださいね^^

 

PS

この記事への感想やご意見は、↓から気軽にどうぞ。
※タイトルには「目次」って入れてくださいね。

もちろんこの記事以外のことでもOKです。

\ SNSでシェアしよう! /

LSCの注目記事を受け取ろう

この記事が気に入ったら
いいね!しよう

LSCの人気記事をお届けします。

  • 気に入ったらブックマーク! このエントリーをはてなブックマークに追加
  • フォローしよう!

関連記事

  • All in one Faviconでファビコンを簡単設置

  • postMashで日付に関係無く記事の順番を自由に入れ替える!

  • まとめ・比較サイトに最適のShortcode Star Rating

  • ワードプレスのウィジェットの配置のやり方について画像付き解説

  • WP Multibyte Patchの使い方や設定方法は?

  • Buffer My Postで自動つぶやき!使い方を画像付解説!