ページナビゲーションのカスタマイズ WordPressカスタマイズ
京都のホームページ制作会社 株式会社ファンフェアファンファーレでは、ページナビゲーションのカスタマイズをはじめ、WordPressで制作されたウェブサイト・ホームページのカスタマイズサービスとして、WordPressテーマ（テンプレート）やプラグインのカスタマイズサービスを提供しております。
このページでは、WordPressのカスタマイズサービスのうち、「WordPressサイトのページナビゲーションのカスタマイズ」について掲載しております。WordPressテーマをカスタマイズすることで、投稿等における配信順の前後ページへリンクである「ページナビゲーション」の表示方法を変更することができます。ページナビゲーションのリンクデザインの変更はもちろん、「投稿全体ではなく同一カテゴリーに絞り込んだページナビゲーション」を自動生成する機能を設置することもできます。
弊社では、WordPressテーマファイルの編集によるWordPressサイトのページナビゲーションのカスタマイズをはじめ、お客さまのニーズに合わせたWordPressのカスタマイズを手がけております。
「WordPressサイトのページナビゲーションの表示の仕方を変更したい」
「全投稿の公開日時順のページ送りだけでなく、同一カテゴリーの公開日時順のページナビゲーションを追加したい」
「ページナビゲーションのデザインを変更したい」
「カテゴリーページやタグページでのページ送りを前後だけでなくページ番号の数字表記でリンク設置したい」
といった場合に、WordPressテーマファイルを編集することで、WordPressサイトのページナビゲーションをカスタマイズさせていただいております。
WordPressのカスタマイズのうち、WordPressサイトの「ページナビゲーション」のカスタマイズについてご紹介します。
WordPressサイトのページナビゲーション
WordPressをベースとしたホームページ（WordPressサイト）には、ページナビゲーション機能がついています。
このページナビゲーションは、WordPressの「投稿」といったコンテンツページなどにおいて、前後ページヘのリンクを設置する機能です。投稿において配信順の前後ページを示したり、分割されたページのページ送りなどで利用されています。
一般的にはページのコンテンツ部分のフッターに設置され、前後の投稿のタイトルにリンクが設定されています。またアーカイブページでは、前後のリストへのリンクが設定されています。
WordPressサイトのカテゴリーページやタグページ、検索結果ページなど、各種アーカイブページでは表示件数の設定に応じてページが分割され、該当ページの数がアーカイブページで表示する1ページあたりの表示件数を超えた場合は、アーカイブページは複数ページに分割されるためページ送りが始まります。
この時、アーカイブページのコンテンツフッターなどに分割されたページへのリンクである「ページナビゲーション」が表示されます。
アーカイブページのページナビゲーションは、基本的に「次のページ」・「前のページ」、「next」・「back」、「次へ」・「前へ」・「＞」・「＜」といった表示がなされ、原則的に前後ページへのリンクのみが表示されます。
前後ページのタイトルとテキストリンク
WordPressサイト ページナビゲーション
投稿ページのコンテンツフッターには、前後ページへのリンクが設定されています。
通常は投稿の公開日に応じた前後ページが反映されています。
（WordPressカスタマイズ済みのため、分類なしの全体的なページナビゲーションと、同一カテゴリの前後ページへのナビゲーションが表示されています）
ページナビゲーションの対応・未対応
しかしながらWordPressテーマによっては、ページナビゲーションに対応していないものもあり、また、通常ページナビゲーションは、投稿の前後ページへのリンクの表示になっていたり、カテゴリーページ・タグページなででも前後ページのみのリンク表示になっています。
テーマによって様々なページナビゲーションのバリエーションがありますが、WordPressをカスタマイズすることで、ページナビゲーションの新規設置、同一カテゴリーに属するページヘのページナビゲーションの設置、リンクパターンのバリエーション化などを行うことができます。
未対応テーマにページナビゲーションを追加
ページナビゲーション機能がついていないWordPressテーマに新規でページナビゲーションを設置させていただくことも可能です。
このページナビゲーションの実装は、WordPressテーマファイルを編集する必要があるため、管理画面の設定などでは行うことはできません。
弊社では、このWordPressサイトのページナビゲーション未対応テーマに、ページナビゲーション機能を追加するカスタマイズも手がけております。
ページナビゲーションのカスタマイズ
WordPressテーマの仕様によって、ページナビゲーションのパターンは様々です。一般的には投稿の最下部にページナビゲーションが設置されています。
基本的には、WordPressの投稿の時系列に応じて前後ページへのリンクが設置されています。
WordPressテーマをカスタマイズすることで、この投稿順の前後ページヘのナビゲーションに加えて、投稿の所属カテゴリーの前後ページなどへのページナビゲーションを追加して設置することも可能です。
また、カテゴリーページやタグページ、検索結果ページといったアーカイブページにおけるページ分割後のページナビゲーションリンクの表示変更（前後ページの表示のみから複数ページの表示へ）もできます。
弊社では、こうしたWordPressサイトのページナビゲーションの各種カスタマイズに対応しております。
該当カテゴリーや該当タグによる投稿のページナビゲーション
該当カテゴリーや該当タグによる投稿のページナビゲーション
WordPressの投稿ページのコンテンツフッターなどに表示されるページナビゲーションを投稿の公開日順ではなく、該当カテゴリーや該当タグといった分類で前後ページへのリンクへと変更するカスタマイズが可能です。
例えば、ページナビゲーションが投稿の公開日順になっていた場合、製品紹介コンテンツと休業日のお知らせなどが混在する形となりますが、このWordPressカスタマイズを実装することで、製品紹介コンテンツのコンテンツフッターのページナビゲーションは、製品紹介コンテンツの前後ページのみが表示される形となります。
こうしたページナビゲーションのカスタマイズによって、コンテンツフッターのリンクが関連性の高いページへのナビゲーションとしての機能をもつようになるため、WordPressサイトを見るユーザーのユーザービリティが向上すると考えることができます。
アーカイブページでのページナビゲーションリンクを複数ページに
ページナビゲーション アーカイブページでの数字リンク
カテゴリーページやタグページ、検索結果ページといったアーカイブページでのページナビゲーションリンクは基本的には前後ページへのページ送りになりますが、ページ番号順に並ぶページナビゲーションへとWordPressテーマをカスタマイズし、複数ページへのリンクへと変更することも可能です。
ナビゲーションデザイン・表記の変更
また、WordPressサイトのナビゲーションデザインにつきましても、前後ページのアンカーテキストの出し方、配色、配置箇所など、あらゆる面でカスタマイズが可能です。
これらページナビゲーションの仕様（機能）、表示デザインは、WordPressテーマファイルによって設定されているため、変更にはWordPressテーマのカスタマイズが必要です。
WordPressサイトのページナビゲーションの追加、ページナビゲーションのカスタマイズをお求めの場合は、ぜひ弊社までお問い合わせください。
ページネーションがホームページ全体に与える影響
システム内部の挙動やSEO、アクセシビリティといった専門的な領域におけるページネーションの役割、より高度な内部構造やデータベースの最適化については、別投稿にて詳しく解説します。
ページネーションが担うSEO内部構造とクロールバジェットの最適化
SEOとサイト構造の最適化
ページネーションはホームページの深さと広がりを制御し、適切な設計によりサイト全体のインデックス率を向上させます。クロールバジェットを意識し、クローラーが下層コンテンツを認識できる静的なリンクの実装はSEO施策として有効です。また、検索結果での重複を避けるため、ページネーションごとにタイトルを動的に変更してユニークに設定する配慮も重要です。
アクセシビリティとモバイル対応
スマートフォンでの閲覧を考慮し、タップエラーを防ぐ適切なターゲットサイズの確保がSEOの評価にもつながります。さらに、スクリーンリーダーを利用するユーザーに向けて、現在のページ位置を正確に伝える意味論的なマークアップを行うことで、ホームページの品質を高めることができます。
WordPressにおける具体的なカスタマイズと運用
ここからは、実際のWordPressテーマ開発や運用において直面する、具体的なカスタマイズ手法やエラー対策について解説します。
the_posts_pagination関数の活用
WordPressで推奨されている関数を利用する際、引数を細かく設定することで高度な制御が可能です。現在地の前後に表示する数字の数や、最初と最後に表示する数字を調整することで、ユーザーが迷子にならないナビゲーションを提供します。前へ・次へといったテキスト部分にアイコンやスクリーンリーダー用のテキストを含めるなど、テーマのデザインに合わせてHTML構造をコントロールすることでデザインと機能を両立させます。
「もっと見る」ボタンとの使い分け
スマートフォンでの閲覧時にタップ数を減らす目的で「もっと見る」ボタンを設置するデザインが増えています。最新のニュースを流し読みする場合には「もっと見る」が適していますが、過去のアーカイブから特定の情報を探す場合には従来のページ番号によるナビゲーションが適しています。事業の目的やユーザーの意図に合わせて、PCとスマートフォンで実装を分けるなどのハイブリッドな対応も選択肢に入ります。
ページネーションの404エラー対策
カスタム投稿タイプなどを利用している際、2ページ目以降をクリックするとエラーになるトラブルがよく発生します。これはURLを解釈するリライトルールと、データの取得件数設定の不整合が原因です。メインクエリが発行される前に条件を統一するフックを利用し、ページネーションの計算が正しく行われるように制御します。
表面上のデザインだけでなく、WordPressの仕組みを深く理解することで堅牢な構築が可能になります。
WordPressサイトの「投稿ページ」・「固定ページ」カスタマイズ
