wordpress

目次全自動作成!Table of Contents Plusの使い方

目次全自動作成!Table of Contents Plus





皆さんは自分のブログ記事に目次をつけていますか?もしつけていなかったとしたら、読者のためにも今すぐつけるべきです。

まず、こんな読者を想像してみてください。その読者はある特定の悩みや知りたい情報があって、それを見るために自分の記事を訪れてくれました。そして自分の記事にはその人の知りたい情報が書かれています。しかし、あなたは目次を作っていなかった結果、読者は自分の知りたい情報がどこにあるのかを見つけることができず、結局、その部分を読まれる前に離脱してしまいました。

もし目次があれば、すぐに探している情報を手に入れることができて、読者を満足させることができたはずですよね。

次に、こんな読者を想像してみましょう。

その読者は特に決まった悩みや知りたい情報もなかったのですが、何となくタイトルが目につき、自分の記事を訪れてくれました。

そしたら、その記事には目次がなく、とりあえず読み進めては見たものの思っていたよりも文章が長く、いつこの記事が終わるかもわからかったので、軽くスクロールされて、すぐに自分のページを去ってしまいました。

もし目次があったらどうだったでしょう。

まず読者は目次を見て、その記事にどんなことが書かれているのか、その全体像をイメージすることができます。最初に少しでも記事内容を分かったほうが、読者はこの記事のどこかしらに興味を持ってもらって、もっとしっかりと読んでもらえたかもしれませんね。

このように目次があるかないかで、たとえ同じ記事を書いていたとしても、読者の興味や満足度が変わってしまうのです。

しかし、ブログ記事一つ一つに目次をつけていくとなると、やはり時間がかかってしまい、大変そうですよね。

そこで活躍するのが、目次を全自動で作成してくれるWordPressプラグイン「Table of Contents Plus」です。

これから「Table of Contents Plus」について紹介していくので、目次を作成していない人はいますぐ導入して、読者に優しいブログにしていきましょう。

Table of Contents Plusとは

石の上で本を読む女性

Table of Contents Plusとは自動的に目次を作成してくれるWordPressのプラグインです。このプラグインを有効化して設定をしておくと、記事作成するたびに目次の設定をしなくても、目次が表示されるようになります。
実際にプロガーで作られている目次も、Table of Contents Plusで作られたものです。
では、これからはその具体的な設定方法について見ていきましょう。

 

Table of Contents Plusの使い方

女性に読まれる本

では、Table of Contents Plusを使った目次の作り方について、解説していきます。

基本設定

まずは、基本的な設定から解説していきます。

TOC+の設定画面

位置

目次を表示させる位置を設定することができます。

表示条件

記事の中に何個以上見出しがあれば目次を表示させるかを設定することができます。

以下のコンテンツタイプを自動挿入

どのページに目次を表示させるかを設定することができます。様々な選択肢が設けられていますが、使う可能性があるのは以下のものくらいです。

  • post…投稿ページに目次を表示します
  • page…固定ページに目次を表示します
  • custom_css…カスタム投稿に目次を表示します

見出しテキスト

次の2つの内容を設定することができます。

  • 目次のタイトル…目次の上にタイトルを表示させるかどうかや、目次のタイトルを設定することができます。
  • 目次の表示・非表示…目次の表示・非表示の切り替えをユーザーに許可するかどうかや、最初の時点で目次を表示させるかどうかの設定をすることができます。
TOC+の設定画面

階層表示

見出しのレベルによって、目次を階層的に表示するかどうかを設定することができます。

番号振り

目次の前に番号を振るかどうかを設定することができます。

スムーズ・スクロール効果を有効化

チェックを入れていない状態だと、目次から項目をクリックすると、一気にしていた項目までジャンプする設定になっているのですが、ここにチェックを入れると、目次の項目をクリックした時に、スーッとスクロールされて指定された項目にたどり着くような設定にすることができます。

横幅

目次の横幅を設定することができます。

回り込み

目次の回り込みの有無を設定することができます。

プレゼンテーション

目次部分の色やデザインについて設定することができます。カスタムにすると自分でお好みの色を設定することもできます。また、目次のデザインはテーマで作成されているのを使うこともできます。(後の「上級者向け」の「CSSファイルを除外」の部分で解説します。)



上級者向け

次は上級者向けの項目を設定していきます。少し細かい設定にはなりますので、基本的にはデフォルトのままで大丈夫ですが、目次表示で気になる際は是非設定してみてください。

TOC+の設定画面

小文字

内部リンクで#から始まるアンカーを全て小文字で表示されます。内部の設定で見た目には変化がありません。

ハイフン

内部リンクで#から始ますアンカーにおいて、_(アンダースコア)が ―(ハイフン)で表示されます。これも内部の設定で見た目に変化はないです。

ホームページを含める

固定ページをサイトのトップページとしているときに、そのトップページに目次をつけるかどうかを設定することができます。

CSSファイルを除外

最近のテーマだと、独自で目次のデザインが作られているものも多くあります。テーマのデザインを使用したい場合はチェックを入れましょう。先ほど設定したプレゼンテーションのデザインを使用する場合はチェックはいりません。

テーマの見出し記号を保持

リスト要素にCSSで背景を指定している場合はチェックを入れると、テーマのスタイルが適応されます。

見出しレベル

目次として設定する見出しのレベルを設定することができます。h4やh5まで設定してしまうと、見出しがごちゃごちゃしてしまい見にくくなってしまうので、h2とh3のみを表示させるのが一般的です。

TOC+の設定画面

除外する見出し

言葉を設定して、除外する見出しを設定することができます。
いつも特定の文言の見出し(「オススメ記事」「自社商品の紹介」など)があって、それを目次の時に表示させたくない場合は、この部分で設定することができます。

スムーズ・スクロール上位余白

先ほど「スムーズ・スクロール効果を有効化」にチェックを入れた場合のみ、表示されます。
ヘッダーの部分を固定していたりすると、目次からその項目をクリックして移動した際に、見出しが切れてしまう恐れがあります。ここで着地点を設定することで、見出しが切れることなく、ちょうどいいところで見出しが表示されるようになります。

パス限定

特定のページのみに目次を表示させたいときは、こちらで設定することができます。

アンカーのデフォルト接頭辞

ページ内リンクが独自のもので、かつ数字を使用している場合、「Table of Contents Plus」で自動的に作られた目次のページ内リンクに使われている数字と被ってしまい、リンクが正しく作動しなくなってしまうので、その場合はそこの空欄に文字を入力することで回避することができます。


ショートコード

続いて、Table of Contents Plusにおいてのショートコードを二つ紹介します。
これらのショートコードは記事作成の「テキストエディタ」に入力すると、適応されるようになります。

[toc]

目次をデフォルトで設定した位置以外のところに作りたい際や、「以下のコンテンツタイプを自動挿入」の設定で、設定しなかったコンテンツタイプに目次を入れたい際は、[toc]というショートコードを入れると、入れたところに目次が入るように設定することができます。

[no_toc]

「以下のコンテンツタイプを自動挿入」で設定したコンテンツタイプで、特定のページだけ目次を表示させたくない場合は[no_toc]というショートコードを入れることで、目次を非表示にさせることができます。

 

さいごに

テーブルとコーヒー

是非「Table of Contents Plus」で目次を作成して、読者の満足度を向上できるようなサイトを作っていきましょう。

Table of Contents Plusの設定方法
  • 一般設定…位置やコンテンツタイプ、デザインなどの基本設定
  • 上級者向け…さらにこだわりたい人向けの細かい設定
  • ショートコード…[toc]、[no_toc]の2種類
にほんブログ村 ブログブログ ブログアクセスアップへ