WordPressブログで目次を作る方法【プラグインあり・なし】

BLOG WordPress

初心者ブロガー「運営しているWordPressブログに目次を作ろうか迷ってる。目次ってあった方がいいの?もしそうなら、目次の作り方を教えてほしいな」

こういった疑問に答えます。

本記事の内容

  • WordPressブログに目次を作るメリット
  • WordPressブログに目次を作る方法

記事の信頼性

本記事を書いている私はブログ歴3年以上。記事数は350を超えました。WordPressに関する記事も多数アップしています。

今回は、WordPressブログに目次を作るメリットや目次の作り方を解説します。

「ブログに目次って必要なの?」

ブログを始めたときは、こんなことを思いますよね?
私もそうでした。

結論をいうと、ブログに目次はあった方が絶対いいです。読者の満足度も上がるし、SEOでも有利だから。

本記事では、目次を設ける利点や、目次の作り方法をわかりやすく解説しました。

WordPressブログをさらに良くしていきたい方は、ぜひご覧ください。

目次

WordPressブログに目次を作るメリット2つ

まずは、WordPressブログに目次を作るメリットから解説します。

結論を言うと、目次はあった方が絶対いいです。
以下のメリットがあるからですね。

  • 読者の利便性が向上する
  • SEOで良い効果が期待できる

順に見ていきます。

メリット①:読者の利便性が向上する

WordPressブログに目次があると、読者の利便性が上がります。

というのも、読者は目次(=記事の全体像)を見れば、欲しい情報が記事内にあるかどうかをすぐに把握できるし、

さらに目次があれば、欲しい情報にすぐにたどりつけるからです。

データによる裏付け

ヒートマップを見ると、読者が記事内のどんな箇所をクリックしているかがわかります(ヒートマップはこちらで紹介)。

当ブログのとある記事のヒートマップを示すと、以下のように、多くの読者が目次をクリックをしているのがわかるでしょう。

▽ヒートマップのデータ例

※クリックされた箇所が色濃くなる

上記のデータが証明するように、ブログに目次があると、読者の利便性が向上します。

メリット②:SEOで好影響が期待できる

WordPressブログに目次があると、SEOで好影響が期待できます。

先ほど、目次を作れば読者の利便性が向上するとお伝えしましたよね。

これって、読者に必要な情報をすばやく届けることであり、すなわち、Googleの目指すユーザーファースト(以下参照)の理念と一致しているからです。

Google はいつでも、有益で関連性の高い情報をユーザーに提供することを目指しています。Google が検索に変更を加えるのは、検索結果の利便性を高めるためです。
参考:Google検索の仕組み

途中離脱も防げる

また、目次を設けることで、欲しい情報にたどりつく前に読者が離脱するのを防止できます。

読者の途中離脱(&再検索)を防げば、記事に対するGoogleの評価も高まり、SEOで有利になります。

クリック率の向上も期待できる

目次を設けていると、検索結果に目次が表示されることがあります。この場合は、クリック率の向上が期待できます。

クリック率が高まれば、PV数のアップにつながり、副次的にSEOに有利になるでしょう。

以上お伝えしたように、ブログに目次があれば、

  • 読者の利便性が向上する
  • SEOで良い効果が期待できる

というメリットがあり、いいことだらけ。

ぜひともこの機に、目次を作りましょう!

ブログに目次を作る方法(プラグインなし)

続いては、ブログに目次を作る方法を解説します。

WordPressブログに目次を作成する方法としては、

  • プラグインを使わずに目次を作る
  • プラグインを使って目次を作る

の2とおりがあります。

おすすめは、プラグインを使う方法。
目次を作る時間を省けるから。

ただし、お使いのWordPressのテーマによっては、目次のデザインが崩れることがあります。

私がまさにそう。
WordPressテーマは、Manablog Copyを使っているんですが、

たとえば
Easy Table of Contents
というプラグインを使うと、下図のように、目次が左端によりすぎてカッコ悪くなっちゃうんですよね…。

というわけで、この項ではまず、プラグインを使わずに目次を作る方法を解説します。

この方法は、HTMLにコードを手動で記述するもので、具体的には以下の感じ。

見出し側

<ul>
<li><a href ="01">見出し1</a><li>
<li><a href ="02">見出し2</a><li>
<li><a href ="03">見出し3</a><li>
</ul>

本文側

<h2 id="01">見出し1</h2>
記事本文
<h2 id="02">見出し2</h2>
記事本文
<h2 id="03">見出し3</h2>
記事本文
※”01″,”02″,”03″,の箇所はお好きな文字列でOK

上記の記述をすると、見出しが作成でき、その見出しをクリックすると、該当の見出しにジャンプできるようになります。

なお、本記事は上記方法で目次を作ってますので、実際の表示を見たい方は、記事の冒頭に戻ってご確認ください。

※補足:お使いのWordPressテーマによって、色合いやフォント、囲いの有無は異なります。

プラグインなしで目次を作るメリット

メリットは、目次を作る自由度が高いこと。

後述するプラグインを利用する方法だと、h2やh3タグに記述した文言がそのまま目次になっちゃいます。

なので
・このh2タグはあえて目次には載せない
・このh2タグの文言を目次では短縮したい
なんてことができません。

でもこの手動で目次を作る方法なら、上記のようなカスタマイズも自由自在です。

プラグインなしで目次を作るデメリット

デメリットは、ずばり面倒なこと。
上記のようなHMTL記述を書く毎回書く必要があるので、手間がかかります

ただし、WordPressのプラグイン「AddQuicktag」を使い、上記のコードを登録しておけば、だいぶ省エネになります。私はこの方法ですね。

AddQuiktagの使い方は以下の記事にまとめてますので、参考にどうぞ。
» AddQuicktagの設定と使い方【WordPressプラグイン】

以上、プラグインなしで目次を作る方法でした。

WordPressブログに目次を作る方法(プラグインあり)

続いては、WordPressブログに、プラグインを使って目次を作る方法を紹介します。

プラグインを使うと、目次を自動で作ることができ、記事作成を効率化できるのでおすすめ。

ただし、前述のとおり、おつかいのWordPressテーマによっては、目次のデザインが崩れることもあります。

とはいえ目次のデザインが崩れた場合は、プラグインを使わなければいいだけなので、まずは試してみましょう。

おすすめのプラグインは、以下3つ。

ポップなデザインがお好みなら、
Rich Table of Contents
がおすすめ(^^)/

プラグインの導入手順

プラグインの導入手順は、基本的にはどれも同じです。

WordPressの管理画面で、
「プラグイン > 新規追加」をクリックします。

右上の検索窓に、導入したいプラグイン名を入力します。

該当のプラグイン名が表示されるので、
[今すぐインストール]をクリックして、次に
[有効化]をクリックします。

・Table of Contents Plus
・Easy Table of Contents

この2つは、有効化した時点で、目次が自動で作成されるでしょう(※注:記事内にh2やh3タグがあれば)。

表示する階層の深さやデザインを変更する場合は、WordPressの管理画面で、該当するプラグインの設定メニューを開いて行います。

・Rich Table of Contents
このプラグインは、有効化しただけでは目次は表示されないので補足します。

まず設定メニューは、WordPressの管理画面で、
「RTOC設定」という箇所です(※設定メニューの中じゃないのでご注意を)。

基本設定の中にある「表示条件」をご覧ください。

デフォルトだと「10」になっています。これって、つまりh2タグが10個以上ないと、目次を自動で作らないってこと。

なので、この数字を「1」に変更して、最下部にある[変更を保存]をクリックします。

私が試したときは、この時点でもまだ目次は表示されなかったので、記事の作成途中でしたが、公開してみました。

すると、ようやく目次が自動で作成されました。こんな感じで↓

表示する階層の深さやデザインを変更する場合は、この設定メニューにて行います。

おすすめのプラグインはどれ?

紹介した3つのプラグインは、どれもおすすめなので、試しに使ってみてお好きなのをどうぞ。

「あえてひとつを教えて」と聞かれれば、

をおすすめします。

デザインがポップでおしゃれだから(^^)/

プラグインを利用して目次を作るメリット

メリットは、手間をかけずに目次を作れること。
これにつきます。

プラグインを利用して目次を作るデメリット

デメリットは、自由度が少ないこと。

・このh2タグはあえて目次には載せない
・このh2タグの文言を目次では短縮したい
なんてことはできません。

とはいえ、上記ケースはそれほど多くないので、もしWordPressテーマのデザインと干渉しないのであれば、プラグインを利用することをおすすめします。

以上、WordPressブログで、プラグインを使って目次を作る方法でした。

クリック率が高まる最適な目次を作るコツ

最後に、クリック率が高まる最適な目次を作るコツを紹介します。

そのコツとは以下の4つ。

  • 目次は常に開いておく
  • 記事の要点をまとめる
  • 階層はh3タグまでにする
  • 具体的な数字を入れる

順に見ていきます。

コツ①:目次は常に開いておく

デフォルトの表示で、目次を閉じる設定にしていると、目次の存在に気づいてもらえないことがあります。

それじゃ、せっかく目次を作ったのに意味ないですよね。

なので、目次は最初から開く設定にしておきましょう。

コツ②:記事の要点をまとめる

目次の文面は、長すぎると読んでもらえないし、短すぎても意図が伝わりません。

なので、記事の要点を適切な分量でまとめましょう。
目次を見れば、記事の全体像がわかるのが理想です。

また、PCで見ると適切に見えても、スマホで見ると長たらしく感じることがあります。スマホでの見え方もチェックしましょう。

コツ③:階層はh3タグまでにする

目次の階層が深すぎると、かえってわかりづらくなります。

目次の階層は、h2タグだけ、あるいは、h3タグまでにしましょう。

コツ④:目次に数字を入れる

目次に数字があると、読者にイメージが伝わりやすくなります。

「簡単にできる」よりも
「1分でできる」の方がわかりやすいですよね?

項目が3つあるなら、
「コツ3つ」「おすすめ3選」
と書いたりとか、

手順を示すなら、
「手順1:〜」
「手順2:〜」
と書いたりとか。

こんな感じで、目次に具体的な数字を入れましょう。

以上、クリック率が高まる最適な目次を作るコツ4つでした。

まとめ:WordPressブログに目次を作ろう

WordPressブログに目次を作るメリットと、目次の作り方を解説しました。

WordPressブログに目次を設けると、
・読者の利便性が向上する
・SEOで良い効果が期待できる
というメリットがあるので、ぜひこの機に作りましょう!

目次の作り方には2パターンあって、プラグインを使う方法と使わない方法。

お使いのWordPressテーマと干渉しないのであれば、プラグインを使って自動で目次を作ることをおすすめします。

Rich Table of Contents
というプラグインがおしゃれでおすすめ。

※なお、今回紹介した以外のおすすめプラグインは以下の記事で紹介してます。あわせてご覧ください。
» WordPressの無料おすすめプラグイン10選【ブログ初心者必見】

今回以上です。