プラグイン不要のページャー作成
2020-04-23
記事一覧ページにて、件数が増えてきたら、ページャーを検討される方もいるかと思いますが、今回は、プラグインを使わずに、設置する方法を記述します。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 |
<div class="pager"> <?php global $wp_rewrite; $paginate_base = get_pagenum_link(1); if(strpos($paginate_base, '?') || ! $wp_rewrite->using_permalinks()){ $paginate_format = ''; $paginate_base = add_query_arg('paged','%#%'); }else{ $paginate_format = (substr($paginate_base,-1,1) == '/' ? '' : '/') . user_trailingslashit('page/%#%/','paged');; $paginate_base .= '%_%'; } echo paginate_links(array( 'base' => $paginate_base, 'format' => $paginate_format, 'total' => $wp_query->max_num_pages, 'mid_size' => 4, 'current' => ($paged ? $paged : 1), 'prev_text' => '', 'next_text' => '', )); ?> </div> |
mid_size は、ページャーの表示する数を変更したい場合に数字を変更してください。
prev_text / next_text に’前へ/次へ’などの文字を入れると、そのまま表示されます。
出力されたソースは、下記のようになります。
1 2 3 4 5 |
<div class="pager"> <span aria-current="page" class="page-numbers current">1</span> <a class="page-numbers" href="ページリンク">2</a> <a class="next page-numbers" href="ページリンク"></a> </div> |
上記のソースでは、prev_text / next_text を空欄にしているので、文字は出力されていませんが、代わりに、before擬似要素でデザイン部分を構成します。