歴史的訂正（2026-09-01確認）： この記事は2011年に公開され、jQuery Table of ContentsというWordPressプラグインを紹介していました。現在、WordPress.orgの公式プラグインディレクトリと公式プラグインAPIの検索結果では、その完全に同じ名称の現行掲載を確認できません。これは、プラグインが存在しなかったことの証明でも、後に改名されたかどうかの判断でもありません。旧記事のダウンロード案内、テーマ用セレクター、画面説明を現在のインストール手順として使わないでください。信頼できないミラーから古いパッケージを入手するのも避けてください。
Table of Contents
現在のWordPressで目次を作る方法
目次の本質は、同じページ内の見出しアンカーへ移動するリンクの一覧であり、jQueryは必須ではありません。重要な長文が少数なら、現在はWordPress標準の見出しブロック、HTMLアンカー、リストブロックを優先します。サイト全体で自動化するなら、現時点で保守されているプラグインを評価するか、サイト専用ブロックを開発します。目次は移動を助けますが、この記事は検索順位の向上を約束しません。
2011年の記事から残す記録
旧プラグインでは「content selector」と収集対象の見出しタグを指定しました。当時のこのサイトのテーマは #content .contenttext を使い、記録上のプラグイン既定値は .single .entry、目次対象は h2 または h3 でした。これらは歴史資料としてのみ残します。セレクターは当時のテーマのDOMに全面的に依存し、テーマやテンプレートを替えれば壊れ得ます。すべての見出しを「ページ上部へ戻る」リンクにする設計も、検討なしに再現すべきものではありません。
元のスクリーンショットはリンク切れの旧URLにあり、古い画面を示すものだったため、ここでは再掲しません。旧プラグインの現在の保守、安全性、互換性を説明できる十分な証拠もありません。
まず見出し構造を正しくする
目次を付けても、混乱した文書構造は直りません。WordPressの見出しブロック解説は、読みやすさとアクセシビリティのために見出しを順序どおり使うよう案内しています。多くのテンプレートでは記事タイトルが h1 になるため、本文は通常 h2 から始め、その小節に h3 を使います。ただしテーマやテンプレートで異なるので、実際のフロントエンドを確認してください。
エディターの「ドキュメント概要／アウトライン」で次を確認します。
- 文字を大きくするだけの目的で見出しを使わず、見た目はテーマやCSSで調整する。
- 理由なく
h2からh4へ飛ばさない。 - 各見出しは節の内容を表し、「説明」「その他」のような同じ語を繰り返さない。
- 翻訳では語句が変わっても同じ階層を保つ。
方法を選ぶ
| 方法 | 向いているケース | 主な負担 |
|---|---|---|
| 標準HTMLアンカー＋リスト | 正確に管理したい少数の長文 | 見出し変更時にリストも手動更新 |
| WordPressの実験的な目次ブロック | ステージングに存在し、将来の変更を許容できる | 公式に実験段階で、全サイトにあるとは限らない |
| 現在保守中の目次プラグイン | 多数の旧記事を一貫して自動化したい | 更新、出力、性能、削除方法の継続審査 |
| 独自の動的ブロック／プラグイン | 特殊なテンプレートや厳密な要件がある | 開発、試験、安全保守、移行計画が必要 |
長文が数本だけなら、最初の方法が最も理解、バックアップ、移行をしやすい場合が多いでしょう。
方法1：標準アンカーとリストを使う
安定したアンカーを作る
- 見出しブロックを選び、設定サイドバーの「高度な設定」を開きます。
- HTMLアンカーに
install、configure、verifyのような安定した名前を入力します。 - 同じページ内の各アンカーは一意でなければなりません。WordPressのページ内ジャンプ解説では、大文字と小文字を区別すること、英字で始めること、空白を含めないこと、ハイフン、アンダースコア、コロン、ピリオドを使用できることも説明されています。
- 記事の前半にリストブロックを置き、各項目を対応する
#アンカーにリンクします。
例：
- [インストール](#install)
- [設定](#configure)
- [確認](#verify)多言語記事では、各翻訳で install を維持するような、言語に依存しない安定したアンカーが便利です。英語にする必要はありません。重要なのは、各翻訳ページの href が、そのページに実在する一意の id と一致することです。
フロントエンドで確認する
エディターだけでなく、公開時のテンプレートでプレビューします。全項目をクリックし、#アンカー を含むURLを再読み込みし、ブラウザーの「戻る／進む」も試します。固定ヘッダーが移動先を隠す場合は、子テーマまたはサイトスタイルに次の規則を追加し、実際のヘッダー高に合わせて調整できます。
.entry-content :is(h2, h3, h4)[id] {
scroll-margin-top: 6rem;
}方法2：コアの目次ブロックは慎重に試す
WordPress開発者資料には現在 core/table-of-contents が掲載されています。見出しをまとめてHTMLアンカーを追加し、サーバー側で動的に出力するブロックです。しかし公式資料は、このブロックを明確に実験的とし、予告なく変更または削除される可能性があると説明しています。
まずステージングのブロック挿入画面で本当に利用できるか確認します。次に最大見出しレベル、番号付き／番号なし、ページ分割、既存アンカー、テーマの表示を試します。存在しない場合、ウェブ上の実験コードを本番へ貼り付けず、標準アンカーか現行プラグインを検討してください。利用できる場合も、通常のリストへ戻せる退避策を用意します。
方法3：現在の目次プラグインを評価する
インストール前
候補はWordPress管理画面またはWordPress.org公式プラグインディレクトリからのみ入手し、古いファイル置き場やミラーのZIPは使いません。先にバックアップし、ステージング上のWordPress、PHP、テーマ、関連プラグインのバージョンを記録します。インストール数、評価、最終更新日、互換性表示は変化するため、この記事の画像や順位ではなく導入日に再確認してください。
受け入れチェックリスト
- 古いテーマの固定セレクターではなく、正しい記事本文だけを対象にできる。
- 既存の見出しIDを保持し、同名見出しには安定した一意のアンカーを作る。
h2／h3階層、中国語・日本語見出し、同名見出し、ページ分割記事を扱える。- 狭い画面、キーボード、一般的な支援技術でも理解できる。折りたたみ式ならフォーカスと展開状態も試す。
- JavaScriptがなくても基本アンカーリンクが動き、必要なページだけでフロントエンド資産を読み込む。
- 削除しにくいショートコード、独自ブロック、隠しデータに記事を固定しない。
- キャッシュ、遅延読み込み、圧縮、テーマの固定ヘッダーと合わせて試験できる。
古い方法から移行する
旧ショートコード、ブロック、投稿フィールド、自動挿入位置、独自CSSを一覧化します。新旧の目次が二重表示されないよう、旧自動挿入を止めます。長文、短文、見出しのない記事、翻訳記事を抽出して確認します。停止または削除後も本文と既存アンカーが完全に残ることを確かめてから、旧設定とスタイルを整理します。安全に戻せないなら、本番はまだ切り替えません。
方法4：独自開発の最低要件
独自のコンテンツ機能は、交換され得るテーマに結び付けず、プラグインまたはサイト専用プラグインに置きます。動的レンダリングなら生成済みの目次HTMLを各記事へ恒久保存せずに済みますが、対象投稿タイプと見出しレベル、既存IDの保持、重複時の接尾辞、編集後のキャッシュ破棄、ページ分割、動的ブロックの扱いを仕様化する必要があります。
WordPressのSecurity APIsガイドと出力エスケープ解説に従い、設定入力を検証・サニタイズし、出力は文脈に合わせてできるだけ遅くエスケープします。単純な正規表現一つで任意のHTMLを書き換えたり、外部リンクから既に使われている見出しIDを試験済み移行なしに変更したりしないでください。ここでは意図的に「コピーするだけ」のPHP断片を載せません。テーマ、ブロック、レンダリング経路が異なり、統合試験のない例は内容を壊す可能性があるためです。
よくある不具合
- 目次が空： 大きな段落ではなく本物の見出しブロックか確認し、本文範囲と対象レベルを調べる。
- 違う位置へ移動： ID重複、大文字小文字、古いキャッシュ、固定ヘッダーによる隠れを確認する。
- エディターでは正常、公開画面では異常： 本番ですべてを一度に止めず、ステージングでテーマ、キャッシュ／圧縮、プラグインの競合を順に切り分ける。
- 翻訳ページの移動先が違う： その言語ページの目次リンクと実在アンカーを対応させ、自動音訳が常に一定だと仮定しない。
- 目次が二つ出る： テーマ、ブロック、プラグインの複数が自動挿入していないか確認する。
公開前チェック
- デスクトップと狭い画面で全項目をクリックし、フラグメント識別子付きURLを少なくとも一つ直接開く。
- キーボードだけで目次を操作する。折りたたみ式なら操作名、フォーカス、状態も確認する。
- 同名見出し、非ラテン文字の見出し、見出しなし、ページ分割、入れ子ブロックを網羅する。
- 見出しを一つ変更し、目次、キャッシュ、既存の外部アンカーが想定どおりか確かめる。
- 自動目次を停止しても本文が読めることを確認し、復旧手順を記録する。
- 「移動しやすい」をSEO、アクセス、収益の保証に言い換えない。
確認範囲と不確実性
2026-09-01に、WordPress.orgの文書、開発者資料、公式プラグインディレクトリ、公式プラグインAPIを確認しました。完全な名称「jQuery Table of Contents」は、そのAPI検索結果に現れませんでした。ここから言えるのは「現在、その名称の公式掲載を確認できない」という限定的な結論だけで、歴史的パッケージの出所や最終的な行方は確定できません。実験的なコアブロックや第三者プラグインの状態も、この確認後に変わり得ます。導入前に実際のサイトで再確認してください。