WordPressで目次の作り方3つとおすすめプラグイン5選

この記事では、WordPressの目次の作り方や、どのプラグインを選べばいいか分からない人に向けて、私がいくつかのブログで試してきた方法をまとめて紹介します。

読み終わるころには、「どの方法で目次を作るか」「自分はどのプラグインを使えばいいか」がスッキリ決まっているはずです。

WordPressで目次を入れるべき理由と作り方の全体像

そもそもWordPressの目次とは？どんな役割があるのか

WordPressの目次は、本でいう「もくじ」と同じで、記事内の見出しを一覧にしたナビゲーションのようなものです。

特にスマホで長めの記事を読むときは、目次があるかどうかで読みやすさがかなり変わります。

イメージをつかみやすいように、目次ありの記事と、目次なしの記事の違いを簡単に整理してみます。

観点	目次あり	目次なし
読みやすさ	長文でも全体像がひと目で分かる	どこに何が書いてあるか分かりにくい
移動のしやすさ	見出しをタップして一気に移動できる	読みたい場所まで延々とスクロールが必要
SEO面	クリック率や滞在時間アップにつながりやすい	途中離脱されやすく検索評価も下がりがち

私のブログでも、同じテーマの記事で「目次あり」と「目次なし」を比べると、目次ありの記事のほうが明らかに途中離脱が減りました。

読者が「今どのあたりを読んでいて、次に何があるのか」をすぐ理解できるので、結果的に最後まで読んでもらいやすくなります。

このブログで紹介するWordPress目次の作り方の全体像

WordPressで目次を作る基本的なパターンは、次の3つです。

検索でよく見かける「WordPressの目次の作り方」は、ほとんどがこのどれかを詳しく説明したものです。

最初のうちは、素直に目次プラグインを使うのが一番ラクで、間違いも少なく済みます。

とはいえ、テーマによっては標準の目次機能がとてもよくできていたり、プラグインを増やしたくない人もいますよね。

そこでこの記事では、3つの方法をすべて取り上げて、「どんな人にどの作り方が向いているか」まで分かるように解説していきます。

WordPressの目次の作り方3パターンをざっくり比較

① 目次プラグインで自動生成する方法

一番ポピュラーなのが、目次プラグインを入れて、見出しから目次を自動生成させる方法です。

プログラミングの知識がなくても、プラグインを有効化して設定画面でチェックを入れていくだけで、ほとんどのケースは十分に使えます。

3つの作り方のイメージをまとめると、次のようになります。

作り方	難易度	おすすめな人
目次プラグイン	低い	初めてWordPressで目次を作る人
テーマの目次機能	低〜中	対応テーマを使っていて機能を活かしたい人
プラグインなし自作	中〜高	コードに抵抗がなく、高速化も意識したい人

私も最初のブログでは、完全に目次プラグイン頼みでしたが、それでも何十記事と運営するうえで特に困ることはありませんでした。

「とりあえず早く記事を公開したい」という段階では、細かいカスタマイズよりも、この方法でサクッと目次を出してしまうのがおすすめです。

② テーマの目次機能を使う方法

最近のWordPressテーマの中には、最初から目次機能が用意されているものも多いです。

テーマの設定画面で目次の項目をオンにするだけで、自動的に目次を表示してくれるタイプですね。

テーマの目次機能を使うときに意識したいポイントは、次のあたりです。

• テーマの設定で目次機能がオンになっているかチェックする
• どの見出しレベル（H2〜H3など）を目次に含めるかを決める
• 目次プラグインと二重表示にならないよう、どちらか片方だけを使う

すでにテーマに使いやすい目次機能が付いているなら、新しいプラグインを入れずに、その機能を優先的に使うほうがシンプルです。

あとからプラグインへ乗り換えることもできますが、最初に決めておいたほうが管理はラクになります。

③ プラグインを使わずに自作する方法

「プラグインはできるだけ少なくしたい」「自分好みの目次を作り込みたい」という人は、プラグインなしで目次を自作する方法もあります。

代表的なのは、カスタムHTMLとアンカーリンクを組み合わせる方法と、テンプレートやfunctions.phpを編集して自動生成する方法です。

プラグインなしで目次を作る流れは、ざっくり言うと次のような感じです。

仕組みが分かれば自由度は高いですが、記事ごとに目次をメンテナンスする必要があるため、記事数が増えてくると手間が大きくなります。

まずはプラグインで運用してみて、「もっと細かくいじりたい」と思うようになったら、少しずつ自作にも挑戦していくくらいがちょうどいいと思います。

WordPress目次プラグインおすすめ5選と選び方

WordPress目次プラグインを選ぶときのチェックポイント

目次プラグインを選ぶときは、なんとなく有名そうなものを入れるのではなく、次のポイントを軽くチェックしておくと失敗しにくいです。

チェック項目	見るポイント
更新状況	長く放置されておらず、最近も更新されているか
対応エディター	ブロックエディターやクラシックエディターに対応しているか
カスタマイズ性	見出しレベルや番号、デザインを柔軟に変えられるか
表示速度	不要な機能が多すぎず、できるだけ軽いか
日本語情報	日本語の記事や解説がある程度見つかるか

特に大事なのは、「対応エディター」と「更新状況」です。

ブロックエディターで使いにくいプラグインを選んでしまうと、毎回の編集が地味にストレスになりますし、更新が止まっているプラグインは、将来的な不具合のリスクもあります。

Easy Table of Contentsの特徴と設定のポイント

「Easy Table of Contents」は、名前のとおり扱いやすく、情報も多い定番の目次プラグインです。

私もサブブログでは、このプラグインだけで目次をまかなっているサイトがあります。

主な特徴は、次のようなイメージです。

• 投稿や固定ページなど、対象にしたいコンテンツを選んで自動挿入できる
• H2〜H4のように、目次に含める見出しレベルを柔軟に選べる
• 目次のタイトルや枠線、背景色など、最低限のデザインを簡単に変えられる

導入の流れはざっくりと次のとおりです。

操作はほぼチェックボックスとプルダウンだけなので、「とにかく早く目次を設置したい」という人に向いています。

LuckyWP Table of Contentsの特徴と設定のポイント

「LuckyWP Table of Contents」は、ブロックエディターとの相性が良い目次プラグインです。

専用のブロックを挿入する形でも使えるので、「この記事だけ別の位置に目次を置きたい」といった細かい調整もしやすくなっています。

特徴をまとめると、次のようになります。

• ブロックエディターの専用ブロックやショートコードで目次を挿入できる
• いくつかのデザインプリセットがあり、好みのスタイルを選びやすい
• 折りたたみ表示や番号の有無など、細かい設定も簡単に変えられる

「記事ごとに目次を出すかどうか決めたい」「おしゃれすぎなくていいので、きれいめなデザインに整えたい」という人には、とても使いやすいプラグインだと思います。

Table of Contents Plusの特徴と注意点

「Table of Contents Plus」は、WordPressの目次プラグインの中でも歴史が長く、利用者が多い定番プラグインです。

使い方を説明している記事もたくさんあるので、調べながら設定したい人に向いています。

主なポイントは次のとおりです。

一方で、テーマ側のCSSやほかのプラグインとの兼ね合いによって、デザインが崩れたり、思った場所に表示されないこともあります。

インストール後は、テスト用の記事で表示位置や見た目をよく確認してから、本格的に使い始めるのがおすすめです。

ブロックエディター向け目次プラグインの例

ブロックエディター中心で記事を書いている場合は、「目次ブロック」を提供してくれるタイプのプラグインも便利です。

具体的な名前はプラグイン一覧で変わることがありますが、次のようなタイプを探すと見つけやすいです。

• 目次専用のブロックを追加してくれるプラグイン
• 複数のブロックがセットになったプラグインの中に「目次ブロック」が含まれているもの

これらは、編集画面で実際の目次ブロックを見ながらデザインを調整できるので、「このページだけ少し違う位置に置きたい」といった細かいニーズにも対応しやすいです。

テーマ機能とプラグインなしで作るWordPress目次の作り方

人気テーマにある目次機能の探し方

まずは、今使っているテーマに目次機能が入っているかどうかを確認してみましょう。

有名どころのテーマだと、次のような傾向があります。

テーマ例	目次機能の有無	設定の探し方
Cocoon系	あり	ダッシュボード→Cocoon設定→目次のあたりを確認
SWELL系	あり	投稿画面で専用の目次ブロックや設定をチェック
その他有料テーマ	ありのことが多い	外観→カスタマイズやテーマ独自の設定画面を確認

もしテーマ側の目次機能で十分だと感じるなら、新しくプラグインを入れずに済むので、サイトもシンプルに保てます。

ただし、テーマの目次機能とプラグインの目次機能を同時にONにすると、目次が二重に表示されることがよくあります。

その場合は、テーマかプラグインのどちらか一方の目次機能だけを残すようにしましょう。

カスタムHTMLとアンカーリンクで手作りする方法

プラグインやテーマの機能に頼らず、もっとシンプルに目次を作りたい場合は、カスタムHTMLとアンカーリンクで手作りする方法があります。

イメージとしては、次のような手順です。

ブロックエディターでもカスタムHTMLブロックやアンカーの機能を使えば、この手作り目次は作成できます。

ただ、記事を修正するたびに目次のリンクも自分で直す必要があるので、記事数が多いブログでは管理が大変になりやすい点には注意してください。

テンプレートやfunctions.phpで自動生成する考え方

もう一歩踏み込んで、自分だけの自動目次機能を作りたい場合は、テーマのテンプレートファイルやfunctions.phpにコードを書いて、見出しから自動で目次を生成する方法もあります。

ここでは細かいコードは省きますが、考え方としては次のとおりです。

• 本文のHTMLからH2やH3などの見出しタグをPHPで抜き出す
• 抜き出した見出しを元に、目次用のリストHTMLを生成する
• 本文の前や途中など、好きな位置に目次を差し込む処理を書く

うまく作れば、プラグインなしで柔軟な目次を自動生成できますが、PHPとテーマ構造への理解が必要になります。

ブログ運営や記事作成に使える時間とのバランスを考えて、「今はプラグインに任せる」「時間ができたら自作にも挑戦してみる」と段階を分けて考えると、ムリなく続けやすいです。

WordPressの目次プラグインを活かす設定と書き方のコツ

読まれる目次の配置・デザインのポイント

同じように目次を表示していても、配置やデザインを少し変えるだけで、クリックされる回数が変わります。

よく調整する項目と、私がよく使っている設定例をまとめました。

設定項目	おすすめ設定例
自動挿入する投稿タイプ	まずは「投稿」のみにして様子を見る
自動挿入位置	リード文の直後、最初の見出しの少し前
対象見出しレベル	H2〜H3を中心に、必要ならH4まで
目次タイトル	「目次」「この記事で分かること」などシンプルな文言

デザインは、派手にしすぎるよりも、枠線と淡い背景色で軽く囲うくらいがバランスが良いと感じています。

目次を記事のかなり下のほうに置いてしまうと、そもそも目に入らず、ほとんどクリックされません。

リード文のすぐあとに目次があると、「この記事にはこういう流れで書いてあります」と最初に伝えられるので、読者も読み進めやすくなります。

見出しの付け方と階層の決め方

WordPressの目次プラグインは、見出しタグ（H2、H3など）を拾って目次を作っています。

つまり、見出しの付け方次第で、目次の分かりやすさも大きく変わるということです。

見出しを作るときは、次のような点を意識してみてください。

目次を見たときに、「この見出しから読もう」とすぐ判断できるようにしておくと、クリックされやすくなります。

逆に、抽象的な見出しや似たような表現ばかりだと、目次を見てもピンと来ないので、読者の手も止まりがちです。

サイト表示速度と目次プラグインの付き合い方

「目次プラグインを入れると、サイトが重くならないかな」と心配する人も多いと思います。

たしかに、たくさんのプラグインを入れすぎると、表示速度が落ちる原因になりますが、目次プラグイン1つで極端に重くなることはあまりありません。

私が普段から気を付けているのは、次のような点です。

• 役割がかぶるプラグインをいくつも入れないようにする
• 機能が多すぎて使い切れないようなプラグインは避ける
• キャッシュ系や高速化系プラグインとの相性を確認する

もし「目次を入れてから重くなった気がする」と感じる場合は、一度そのプラグインだけ停止してページ速度を測り比べてみてください。

それでも気になるようなら、テーマの目次機能を使ったり、よりシンプルな目次プラグインに乗り換えるのもひとつの対策です。

よくある質問（WordPress 目次 作り方・プラグイン編）

トラブル	主な原因	対処の方向性
目次が表示されない	見出しタグが正しくない、プラグイン設定がオフ	記事の見出し構造とプラグイン設定を確認する
目次が二重に表示される	テーマ機能とプラグインが同時に有効	どちらか片方の目次機能をオフにする
デザインが崩れる	テーマとプラグインのCSSがぶつかっている	CSSを調整するか別プラグインを検討する

Q1. WordPressの目次プラグインを入れたのに、目次が表示されません

A. 多くのケースでは、「見出しタグ」と「自動挿入の設定」が原因になっています。

目次プラグインは、H2やH3といった見出しブロックを探して目次を作っています。

太字や大きな文字で見出しっぽくしていても、見出しブロックになっていないと、プラグイン側は見出しとして認識してくれません。

次のポイントを順番にチェックしてみてください。

• 本文中で、ちゃんとH2〜H3の見出しブロックを使っているか
• プラグインの設定で「投稿に自動挿入」がオンになっているか
• 目次を表示するための見出し数（例：3個以上など）の条件を満たしているか

これでも表示されない場合は、一度別のテーマに切り替えてテストし、目次が出るかどうかを確認してみるのも手です。

テストテーマでは表示されるのに本番テーマでは表示されない場合、今のテーマとの相性やCSS、もしくはほかのプラグインとの組み合わせが影響している可能性が高いです。

Q2. WordPressの目次が二重に出てしまいます

A. テーマ側の目次機能と、WordPress目次プラグインの両方が動いている可能性が高いです。

たとえば、Cocoon系のテーマには目次機能があり、設定画面でオンにしていると、自動的に目次が表示されます。

この状態で「Easy Table of Contents」や「LuckyWP Table of Contents」などのプラグインを有効化すると、同じ位置に目次が2つ重なってしまうことがあります。

対処法はシンプルで、次のどちらかを選べばOKです。

• テーマの目次機能をオフにして、プラグインだけを使う
• 目次プラグインを無効化して、テーマの目次機能だけを使う

どちらが正解というよりは、「どちらのほうが自分にとって管理しやすいか」「好みのデザインが出せるか」で決めてしまって大丈夫です。

私なら、テーマのデザインが好きならテーマ機能を優先し、細かい設定を触りたいときはプラグインを選ぶ、という基準で考えます。

Q3. WordPressの目次の作り方は、プラグインと手作りどちらがいいですか

A. ほとんどの人には、まず目次プラグインを使う作り方をおすすめします。

私も昔は「プラグインを増やしたくないから手作りのほうがいいかな」と思っていたのですが、記事数が増えてくると、毎回手作りで目次を直すのはかなり大変でした。

プラグインなら、見出しをきちんと付けていれば自動で目次を更新してくれるので、運用していくうえでのストレスが少ないです。

目安としては、次のように考えると分かりやすいと思います。

• ブログを始めたばかり、または月数本ペースで更新 → 目次プラグインを使うのがいちばん楽
• コードを書くのが好きで、自分で細かくカスタマイズしたい → 手作りやfunctions.phpでの自動生成に挑戦
• 使っているテーマに十分な目次機能がある → まずはテーマの目次機能を活かす

どの方法でも目次自体は作れますが、「続けやすさ」と「ミスの少なさ」という意味では、最初のうちはプラグインを選ぶのが無難です。

まとめ：WordPressの目次の作り方と今日からの一歩

この記事の要点おさらい

• WordPressの記事に目次を入れると、読みやすさとSEOの両方でメリットがある
• 目次の作り方は「プラグイン」「テーマの目次機能」「プラグインなし自作」の3パターンに分かれる
• 初めてなら、まずはWordPress目次プラグインを使う作り方が簡単で失敗しにくい
• テーマに目次機能がある場合は、プラグインと二重表示にならないよう、どちらか片方だけを使う
• 目次の配置や見出しの付け方を工夫すると、クリックされやすくなり記事全体も読みやすくなる

今日から読者が取るべき最初の一歩

「結局、何からやればいいの？」という人は、次の順番で進めてみてください。

ここまでできれば、WordPressの目次まわりはかなり整っている状態です。

あとは記事を増やしながら、「この配置のほうが読みやすいかな」「もう少し見出しを分けたほうがいいかな」と、少しずつ調整していけばOKです。

ぜひ、次に書く記事から、目次の導入と改善をセットで進めてみてください。