PR

Cocoonの目次が表示されない原因は?解決のための5つのチェックリスト

Cocoonの目次が表示されない時の全体像と準備

Cocoonを使っていて、設定したはずの目次が表示されないと焦りますよね。実は、Cocoonには標準で目次機能が備わっており、プラグインなしで簡単に表示可能です。この記事を読めば、目次が表示されない原因を5つのチェックリストに沿って特定し、スムーズに解決できるようになります。

Cocoonの目次が表示されない時の全体像と準備

Cocoonは非常に多機能なテーマであり、本来なら「Table of Contents Plus」などの外部プラグインを導入せずとも、読みやすい目次を自動で生成できます。表示されない原因の多くは、単純な設定ミスや記事内の見出し構成にあります。

まずは原因を特定するために、WordPressの管理画面から「Cocoon設定」メニューを開く準備をしましょう。ここがすべての目次設定を司るコントロールタワーとなっており、まずは現状の設定内容を正しく把握することが解決への最短ルートです。

ポイント:外部プラグインは不要!標準機能だけで完結します

設定を確認する基本のステップは以下の通りです。まずはこの画面にアクセスできているかを確認してください。

1
WordPress管理画面の左メニューから「Cocoon設定」をクリックする
2
並んでいるタブの中から「目次」と書かれた項目を探して開く

プラグインを増やさずにテーマ標準の機能を使うことは、サイトの読み込み速度を維持するためにも非常に有効です。焦らずに、まずは土台となる設定画面から順番に見直していきましょう。

💡 まずは管理画面の「Cocoon設定」→「目次」タブを開き、設定の準備を整えましょう。

1. Cocoon設定の「目次タブ」が有効になっているか

Cocoonで目次が表示されない際、最初に見直すべきはテーマ全体の基本設定です。
目次機能そのものがオフになっていると、どんなに記事を丁寧に書いても見出しは生成されません。

ポイント:全体設定が個別の記事設定より優先される

まずはWordPressの管理画面から、以下の手順で設定状態を正しく確認しましょう。

1
ダッシュボード左メニューから「Cocoon設定」を選択し、さらに「Cocoon設定」をクリックする
2
上部に並ぶ設定タブの中から「目次」タブを探してクリックする
3
「目次を表示する」の項目にチェックが入っているかを確認し、入っていなければチェックを入れる

最後に、ページ最下部にある「変更をまとめて保存」ボタンを必ず押してください。
設定を保存しないと反映されないため、この操作まで確実に完了させることが重要です。

💡 設定を変更した後は、必ず実際の投稿ページを開いて目次が出現したか確認しましょう。

2. 見出し(H2〜H6)の数が設定値に達しているか

Cocoonの設定画面で目次を有効にしているにもかかわらず表示されない場合、記事内に配置した「見出しの数」が足りていない可能性があります。

Cocoonには、目次を生成するための条件として見出しの個数を判定する機能が備わっています。これは、見出しが極端に少ない短い記事で目次が表示され、かえって読みづらくなるのを防ぐための仕様です。

ポイント:初期値では見出しが2つ以上必要

この判定基準となるのが、Cocoon設定内にある「目次表示の最小見出し数」という項目です。H2〜H6までの見出しの合計が、ここで設定した数値に達していないと目次は自動的に表示されません。

1
WordPress管理画面から「Cocoon設定」を選択し「目次」タブを開きます。
2
「目次表示の最小見出し数」の項目を探し、現在の設定値(初期値は2つ以上)を確認します。
3
記事内の見出しを増やすか、設定値を変更した後に保存ボタンをクリックします。

もし記事に見出しを1つしか使っていない場合、目次表示の最小見出し数を「1」に設定すれば表示されますが、基本的には2つ以上を配置して構成を整えましょう。

💡 記事の構成を再度チェックし、H2見出しを少なくとも2つ以上入れるように意識してみてください。

3. 投稿・固定ページ個別の「非表示設定」を確認する

サイト全体の「Cocoon設定」が完璧であっても、特定の記事だけ目次が表示されないことがあります。
これは、各投稿の編集画面に備わっている個別設定が、サイト全体の共通ルールを上書きしているためです。

執筆中やテンプレートをコピーした際に、意図せず設定を変更してしまっているケースが少なくありません。
まずは対象となる記事の編集画面を開き、画面を最下部までスクロールして詳細設定を確認しましょう。

1
WordPressの投稿、または固定ページの編集画面を下にスクロールします。
2
「Cocoon設定」という項目内にある「目次」タブをクリックして開きます。
3
「目次を表示しない」チェックボックスがオンになっていないかを確認してください。

もしこの項目にチェックが入っていると、テーマ共通設定でどれほど表示を推奨していても目次は生成されません。
Cocoonでは記事ごとの個別設定が優先されるという仕組みを覚えておくことが、トラブル解決の鍵となります。

ポイント:LP(ランディングページ)など、目次をあえて出したくない場合にのみ使用する項目です。

もし誤ってチェックが入っていた場合は、クリックして解除した後に記事を「更新」してください。
これだけで、消えていた目次が瞬時に記事内へ反映されるはずです。

💡 特定の1記事だけ表示されない場合は、まず編集画面の最下部にある「目次を表示しない」設定を疑いましょう。

4. ウィジェットやショートコードの配置ミスはないか

4. ウィジェットやショートコードの配置ミスはないか

全体の表示設定は正しいのに、サイドバーなど特定の場所に目次が出ない場合は、ウィジェットの設定を見直しましょう。
Cocoonには専用の「[C] 目次」ウィジェットが用意されており、配置場所によって表示の有無が決まります。

また、本文中の任意の場所に目次を差し込みたい時に便利なのがショートコード

です。
これを記事内に記述するだけで、通常は最初の見出し前に表示される目次を、好きな位置へと移動させることができます。

ポイント:ショートコードを使うと自動表示の目次は消える
1
「外観」>「ウィジェット」から「[C] 目次」をサイドバー等に配置する

注意点として、ショートコードの綴りが全角になっていたり、カッコが欠けていたりすると正しく機能しません。
サイドバーの目次ウィジェット設定についても、「表示設定」ボタンで特定のページが除外されていないかを確認してください。

💡 記事ごとに目次の位置を細かく変えたい場合は、ショートコードをテンプレート化して活用してみましょう。

5. プラグインの競合やキャッシュの影響を排除する

Cocoonの設定が完璧であるにもかかわらず目次が表示されない場合、外部プラグインの干渉やキャッシュの残存を疑う必要があります。
特に注意したいのが、過去に使用していた目次専用プラグインが有効化されたままになっているケースです。

「Table of Contents Plus」などの目次生成プラグインは、Cocoon独自の目次機能と出力処理が衝突することがあります。
システムがどちらを優先すべきか判断できず、結果として何も表示されない、あるいは二重に表示されるといった不具合を招きます。

ポイント:Cocoonは標準で目次機能を備えているため、他の目次プラグインは削除して問題ありません
1
「Table of Contents Plus」等の目次プラグインを停止し、Cocoon設定の目次を再度保存する

また「WP Fastest Cache」などのキャッシュプラグインを利用している場合、設定変更前の古いページデータがブラウザに表示され続けている可能性があります。
設定をいくら弄っても反映されないときは、サーバー上のキャッシュデータを物理的に削除する作業が不可欠です。

2
WP Fastest Cacheの設定画面から「Delete Cache」ボタンを押し、全データをクリアする

このように不要な外部ツールを整理することで、Cocoonの機能が正しく発揮される環境が整います。
プラグインの整理は、サイト全体の表示速度向上にもつながる重要なステップです。

💡 設定変更後は、ブラウザの「シークレットモード」で確認すると、キャッシュに邪魔されず正確な状態を把握できます。

目次をより魅力的にするCocoonカスタマイズのコツ

目次が表示されるようになったら、次は読者にとっての「読みやすさ」を追求しましょう。
Cocoon設定の「目次」タブでは、表示階層(H3まで、など)を自由に指定することが可能です。

あまりに深い階層まで表示すると目次が長くなり、本文に辿り着く前に読者が離脱してしまう恐れがあります。
一般的には、情報のまとまりが分かりやすいH2とH3までの表示に留めるのが、スマートな構成の秘訣です。

また、目次のタイトル(INDEX)の変更方法も覚えておくと便利です。
標準の「目次」という文字を、英語の「CONTENTS」や親しみやすい「この記事のまとめ」に変えるだけで、サイトの個性を演出できます。

さらに、ユーザーの利便性を高めるデザイン設定として、目次の「表示・非表示」の切り替え機能を活用しましょう。
スマホ閲覧時の画面占有率を考慮して、目次を最初から閉じて表示させる設定にするのも、親切なカスタマイズの一つです。

ポイント:「目次表示の深さ」をH3までに設定し、タイトルをサイトのトーンに合わせることで、読者の利便性が大きく向上します。

💡 目次タイトルを「INDEX」に変更して、少し洗練された雰囲気に整えてみましょう。

まとめ:Cocoonの目次は設定次第でスムーズに表示される

まとめ:Cocoonの目次は設定次第でスムーズに表示される

Cocoonで目次が表示されないトラブルの多くは、設定のわずかな見落としから生じています。
「目次タブ」の基本設定、表示に必要な「見出しの最小数」、記事ごとの「個別設定」といった基本的な項目から、まずは丁寧に見直してみましょう。

さらにウィジェットの配置やショートコードの競合、プラグインやキャッシュの影響まで、5つのポイントを順に確認することで、確実に解決へと近づけます。
目次は読者にとって、記事の全体像を把握するための大切な道標となる要素です。

ポイント:見出しの階層(H2・H3)を正しく使い、読者が一目で内容を理解できる構成を心がけましょう。

読者が読みやすい記事構成を作るためには、目次の表示を確認するだけでなく、見出しそのものの質を高めることも重要です。
適切な位置に目次があることで、ユーザーは迷うことなく目的の情報を探し出せるようになります。

目次の不具合を解消できれば、記事の完成度は一段と高まります。
今回紹介したチェックリストを活用して、常に読者に優しいブログ運営を続けていきましょう。

💡 新しい記事を公開する際は、必ずスマホのプレビュー画面で目次が正しく表示されているかチェックしましょう。