WordPressで目次作成する方法をプラグインあり／なしで紹介

WordPressの記事の中に目次があると、記事内容がひと目で分かるため、読者にとって非常に便利で、検索エンジン対策としても有効です。

しかし、WordPress初心者のなかには、目次の作り方がわからないという人もいると思います。

今回はWordPressで目次を作成する方法を、プラグインあり、プラグインなしの両方のパターンで解説します。

WordPressの記事に目次を入れることは非常に重要です。

目次があることで記事の利便性が高まり、結果的にアクセスアップに繋がるほか、SEO的な観点からもポジティブな効果を期待できるからです。

ここからはWordPressに目次を入れる具体的なメリットを解説します。

WordPressの記事に目次を設置することで、記事のおおまかな内容がすぐに把握できるようになります。

そもそも読者は悩みや疑問を抱えており、それらを解決したいと思って記事にアクセスしていますが、その記事に書いてあることの全てを読者が必要としているとは限りません。

求めている情報が書かれていなかったり、見つからなかったりした場合には、次の記事を求めて離脱されてしまう可能性が高くなります。

そこで記事冒頭に目次を設置することで、求めている情報の有無が瞬時にわかるようになり、その情報にすぐアクセスできるようになります。

記事冒頭に目次があれば、目次をクリックすることで、読みたい箇所までスキップできます。

前述のとおり、すべての読者が記事内容の全部を必要としているとは限りませんし、記事のすべてを読みたいわけでもありません。

特定の情報のみを求めているにもかかわらず、無駄に文章が長ければ、途中離脱につながります。

読者が求める情報をすばやく提供することは、ユーザビリティを向上させます。

記事に目次を設置することで、アクセスアップも期待できます。

というのも、Googleの検索結果には、目次の内容が表示されるケースがあるからです。

検索結果に目次が表示されると、検索ユーザーの目に記事の内容が留まりやすくなるので、結果的にクリック率やアクセスアップも期待できます。

読者の利便性を高めることは、SEO的にも良い効果が期待できます。

読者に必要な情報をすばやく届けることは、良質なコンテンツを提供しているという評価につながるからです。

これはGoogleの目指すユーザーファーストという考え方と通じています。

目次を作成することはユーザーファーストに繋がる施策であり、結果としてSEOにも良い効果をおよぼすと言えるでしょう。

WordPressの記事に目次を作成する方法として、プラグインを利用する方法と、HTMLで目次を作成する方法の2通りがあります。

それぞれの方法について解説していきましょう。

まずはプラグインを使って目次を作成する方法を解説します。

目次作成のプラグインの中でも、一般的に定番とされているのが「Table of Contents Plus」と「Easy Table of Contents」なので、本記事ではこの2つを紹介します。

なお、設定可能な内容はどちらもほぼ同じですが、Easy Table of Contentsのほうが詳細な設定が可能です。

WordPressの管理画面にログインし、左横のメニュー欄にある「プラグイン」を選択し、「新規追加」をクリックしましょう。

右上にある検索窓から「Table of Contents Plus」と検索、「Table of Contents Plus」の「今すぐインストール」をクリック、インストールが完了したら「有効化」をクリックします。

管理画面の左メニューにある「設定」を選択し、「TOC＋」をクリック、「基本設定」として表示される以下の設定項目を自分仕様に変更しましょう。

これらの設定をチェックし終えたら、一番下にある「設定を更新」をクリックすると、次から記事内に自動で目次が表示されるようになります。

WordPressの管理画面にログインし、左メニューの「プラグイン」から「新規追加」をクリックしましょう。

右上にある検索窓から「Easy Table of Contents」と検索し、表示されたら「今すぐインストール」をクリック、インストールが完了したら「有効化」をクリックします。

管理画面の左メニューにある「設定」を選択し、「目次」をクリックしましょう。

「一般」と「外観」の設定項目を変更しましょう。注意事項は以下3点です。

最後に一番下にある「設定を更新」をクリックすれば、次から該当の記事に自動で目次が表示されるようになります。

次に、プラグインを使わずにHTMLを書くことで目次を作成する方法をご紹介します。

この方法では、記事の中にHTMLでコードを書いて目次を作成するため、HTMLの知識が必要となります。

なお、PHPファイルを編集して作成する方法もありますが、サイト全体のデザインや表示が崩れてしまう可能性があるため、今回は割愛しています。

手動で目次を作成する場合は、以下の手順で進めていきます。

まず、WordPressの管理画面のブロックエディタで「カスタムHTML」を選択、カスタムHTMLに「<h2 id="heading1">見出し1</h2>」と記述して、記事の見出しを作成します。

なお、ここでは内容を「見出し1」としていますが、記事の見出しの内容に変更可能で、また、HTMLの中で「id」として指定している「heading1」も任意で設定可能となっています。

同様の手順で、カスタムHTMLのブロックを追加して「<h2 id="heading2">見出し2</h2>」「<h2 id="heading3">見出し3</h2>」を作成しましょう。

カスタムHTMLの表示を「プレビュー」に切り替えると、見出しの内容が表示されますので、作成した3つの見出しの先頭に、新たにカスタムHTMLブロックを作成し、以下のHTMLを入力しましょう。

「#heading1」「#heading2」「#heading3」は見出しのHTMLで設定したタグを記述することで、アンカーリンクになります。

カスタムHTMLをプレビューに切り替えると、見出しの先頭に目次が作成されていることを確認できます。

目次のリンクをクリックすると、該当する見出しへとジャンプします。

あとは見やすいように目次部分をボックスで囲んだり、デザインを整えたりすることで、きれいな目次の完成です。

プラグインを使った目次と、HTMLで表示させる目次のどちらを選ぶべきなのでしょうか。

初心者にはプラグインの利用をおすすめします。なぜなら記事ごとに目次を設定する手間がなくなるからです。

後者の場合は、記事を作成するたびに目次部分のHTMLコードを入力する必要があり、コードが間違っていると目次が機能しなくなるリスクがありますが、前者の方法なら、プラグイン導入時に設定を完了してしまえば、その後の複雑な設定や手間は不要となります。

ただし、すでにWordPressに導入済みのプラグインの数が多すぎる場合や、ウェブページが少しでも表示速度が遅くなるのを避けたい、目次の表示箇所を自由に指定したいという場合には、プラグインを使わずにHTMLで目次を作成しましょう。

自身のサイト運営方針や重視する要素から、最適解を選んでみてください。

WordPressに目次を作成できたら、クリック率を高めるように工夫することも心がけましょう。

目次のクリック率を高める上での重要になるポイントは次の3点です。

目次は閉じていると気づいてもらえない可能性があるため、最初から開いておく設定にすることをおすすめします。

また目次の文面は長すぎると読んでもらえないし、短すぎても意図が伝わらないので、記事の要点を適切な文量でまとめることが重要です。

さらに、目次はあまり深い階層まで表示すると把握しづらいので、H3までにすると、読者に見やすい印象を与えます。

ただしこれは記事の内容や長さ次第で、見出しの数が多いときはH2までにしたり、逆に内容を詳しく表示したいときはH4までにするなど、状況に応じて調整することも必要です。

今回は、WordPressで目次を作成するメリットと、プラグインありとなしで目次を作成する方法を解説しました。

目次を入れることは、ユーザビリティとSEOの双方の観点からメリットがあるので、特別な理由やこだわりがない限りは、目次を設置することをおすすめします。

目次を作成する方法として、初心者には手間のかからないプラグインを活用した方法を推奨します。

また、最初は使ってみて、WordPressに慣れてきたら、プラグインを使わずに目次を作成する方法に移行するのもありでしょう。

本記事を参考にしながら、ユーザーファーストのWordPress記事を作成してみてください。

独自ドメインを取得するなら「お名前.com」

「お名前.com」は、国内No.1のドメイン登録サービスです。

独自ドメインと合わせて、WordPressの自動インストールに対応したレンタルサーバーも利用できます。

WordPressや独自ドメインを一度も使ったことのない人でも、スムーズに始められるはずです。

独自ドメインを取得しようと考えている方は、まずは無料で好きなドメイン名を検索してみましょう。