wp-pagenaviをトップページに設置しようとしてハマった件

wp-pagenaviをトップページに設置しようとしてハマった件

プラグイン『WP-PageNavi』はページネーション(ページング)を簡単に設置できるプラグインなんですが、ページネーション(ページング)が表示されない、2ページ目が表示されないってことがちょくちょくあるんですよね。

このブログにもページネーション(ページング)をつけようと思ったら見事にハマったので、解決策を忘れないようにメモ。

トップページをfront-page.phpにしたらうまくいかなかった

名前的に『front-page.php』がトップページでいいでしょ。
なんて軽い気持ちで作成して『WP-PageNavi』を設置したらページネーション(ページング)自体は出るけど2ページ目をクリックしても1ページ目と同じ内容が表示される。

これはトップページが1ページ目だよってのを認識してないのが原因と思われる。
色々調べると『query_posts内で、paged=.$pagedを指定。また、wp_pagenaviよりもあとでwp_reset_query()を指定して、クエリをリセットする必要がある』と出てきます。
さらにフロントページには「paged」ではなく、「page」を使うらしい。リファレンスにもそれらしき記述が。

<?php  $page = get_query_var( 'page', 1 );  ?>
<h1>Currently Browsing Page <?php echo (int) $page; ?> On a static front page</h1>

これ以外にも『function.php』に現在のページ番号を追加する記述をするだの、『pre_get_posts』を使う必要があるだのいろんなことが書かれてます。

結論から言うと自分のやり方が悪いのかどれも解決せず。
なので『front-page.php』でトップページを表示させるのをそもそも辞めることにしました。

固定ページテンプレートならうまくいった

あれこれ悩みましたが、自分の場合は『トップページ』という固定ページを作成。スラッグを『top』に。
WordPressの『設定』からフロントページの表示を作成した固定ページに変更。
『page-top.php』を作成して表示させたらサクッと解決しました。
コードはこちら。

page-top.php
<?php
$paged = get_query_var('page');
$args = array(
	'posts_per_page' => 9,
	'paged' => $paged,
	'post_type' => array(
		'post',
	),
);
$the_query = new WP_Query($args);
?>

<ul class="flex">

<?php if($the_query->have_posts()): ?>
<?php while($the_query->have_posts()) : $the_query->the_post(); ?>
//ループさせたい投稿内容
</li>
<?php endwhile; ?>
<?php else : ?>
		<h1>記事がありません</h1>
		<p>表示する記事はありませんでした。</p>
<?php endif; ?>
</ul>

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

ついでに『category.php』にも『WP-PageNavi』を設置

通常の固定ページと同じ記述だと2ページ目が1ページ目と同じになってしまった。
なのでこちらには別の書き方で『WP-PageNavi』を設置。

category.php
<ul>
<?php if (have_posts()) : while (have_posts()) : the_post(); ?>
//ループさせたい投稿内容

<?php endwhile; endif; ?>
<?php if(function_exists('wp_pagenavi')) { wp_pagenavi(); } ?>
<?php wp_reset_query(); ?>
</ul>

ものすごく簡単ですねw

まとめ

web制作をしているとうまくいかないことはしょっちゅうあります。
その度に色々調べるのですが、結局解決方法はいくつかあるんですよね。
なので一つの方法にこだわりすぎないっていうのがすごく大事だと思います。

今回の例でいうと『front-page.php』でトップページを表示することにこだわった結果、半日経っても何も解決せず。
固定ページに切り替えたら30分もかからず解決。

そんなもんです。

SPONSORED LINK

CONTACT

ご意見やご感想、お仕事のご依頼など
お気軽にご連絡ください。

CONTACT FORM