PHP
php
<?php function pager($c, $t) { $current_page = $c; //現在のページ $total_rec = $t; //総レコード数 $page_rec = 10; //1ページに表示するレコード $total_page = ceil($total_rec / $page_rec); //総ページ数 $show_nav = 5; //表示するナビゲーションの数 $path = '?page='; //パーマリンク //全てのページ数が表示するページ数より小さい場合、総ページを表示する数にする if ($total_page < $show_nav) { $show_nav = $total_page; } //トータルページ数が2以下か、現在のページが総ページより大きい場合表示しない if ($total_page <= 1 || $total_page < $current_page ) return; //総ページの半分 $show_navh = floor($show_nav / 2); //現在のページをナビゲーションの中心にする $loop_start = $current_page - $show_navh; $loop_end = $current_page + $show_navh; //現在のページが両端だったら端にくるようにする if ($loop_start <= 0) { $loop_start = 1; $loop_end = $show_nav; } if ($loop_end > $total_page) { $loop_start = $total_page - $show_nav +1; $loop_end = $total_page; } ?> <div id="pagenation"> <ul> <?php //2ページ移行だったら「一番前へ」を表示 if ( $current_page > 2) echo '<li class="prev"><a href="'. $path .'1">«</a></li>'; //最初のページ以外だったら「前へ」を表示 if ( $current_page > 1) echo '<li class="prev"><a href="'. $path . ($current_page-1).'">‹</a></li>'; for ($i=$loop_start; $i<=$loop_end; $i++) { if ($i > 0 && $total_page >= $i) { if($i == $current_page) echo '<li class="active">'; else echo '<li>'; echo '<a href="'. $path . $i.'">'.$i.'</a>'; echo '</li>'; } } //最後のページ以外だったら「次へ」を表示 if ( $current_page < $total_page) echo '<li class="next"><a href="'. $path . ($current_page+1).'">›</a></li>'; //最後から2ページ前だったら「一番最後へ」を表示 if ( $current_page < $total_page - 1) echo '<li class="next"><a href="'. $path . $total_page.'">»</a></li>'; ?> </ul> </div> <?php } ?>
パーマリンクは8行目の「$path 」です。
パラメータタイプになっているので、最近のWebではあれだよねと思った方は変更してください。
31行目移行が出力しているところです。
なんでリストでマークアップしてんだよ!と思った方は変更してください。
使うときはこうです。
php
//現在のページ, 総レコード数 pager(1, 120);
現在のページ、総レコード数の順で引数を入れます。
CSS
ついでにCSSです。
css
div#pagenation { position: relative; overflow: hidden; } div#pagenation ul { position:relative; left:50%; float:left; list-style: none; } div#pagenation li { position:relative; left:-50%; float:left; } div#pagenation li a { border:1px solid #CECECE; margin: 0 3px; padding:3px 7px; display: block; text-decoration:none; color: #666666; background: #fff; } div#pagenation li.active a, div#pagenation li a:hover{ border:solid 1px #666666; color: #FFFFFF; background: #3399FF; }