【WordPress】ページネーション 実装のハマりポイント【pageとpaged】

PROGRAMMING WordPress
【WordPress】ページネーション 実装のハマりポイント【pageとpaged】

こんにちは、つるみなおや（@tsuruchan_web）です。

WordPressでページネーション 機能を実装した際にとても苦しんだことの備忘録です。

この記事は以下の設定でサイトを作成している方におすすめです。

  • フロントページ用の固定ページを作成している。
  • その固定ページをホームページとして設定している。
  • その固定ページのコードをfront-page.phpファイルに記述している。

画像だと以下のような状態です。

WordPress > 固定ページ （今回は「トップページ」というタイトルにしています。）
WordPress > 設定 > 表示設定

なぜ苦しんだのか？

front-page.phpのような固定ページと、archive.phpのような一覧表示ページでは、ページネーション 実装のやり方がちがったからです。

具体的にはページ送り番号を取得できる関数get query var()に渡す引数がちがいます。

また、front-page.phpではサブループを作って記事を取得するのでWP_Queryを使いますが、一覧表示ページではメインループを使うのでWP_Queryは必要なかった、というところもゴチャゴチャしていてWordPress勉強し始めの僕にとっては絶好のハマりポイントでした。（あくまで僕の場合です。一覧表示ページでサブループを作る場合はWP_Queryが必要です。）

ページネーション のコード紹介

一覧表示ページ（メインループ使用）

$paged = (get_query_var('paged')) ? get_query_var('paged') : 1;
while (have_posts()):
the_post();
〜記事一覧表示〜
endwhile;

// 以下ページネーション 
$args = array(
    'current' => max(1, $paged),
    'end_size' => 1,
    'mid_size' => 1,
    'type' => 'list',
    );
paginate_links($args);

（参考）一覧表示ページ（サブループ使用）

$paged = (get_query_var('paged')) ? get_query_var('paged') : 1;
$args = array(
    'order' => 'DESC',
    'orderby' => 'date',
    'paged' => $paged, // サブループなので設定
    'posts_per_page' => 10, // サブループなので設定
);
$query = new WP_Query($args);
if ($query->have_posts()): while ($query->have_posts()): $query->the_post();
〜記事一覧表示〜
endwhile; endif; wp_reset_postdata();

// 以下ページネーション 
$args = array(
    'current' => max(1, $paged),
    'end_size' => 1,
    'mid_size' => 1,
    'total' => $query->max_num_pages, // サブループなので設定
    'type' => 'list',
);
paginate_links($args)

front-page.phpのような固定ページ（サブループ使用）

$paged = (get_query_var('page')) ? get_query_var('page') : 1;
$args = array(
    'order' => 'DESC',
    'orderby' => 'date',
    'paged' => $paged, // サブループなので設定
    'posts_per_page' => 10, // サブループなので設定
);
$query = new WP_Query($args);
if ($query->have_posts()): while ($query->have_posts()): $query->the_post();
〜記事一覧表示〜
endwhile; endif; wp_reset_postdata();

// 以下ページネーション 
$args = array(
    'current' => max(1, $paged),
    'end_size' => 1,
    'mid_size' => 1,
    'total' => $query->max_num_pages, // サブループなので設定
    'type' => 'list',
);
paginate_links($args)

ハマりポイント

すべて1行目に注目です。

一覧表示ページではget_query_var(‘paged’)、固定ページではget_query_var(‘page’)となります。

‘page’と’paged’、たった1文字の違いですが、とんでもなくハマりポイントです。

WordPress Codex 日本語版にもとてもサラッと記載があります。

また、記事の表示件数といったサブループならでは引数の設定もあり、メインループとサブループの違いも理解していないとさらにハマります。（僕です。）

ちなみにメインループの場合は、記事の表示件数は管理画面で設定します。

WordPress > 設定 > 表示設定

1ページに表示する最大投稿数という項目です。

ページネーション は必須機能だと思うので、実装する際は今回のハマりポイントに注意してみてください。

以上です。参考になれば幸いです。

＼シェアしてね！／

関連記事