【WordPress】WP_Queryでページャー(ページ送り)を実装する方法

こんにちは、ryohei(@ityryohei)です!

WP_Queryでquery_postsの同じようにページャーまたはページネーションを実装しようとすると、うまく表示されないケースがあります。query_postsと同様のコードでは必要な値が取得できないようなので、ページャーが表示された際のコードを記載します。

公式の関数リファレンスにも情報がありますので、詳しく知りたい方は以下のリンクからどうぞ!

関数リファレンス/paginate_links

WP_Queryでページャーを実装する

以下のコードを使用するとページャは表示されます。ページャーの出力形式はlistにしています。引数($args)のpost_type、post_per_pageやソート方法はご自身の環境のものに変更してお使いください!

<?php
  $paged = get_query_var('paged') ? get_query_var('paged') : 1;
  $args = array(
    'post_type' => array('post'),
    'post_status' => array('publish'),
    'order'=>'desc',
    'orderby'=>'post_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();

  $big = 999999999;

  echo paginate_links(array(
    'base' => str_replace($big, '%#%', esc_url(get_pagenum_link($big))),
    'show_all' => true,
    'type' => 'list',
    'format' => '?paged=%#%',
    'current' => max(1, get_query_var('paged')),
    'total' => $query->max_num_pages,
    'prev_text' => '前へ',
    'next_text' => '次へ',
  ));
?>

以上、WP_Queryでページャー(ページ送り)を実装する方法のご紹介でした!

Adobe Creative Cloudを通常価格で購入していませんか?

Adobe Creative Cloud(Adobe CC)はAdobe社が提供するクリエイター向けのサービスです。WEB制作の幅を広げる「Photoshop・Illustrator・XD」Youtuberや動画クリエイターの編集作業に欠かせない「Premiere Pro・After Effects」など全20以上のアプリが提供されており、幅広いプランが用意されています。

コンプリートプランはAdobe CCの全20以上のアプリが使用できるプランです。多くのアプリが使用できるため定価で購入すると年間7万円以上するプランですが、デジタルハリウッドのAdobeマスター講座では「基礎動画教材+Adobe CC コンプリートプラン(12ヵ月)」がセットになって39,980円(税込)で利用できます。定価より安価にAdobe Creative Cloudのライセンスを購入でき、以降のライセンス更新も可能。動画教材で基礎スキルを習得できるので、入門する方にも便利な講座です。詳しくは下記のリンクからチェックしてみてくださいね。

Adobeマスター講座はこちら

おすすめの書籍