【WordPress】コピペで使える条件分岐付きページナビ「次のページ・前のページ」
広告
SEO的には「ページナビゲーション」は
[ 1 ][ 2 ][ 3 ][ 4 ]…[100]
|
みたいな感じの数字の表示が好ましい(ユーザーの操作回数も軽減できる)と聞いてたのでPCテーマのほうは数字で表示させているのですが、どうも同じやり方だとモバイルテーマでの収まりが悪いというか操作し難いというか、とにかく色々やりにくく感じたので、最終的には
[ 次のページ ] [ 前のページ ]
|
というスタンダードな表示で落ち着きました(妥協とも言うけど)
で、その時に使ったコードです。
ページ送り用(TOPページやカテゴページなど)
<div class="page-navi"> <?php global $paged; $max_page = $wp_query->max_num_pages; if($paged > 1){ /* 次のページがあるよ */ ?> <?php previous_posts_link('<span class="to-previous-page">次のページ</span>'); ?> <?php }else{ /* 次のページがない */ ?> <?php } ?> <?php if($paged < $max_page){ /* 前のページがある */ ?> <?php next_posts_link('<span class="to-next-page">前のページ</span>'); ?> <?php }else{ /* 前のページがない */ ?> <?php } ?> </div>
記事送り用
<div class="page-navi"> <?php $prev_post = get_previous_post(); $next_post = get_next_post(); ?> <?php if( $prev_post) : ?> <?php previous_post_link('%link','<span class="to-previous-page-single">前の記事</span>'); ?> <?php else : ?> <?php endif; ?> <?php if( $next_post ) : ?> <?php next_post_link('%link','<span class="to-next-page-single">次の記事</span>'); ?> <?php else : ?> <?php endif; ?> </div>
上記コードを表示したい場所にコピペすると基本的にはOKで、見栄えは各classにCSSで指定して適当に中央揃えしたり文字色変えたりお好みでどうぞ。
ちなみにページ送り用のほうにはコメントを入れてます、もし先頭ページで処理が必要な場合などはコメント部分(else)に処理を差し込むといけると思います。