WordPress ブログ初心者 ブログ運営

WordPressで簡単に目次を作る方法を2つ紹介【画像付きで分かりやすく解説】

2021年1月21日

この記事に当てはまる人

  • 目次の作り方がわからない
  • 思うように設定にできない
  • 目次作成方法の種類が知りたい

この記事では、上記のような悩みを解決します。

WordPressに目次を表示させる方法、目次の場所を指定する方法などを図解付きで具体的に解説していきます。

ぜひ最後まで読んでいってください。

本記事の内容

  • 簡単に目次を作るプラグイン①:Table of contents plus
  • 簡単に目次を作るプラグイン②:Gutenberg
  • 記事に目次を付けるメリット
  • 記事に目次を付けるデメリット
  • この記事のまとめ

この記事を書いた人

takablog
takablog

補足

この記事を書いてる僕は、どこにでもいるブロガー。ブログ月収56万。月6桁が安定してきたので現在は引きこもりながら仕事しています。

Twitter:(@takablog5867)

簡単に目次を作るプラグイン①:Table of contents plus

WordPressプラグイン

目次を作成するのに最も優れているプラグインの一つです。他のサイトでもTable of contents plusを題材に解説されているところも多いです。

理由は操作が簡単かつシンプルなのでわかりやすく扱うことができるからです。それでは、画像付きで解説をさせていただきます。

まずはWordPressを立ち上げて「プラグイン」をクリック。

WordPress

WordPressをいつものように立ち上げると「プラグイン」ボタンがあるのでそれをクリックします。

プラグインを押すと下の画像が出てくるので、「新規追加」をクリック

WordPressプラグイン

「新規追加」を押すと以下の画像が出てきます。

WordPressプラグイン

検索する欄があるので「Table of contents plus」と検索。

すると下の画像が出てきます。

WordPressプラグイン

筆者はすでにインストール済みなので「有効」になっています。まだ有効になっていない人は「今すぐインストール」を押してください。

すると、「有効化」が出てきますので有効化します。

ここまではプラグインを追加して有効化するまでの作業を行いました。次からは有効化したTable of contents plusを設定していきます。

有効化し終わったら「設定」を押してください。

WordPressプラグイン

インストールして有効化した後にもう一回プラグインを押すと、さきほどインストールしたTable of contents plusが上の画像のように追加されています。

設定を押すと、以下の画像が出てきます。

WordPressプラグイン

それでは設定方法を紹介します。

Table of contents plusの設定方法

Table of contents plusの設定は、以下の手順。

  • 位置
  • 表示条件
  • 以下のコンテンツタイプを自動挿入
  • 見出しテキスト
  • 階層表示
  • 番号振り
  • スムーズ・スクロール効果を無効化
  • 横幅
  • 回り込み
  • 文字サイズ
  • プレゼンテーション

上記の手順。1から順に解説してきます。

①:位置

記事のどの箇所に目次を作成するかを設定することができます。デフォルトでは「最初の見出しの前」となっており、こだわりがない場合はこのままの設定で大丈夫です。

②:表示条件

目次を自動生成するために必要な見出し数を決めることが可能です。2~10個の間で自由に選ぶことができます。

ここで設定した数に見出しが満たない場合、目次は自動生成されないので注意しましょう。

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

どのタイプのページに目次を生成するかを選ぶことができます。投稿記事に自動挿入したい場合は「post」、固定ページに自動挿入したい場合は「page」にチェックを入れるなど、カスタマイズが必要ですがpostで大丈夫です。

④:見出しテキスト

目次の上に表示するテキストを設定することができます。チェックボックスのチェックを外せば、「テキストなし」の設定にすることも可能です。

ここはお好みで大丈夫です。どのように変化するのか試しに変更してみてください。

⑤:階層表示

見出しになっているh2やh3を目次の小見出しとして表示させるためのチェックボックスです。

⑥:番号振り

目次の頭に番号を表示させたい際にチェックを入れましょう。番号を入れることで見出しの項目が見やすくなるので入れることをおすすめします。

⑦:スムーズ・スクロール効果も有効化

目次をクリックした時に、該当箇所へジャンプではなくスクロールで移動させるための設定が可能です。チェックを付けた方が便利です。

外観

WordPressプラグイン

目次の外観をカスタマイズできる項目になります。基本はデフォルトで構いません。

⑧:横幅

目次の横幅をカスタマイズできます。デフォルトで大丈夫です。

⑨:回り込み

ここもデフォルトで大丈夫です。カスタマイズはどのように変更されたか確認しながらすることをおすすめします。

⑩:文字サイズ

目次全体の文字サイズを変更することができます。大きすぎず小さすぎず読者が見やすいサイズにしましょう。

⑪:プレゼンテーション

目次全体の色を変更することができます。ここもお好みでカスタマイズしましょう。

上記の基本設定が完了したら、目次が自動生成されるようになります。これがTable of contents plusを使用した方法です。

»【WordPress】ブロックエディタで引用タグに画像を挿入する方法

アイキャッチ画像
【WordPress】ブロックエディタで引用タグに画像を挿入する方法

続きを見る

簡単に目次を作るプラグイン②:Gutenberg

Gutenbergとは、WordPress5.0より搭載された新しいテキストエディタのことをいいます。

もっとわかりやすく

2018年12月に行われたWordPressの大規模アップデートによって生まれ変わった新エディター(編集画面)のことです。WordPress5.0以降のバージョンではGutenbergが標準搭載されています。

Gutenbergでは、ビジュアルエディターに「ブロック」と呼ばれる新要素が追加されました。

WordPress

WordPressを使っている人なら誰しもが使ったことのある機能で、「ブロックエディター」とも呼ばれています。

Gutenbergは目次の作成だけではなく画像、動画を含んだコンテンツを初心者でも簡単に作成できます。

WprdPressがアップデートされる前の旧エディターは「ClassicEditor」と呼ばれるエディターでアップデートされたことにより廃止されてしまいました。

Gutenbergのインストール方法

WordPress5.0以降から始めたら最初から搭載されていますが、それ以前のバージョンの人はGutenbergのプラグインをインストールする必要があります。

まだインストールされてない方は記事を見ながらインストールしてみてください。

たか

まずはWordPressを立ち上げて「プラグイン」をクリックします。

WordPress

次に「新規追加」をクリックします。

WordPressプラグイン

プラグインの検索欄で「Gutenberg」と入力します。

WordPressプラグイン

そしたら下の画像のプラグインをインストールしてください。

WordPressプラグイン

インストールをして有効化を押したらGutenbergを使用することができます。

Gutenbergの使用方法

目次を作成するのでまずは記事を作成しましょう。「投稿」→「新規作成」を押します。すると下のような編集画面になると思います。

WordPress

今回は目次を作成することが目的なのでその他の設定は省きます。

「Enter」を一回、二回押すと「文章を入力、または/でブロックを選択」という項目が出てきます。

カーソルを合わせると下のアイコンが出てきます。

そのアイコンを押すと下の画面が出てきます。

WordPress

リストを押すと、「箇条書きリストに変換」か「番号付きリストに変換」に変更できる欄が出てきます。

WordPress

サンプルとして筆者の作成した目次を載せておきます。

WordPress

こんなかんじでプラグインを導入しなくても手動で目次を作成することができます。

ですが記事を書くときにいちいち手動で目次を作成しなければいけないのであまりおすすめしません。

プラグインを導入したら作成した見出しをそのまま自動的に目次にしてくれるのでそっちの方が手間はかかりません。

»【WordPress】ブロックエディターで記事の文字数を稼ぐ方法

WordPress
【WordPress】ブロックエディターで記事の文字数を稼ぐ方法

続きを見る

記事に目次を付けるメリット

メリットは次のとおり。

目次を付けるメリット

  • 読みたい見出しへ飛ぶことができる
  • 読者に記事の内容がわかりやすく伝わる
  • 検索結果に反映される

詳しく解説していきます。

①:読みたい見出しへ飛ぶことができる

気になる見出しがあるのにそこまで行くのにスクロールしなければいけないなんて、めんどくさいと読者は感じます。

目次を設置しておくことで気になる見出しを押したらそこまで移動することができます。

仮に自分が悩んでいて解決するためにいろいろな記事を見て周っているときにピンとくる見出しがあったらそこまですぐにいきたいと思うはずです。そう思うのは目次を見たからです。

読者が求めている情報をいち早く提供できるのはGoogleからも評価の対象になります。なので読者のためにもなりますし自分のためにもなるので目次は必須です。

②:読者に記事の内容がわかりやすく伝わる

まず読者は記事の内容を全て見ることはありません。

自分が見たいと思ったところ、気になるところしか見ないので目次を作成しておかないと記事を読まずにサイトを離れてしまいます。

タイトルが気になってたが記事を読んでみると全然違かったということが原因です。なので目次を作成し配置しておくことで記事全体の内容が伝わるのでサイトを離れるということが無くなります。

情報量の多いWEBの世界で、ユーザーが必要としている記事の見つけやすさはとても大切なことなので集客数を増やしたいならば必ず目次は設置するようにしましょう。

③:検索結果に反映される

目次があると検索サイトの検索結果画面においてページタイトルの下に情報が掲載されます。(メタディスクリプションと呼ばれる場所。)

そのため、読者は記事を読む前にどのようなことが書いてあるのかを大まかに把握することができるのです。メタディスクリプションには検索されやすいキーワードを反映させることができるので自然に見出しがメタディスクリプションに反映されやすいです。

そこで目次を設定しておくことで検索サイトのクローラーに記事が分かりやすく簡潔に伝わるので記事を評価され検索結果に表示されやすくなるのです。これはSEO対策にもなるので目次はあったほうが絶対に良いです。

記事に目次を付けるデメリット

正直言ってデメリットはありませんが、今回紹介した「Table of contents plus」提供されているプラグインなのでいつ廃止されるかわかりません。

なので、Table of contents plusを使っていた記事には目次が反映されなくなってしまいます。Table of contents plusが廃止されたら他のプラグインを追加で導入して使用した方がいいでしょう。

グーテンベルクは目次の配置の仕方、性能がプラグインよりは劣るので紹介しましたがあまりおすすめはできません。

目次を作成するデメリット

  • プラグインなのでいつ廃止されるかわからない。

廃止される可能性は限りなくゼロに近いので安心して使っていて問題ありません。

まとめ:目次は必ず作成しよう

目次を作成することで記事全体の評価を読者からもクローラーからも上げることができますし単純に記事全体を整理できるので見映えも良くなります。

目次を使っていない人の方が珍しいです。

集客、検索順位を上げたいのであれば目次は必ず配置しましょう。

»WordPress5.8でアップデートされた機能と注意すべきこと

WordPress5.8でアップデートされた機能と注意すべきこと

続きを見る

WordPress関連記事

  • この記事を書いた人

たか

副業で稼ぎたくブログを始める▶︎全く伸びず1ヶ月で挫折▶︎ショックで目の前真っ暗▶︎manablogさんの動画を見てブログ再開▶︎ブログを猛勉強▶︎ ブログ最高月収56万▶︎コツコツと継続し総合収益300万達成▶︎『役立つ情報』をモットーに情報発信中。普段はTwitterにいます。

-WordPress, ブログ初心者, ブログ運営
-,

© 2022 takablog