スポンサーリンク

ワードプレスのページ分割時に全ページで全目次を表示させる方法

この記事は約3分で読めます。

ワードプレスのCocoonテンプレートの目次は、Table of Contents Plusに準拠した仕様となっており、ページ分割時、ページの内容に対応する目次しか生成されません。(全ページ分の目次は、ページ先頭のみ作成)。ユーザーインターフェース的には、各ページの先頭に全目次があり、全ページに飛べた方が、利便性が高いでしょう。

ページ分割した場合でも、各ページの先頭で全目次を表示させたいニーズが多いと思われ、対応方法を解説します。

スポンサーリンク

ページ分割時、目次も分割される仕様

ページ分割時「<!–nextpage–>タグ利用時」に、目次もページ毎に分割されてしまいます。ページ毎の本文が目次に反映される仕様です。本や小説をイメージすれば、有り得ない目次の作りです。

※表示されない場合は、キャッシュプラグインを削除して下さい。
※「moreタグ」ではありません。

CocoonもTOC+の仕様に準拠

Cocoonも、TOC+(Table of Contents Plus)プラグインに準拠した仕様となっており、この仕様はプラグイン削減のコンセプトとして妥当ですね。将来的には、機能拡張をお願いしたいところです。

  • 1ページ目分のみの目次
  • 本文
  • ページリンク:1 2 3・・・

TOC+の仕様は、Webの仕様に合わない

ページ毎分の目次のみ表示されるTOC+は、紙のインターフェースに劣るものです。
最低限、先頭に全ページ表示させる仕様を実装すべきでしょう。

理想的な目次のイメージとは

小説や本は、先頭に全ページ分の目次があり、本文ページが続きます。まあ当たり前ですね。
この仕様が、本来あるべき全世界共通仕様のインターフェースだと思います。

先頭に戻って目次を調べる、ハイパーリンクの無い本としては、理想的な作りですね。

理想的な目次

  • 全ページの目次
  • 本文
  • ページリンク:1 2 3・・・

ページリンク毎に全ページの目次が表示されるのは、煩いイメージですが、適切にコンテンツに辿り着くユーザーインターフェースからずれば、ページ分割後も全ページの先頭において、全目次があった方が便利性が高いでしょう。

ユーザーインターフェース的に不親切なTOC+

本であれば、先頭ページにだけ目次があれば良いのですが、せっかく便利はWebなのに、2ページ目以降に目次が出ないのは、意味無いです。検索エンジンからは、2ページ目に直接飛んできます。その場合、該当ページを含む全体構成がわからないという状態になってしまうのです。

先頭の目次に飛べばよいという発想は動線的にNG

2ページ目以降、直で飛んできたユーザーに対して、対象ページだけでなく、先頭ページからの全体像を目次で見せる必要があるでしょう。該当ページ分のみの目次では意味が無いのです。

全ページに全ページ分の目次を表示させる方法

現在、これを実現するプラグインはありません。

TOC+や他のプラグインを多数調べましたが、この機能をインストールのみで実現するものは無しでした。(2021/5)

改造する手法で一番わかりやすい方法

  1. Cocoonの目次機能をオフにする。
  2. 複数ページに分割された記事で、全ページ分の目次を表示させる方法
    Percredereさんサイトより「50行」のソースコードをコピー
  3. cocoon-child-master」フォルダ内、「fanction.php」の末尾に、上記のソースをペーストして保管。(FTPでサイトに転送のこと)

プラスの改造点

現状は、目次をフルに表示するロジックなので、とりあえず「H2タグ」のみ表示へ修正。

ソース上の、1-6 ー> 1-2 へ修正(本文上、H1タグは基本、無い想定)

結果のまとめ

目次については、理想通りの動きです。サイドバーのスクロール追従の目次は、ページ分のみ表示ですが、これは良しとしましょう。