WordPressや旅・買い物・勝手な情報!
Release: 2018/06/14 Update: 2018/06/19

wp_queryでwp-pagenaviが正常に表示されない問題

トップページや固定ページ等で、投稿一覧を表示する場合、wp_queryを利用して投稿一覧等の表示する方法が一般的なようです。
以前のバージョンでは、query_postsを利用していましたが、メインクエリーを書き換えてしまうようで間違いが起こりやすいからか非推奨になりました。
 
テーマを自作して、トップページに「wp_query」で投稿一覧を表示させ、ページナビゲーションのプラグイン「wp-pagenavi」をインストールして設定したのですが、動作しなくて困った経験を書き留めておきます。
 

スポンサーリンク

wp_queryでの投稿一覧表示

下記は、wp_queryを利用した投稿一覧を表示させる例です。

/* データの表示指定 */
<?php $my_query = new WP_Query(
  array('posts_per_page' => 5,'post_type' => 'post' )
);
?>

/* データの表示 */
<?php if ( $my_query->have_posts() ) : 
  while ( $my_query->have_posts() ) : $my_query->the_post();?>
    <h3><a href="<?php the_permalink() ?>"><?php the_title(); ?></a></h3>
    <p><?php the_excerpt(); ?></p>
<?php endwhile;endif; ?>
<?php wp_reset_postdata(); ?>

投稿タイトルと概要を表示しますが、簡素化していますので実際に利用する場合はサイトに合わせて修正・追加してください。

 
 

ページナビゲーション「wp-pagenavi」を設定する

上記の投稿一覧表示に、「ページナビゲーション」を設置してみました。
 

/* データの表示指定 */
<?php $my_query = new WP_Query(
  array('posts_per_page' => 5,'post_type' => 'post' )
);
?>

/* データの表示 */
<?php if ( $my_query->have_posts() ) : 
  while ( $my_query->have_posts() ) : $my_query->the_post();?>
    <h3><a href="<?php the_permalink() ?>"><?php the_title(); ?></a></h3>
    <p><?php the_excerpt(); ?></p>
<?php endwhile;endif; ?>
<?php if(function_exists('wp_pagenavi')) { wp_pagenavi(); } ?>
<?php wp_reset_postdata(); ?>

 
下図の様にページナビは表示しますが、1、2ページ目とも同じ表示になります。

 
「何故なんだ」とGoogle先生に聞いてみました。

<?php if(function_exists('wp_pagenavi')) { wp_pagenavi(array('query' => $my_query)); } ?>

と変更することで、正しくクエリーを引っ張ってくるようです。

次のサイトを参考にさせていただきました。
WP-PageNaviの2ページ目以降で起こる404エラーの回避方法

 
しかし、まだページ送りがうまくいきません。

 

スポンサーリンク

wp_queryでクエリをページ送りに対応させる

公式ページで調べていたら、見つけました!

$paged = ( get_query_var(‘paged’) ) ? get_query_var(‘paged’) : 1;
$query = new WP_Query( array( ‘paged’ => $paged ) );
静的フロントページに指定したページテンプレートにおいて、クエリをページ送りに対応させるには get_query_var( ‘page’ ); を使ってください。

 
そうか! これを組み込めばいいのか・・・
 
以下のように変更・追加したら問題無く動作するようになりました。


/* データの表示指定 */
<?php $paged = ( get_query_var('paged') ) ? get_query_var('paged') : 1;
  $my_query = new WP_Query(
  array('paged' => $paged,'posts_per_page' => 5,'post_type' => 'post' )
  );
?>

/* データの表示 */
<?php if ( $my_query->have_posts() ) : 
  while ( $my_query->have_posts() ) : $my_query->the_post();?>
    <h3><a href="<?php the_permalink() ?>"><?php the_title(); ?></a></h3>
    <p><?php the_excerpt(); ?></p>
<?php endwhile;endif; ?>
<?php if(function_exists('wp_pagenavi')) { wp_pagenavi(array('query' => $my_query)); } ?>
<?php wp_reset_postdata(); ?>

 

HOME



コメントはお気軽にどうぞ

メールアドレスは公開されません。
また、* が付いている欄は必須項目ですので、必ずご記入をお願いします。

内容に問題なければ、下記の「コメントを送信する」ボタンを押してください。

CAPTCHA