wordpressでページ送りを設置し、中央揃えで配置する
Date 2016.03.24 Category blog
wordpressでページ送りをセンター揃えで配置したい時のメモ書き。
テンプレート側一覧ページ（archive.php、category.php等）
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 |
<!-- ページ送り --> <div class="pagenate font"> <div class="pagebox"> <?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> </div> |
cssの記述
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 |
.pagenate { clear:both; max-width:1030px; margin:0 auto 50px; width:100%; text-align:center; padding:20px 0 0; } .pagenate .page-numbers { display: block; float: left; line-height: 35px; height: 35px; width: 35px; text-align: center; margin: 0 2px; background: #00a0e9; color: #fff; } .pagenate .current { display: block; float: left; line-height: 35px; height: 35px; width: 35px; text-align: center; margin: 0 2px; background: #ccc !important; color: #fff; } .pagenate { position: relative; overflow: hidden; } .pagenate .pagebox { position: relative; left: 50%; float: left; } .pagenate .pagebox .page-numbers { position: relative; left: -50%; float: left; } |
