WordPressの無料テーマ「Cocoon」には目次機能が搭載されています。
シンプルで使いやすいため、わざわざ別途プラグインを使わなくてもこれで十分という人も多いのではないかと思いますが、
（私も目次を使う場合は常にCocoonの目次機能を使っています。）
実は特定の使い方をしていると目次が表示されない場合があります。
今回はその理由と、解消法について解説していきます。
その前に…
さすがに単純な設定ミス、ということはないでしょうかね？
この記事では、「Cocoon設定」の目次タブの各項目が正しく設定されていることを前提に解説していきます。
Cocoonの目次は「見出し2 （H2）」がないと表示されない
Cocoonの目次は、「見出し2 （H2）」の直前の位置に表示される仕様です。
そのため、なんらかの理由で記事内に「見出し2」がひとつもない場合は、目次は表示されません。
設定ミスでないとすると、このケースではないかと思います。
最近散見されるのですが、
「見出し2」の見た目（装飾・文字サイズ）が気に入らないなどの理由で、見出し2を飛ばして3や4だけを使用して記事を書く人がいます。
意識しないうちにこのケースに該当している人もいるのではないでしょうか。
解消方法：ショートコードを使って目次の表示位置を指定する
WordPressでは、ショートコードを使って目次の表示位置を指定することができます。
Cocoonの目次は「見出し2の直前に目次を表示する」という仕様があるため、見出し2がないことには表示できませんが、
ショートコードによってこちらから表示位置を指定すれば、見出し2がなくても目次を表示できます。
手順は以下のとおり。
・文中の任意の場所に、「ショートコード」のブロックを設置
・ブロック内に以下のコードを貼り付け
[toc]
これでショートコードを貼り付けた場所に目次が表示されます。
本来の意味からすると、コードを使って見出しのデザインを変更するほうがよい
WordPressの仕様上、
見出し2～見出し6の設定が、ただのデザイン上の選択のようになってしまっている部分があるのですが…。
本来的には文章構成の階層を表している設定ですので、見出し2をすっ飛ばして3や4を使用しているのは正しい使い方ではありません。
本件（目次が表示されない）のように、思わぬところで不具合を生じさせる要因にもなりますので、本来は、コードを使ってデザインのほうを変えてしまうのが正しいやり方だというのはご承知おきください。
とはいえ私も、デザインで見出しを選ぶのとか
めっちゃやってますけどねー。。。
コメント