SWELLの目次設定|表示条件・サイドバー追従・出ないときの確認順

SWELLの目次が出ないときの設定確認順を示すアイキャッチ

※本記事にはプロモーションが含まれます。

SWELLの目次は、表示するページ・拾う見出し・必要な見出し数の3点から設定します。出ない場合はこの条件と記事個別の指定、長すぎる場合は抽出階層を確認すると原因を絞れます。色や装飾を調整する前に、読者が行きたい節を選べる目次になっているかを見ましょう。

確認範囲:2026年9月4日、SWELL 2.19.0で目次の表示対象・抽出階層・必要な見出し数の設定欄を確認しました。設定保存とサイドバー追従の実操作は未検証です。

最初に4つの判断を整理し、その後で表示条件とトラブル時の確認順を見ていきます。

Index

目次を「出す場所・深さ・個数・戻り方」で設計する

01

どのページで出すか

主な設定
投稿・固定ページ別の表示
迷ったときの基準
長文記事を中心に表示
02

どこまで拾うか

主な設定
H2のみ / H3まで
迷ったときの基準
目次が長いならH2のみ
03

何個から出すか

主な設定
見出し個数の条件
迷ったときの基準
短文で目次だけ出る状態を避ける
04

読書中に戻れるか

主な設定
固定目次ボタン・サイドバー
迷ったときの基準
画面幅とレイアウトで選ぶ

SWELL公式によると、記事本文の最初のH2直前へ目次を自動生成できます。目次そのものを手入力する必要はありません。

設定はカスタマイザーの「投稿・固定ページ」内にある「目次」から行います。

投稿・固定ページ別の表示を決める

カスタマイザーでは、投稿ページと固定ページで目次の自動生成を使うかを分けて設定できます。

SWELLの目次設定。投稿・固定ページの表示、見出し階層、表示に必要な個数。
2026年9月4日確認、SWELL 2.19.0。実際の設定画面です。公開サイトの設定は保存していません。

当サイトでは投稿ページの表示チェック、抽出する見出し階層、表示に必要な見出し数をそれぞれ別に指定する画面でした。画像の「h5」「2」は現状値であり、すべての記事への推奨値ではありません。

目次を出すかはページの目的で決めます。比較や長い手順記事は読者が必要な節へ移動できる一方、短い問い合わせページでは入力フォームへ直接進める方が便利です。まず代表記事と短い固定ページを1件ずつ確認し、全体設定と個別の例外を分けてください。

公式マニュアルでは、サイト全体の設定と反対の指定を記事・ページ単位で上書きできます。例外が少数なら、全体設定を変えず対象記事だけで切り替えます。

「一部の記事だけ出ない」ときは、記事編集画面の目次設定が全体設定を上書きしていないか確認してください。

H2だけかH3まで含めるかを選ぶ

公式マニュアルでは、目次に抽出する階層をH2だけ、またはH3までから選べます。

H3まで含めると詳細へ直接移動できますが、項目数が増えます。スマホで目次が画面を占有するなら、先にH2だけへ絞ります。

目次だけを読み、「何が分かる記事か」を説明できるか確認します。「設定」「注意点」だけなら、「表示対象を決める」「目次が出ないときに見る場所」のように具体化してください。見出しを直すと本文への移動先も選びやすくなります。

H4以下まで目次へ見せたくなる場合は、記事の階層が深すぎないか見直します。目次設定で構造の問題を隠さないことが大切です。

表示する見出し個数を調整する

SWELLには、抽出対象の見出しが何個以上あるときに目次を出すかを設定する項目があります。

短い記事に目次が出ると、本文より案内のほうが大きく見えます。反対に条件を高くしすぎると、必要な長文記事でも出ません。

目次が表示されない場合は、記事内のH2・H3の総数ではなく、現在の抽出対象になっている見出し数を数えます。

たとえばH2だけを抽出し、表示条件を3個以上にしている場合、H2が2個・H3が5個の記事は条件に届きません。見出しの総数ではなく、設定で数える対象を先に確認すると、非表示の理由を切り分けられます。

デザインは構造が決まってから選ぶ

公式マニュアルでは、目次のデザインとリストタグの組み合わせを選べます。見た目の違いより、番号が必要か、階層が読み取れるかを先に決めます。

手順やランキングのように順序へ意味がある記事なら番号付き、順序がない案内なら箇条書きが自然です。

目次の色をサイトのメインカラーへ合わせても、リンクだと分からなければ役に立ちません。文字サイズ、行間、リンク状態をスマホで確認します。

目次前後へ広告やCTAを置く場合は、目次と操作が競合しないよう間隔を取ります。読者が本文へ入る前に大型要素を連続させないでください。

固定目次ボタンとサイドバー追従を使い分ける

公式マニュアルでは、画面右下へ固定目次ボタンを表示する機能が案内されています。カスタマイザーの「サイト全体設定」にある「下部固定ボタン・メニュー」から設定します。

スマホの固定目次ボタンとPCのサイドバー追従を端末別に使い分ける図
スマホは固定ボタン、PCはサイドバーなど、画面幅ごとに主な戻り口を1つ決めます。

シングルカラムやスマホでは、読書中に目次へ戻る経路として固定ボタンが役立ちます。

サイドバーが常に見えるPCレイアウトでは、追従目次が候補です。ただし固定ボタンと同じ役割を重ねると、操作要素が増えます。

スマホでは固定目次、PCではサイドバーなど、画面幅ごとに戻り口の役割を決めます。設定後は記事の途中までスクロールし、Cookie通知や固定CTAと重ならず、本文へ戻れることを確認してください。

目次が出ないときの確認順

目次が出ないときの確認順

  1. STEP 01
    投稿または固定ページで目次の自動生成が有効か確認する
  2. STEP 02
    記事単位の設定で非表示に上書きしていないか確認する
  3. STEP 03
    見出しがH2または対象に含めたH3で作られているか確認する
  4. STEP 04
    抽出対象の見出し数が表示条件に届いているか数える
  5. STEP 05
    最初のH2直前付近に目次が生成されていないか確認する
  6. STEP 06
    キャッシュ削除後のログアウト表示を確認する

太字の段落を見出しに見せていても、H2・H3としては数えられません。エディターのアウトラインで見出し構造を確認します。

一部記事だけの問題なら記事単位の上書き、サイト全体ならカスタマイザー設定から見ると、調査範囲を狭められます。

公開前の目次チェック

目次の公開前チェック

0 / 8 完了

設定後は目次のリンクを実際に選び、目的の見出しへ移動できるかを確認します。項目名だけで行き先が分からない場合は、抽出条件より本文の見出しを直すのが先です。スマホでは固定ボタンなどと重ならず、途中から目次へ戻れることまで確かめれば、見た目だけの設定で終わりません。

SWELLを利用中の方は、表示対象・見出し階層・固定目次の順に設定を確認してください。

関連する設定は、FAQとアコーディオンの使い分けで確認できます。

SWELLをまだ利用していない方へ

テーマ標準で目次や固定ボタンを管理したい方は、CocoonとSWELLで変わる記事制作の手順を比較する記事を確認できます。目次だけでなく、普段使う編集機能と移行の負担も合わせて選びましょう。

公式情報

よかったらシェアしてね!
  • URLをコピーしました!
  • URLをコピーしました!

この記事を書いた人

個人でWordPressブログを運営しています。WordPress歴7年。実際に契約・利用しているConoHa WINGとSWELLを中心に、ブログの開設、表示・編集環境の改善、SEO、アフィリエイト、AIを使った制作効率化を検証しています。

公式情報を確認するだけでなく、実機で試した結果、うまくいかなかった点、向かないケースも含めて共有します。読者が遠回りせず、自分のブログで次の一手を選べる情報を届けることが目標です。

Index