Skip to content

Instantly share code, notes, and snippets.

@blockworks
Created August 21, 2011 11:55
Show Gist options
  • Save blockworks/1160516 to your computer and use it in GitHub Desktop.
Save blockworks/1160516 to your computer and use it in GitHub Desktop.
Wordpressのページネーション
///////////////////////////////////////
//functions.phpに以下を記述
///////////////////////////////////////
function pagination($pages = '', $range = 2){
$showitems = ($range * 2)+1;
global $paged;
if(empty($paged)) $paged = 1;
if($pages == ''){
global $wp_query;
$pages = $wp_query->max_num_pages;
if(!$pages){
$pages = 1;
}
}
if(1 != $pages){
echo '<div class="pagination"><ul>';
if($paged > 2 && $paged > $range+1 && $showitems < $pages) echo '<li class="prev"><a href="' .get_pagenum_link(1). '">First</a></li>';
if($paged > 1 && $showitems < $pages) echo '<li><a href="'.get_pagenum_link($paged - 1).'">&larr;</a></li>';
for ($i=1; $i <= $pages; $i++){
if (1 != $pages &&( !($i >= $paged+$range+1 || $i <= $paged-$range-1) || $pages <= $showitems )){
echo ($paged == $i)? '<li class="active"><a href="#">'.$i.'</a></li>':'<li><a href="'.get_pagenum_link($i).'">'.$i.'</a></li>';
}
}
if ($paged < $pages && $showitems < $pages) echo '<li><a href="'.get_pagenum_link($paged + 1).'">&rarr;</a></li>';
if ($paged < $pages-1 && $paged+$range-1 < $pages && $showitems < $pages) echo '<li class="next"><a href="'.get_pagenum_link($pages).'">Last</a></li>';
echo '</ul></div>';
}
}
///////////////////////////////////////
//テーマの表示したい箇所に以下を記述
///////////////////////////////////////
<?php pagination(); ?>
///////////////////////////////////////
//CSSに以下を記述
///////////////////////////////////////
div.pagination {
height: 36px;
margin: 18px 0;
font-size: 1.4em;
}
div.pagination ul {
float: left;
margin: 0;
border: 1px solid rgba(0, 0, 0, 0.15);
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
-webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.075);
-moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.075);
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.075);
}
div.pagination ul li {
display: inline;
}
div.pagination ul li a {
float: left;
padding: 0 14px;
line-height: 34px;
border-right: 1px solid rgba(0, 0, 0, 0.15);
text-decoration: none;
background-color: #fff;
}
div.pagination ul li a:hover, div.pagination ul li.active a {
background-color: #c7eefe;
}
div.pagination ul li.disabled a, div.pagination ul li.disabled a:hover {
background-color: none;
color: #bfbfbf;
}
div.pagination ul li.next a, div.pagination ul li:last-child a {
border: 0;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment