Category: WordPress

12月 20 2011

WordPressでページナビゲーション表示(メモ)

ページナビゲーションをプラグイン無しで表示する方法、メモ。
まずはfunction.phpに以下のコードを追加します。

function page_navigation() {
global $wp_rewrite;
global $wp_query;
global $paged;
$paginate_base = get_pagenum_link(1);
if(($wp_query->max_num_pages) > 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 .= '%_%';
}
$result = paginate_links( array(
'base' => $paginate_base,
'format' => $paginate_format,
'total' => $wp_query->max_num_pages,
'mid_size' => 3,
'current' => ($paged ? $paged : 1),
));
echo '<p class="local-navigation">'."n".$result."</p>n";
endif;
}

次は、表示させたい場所(index.php/archive.php/category.php)に下記のコードを挿入。
他にもpage.php/search.php/single.phpにも挿入?

<?php page_navigation(); ?>

最後にCSSでデザインを調整します。

.local-navigation {
color: #000000;
margin: 1em auto;
line-height:2em;
text-align:center;
}

a.page-numbers, .local-navigation .current {
color: #6959CD;
padding: 2px .4em;
border:solid 1px #ccc;
text-decoration:none;
font-size:smaller;
}

a.page-numbers:hover {
color:white;
background: #9370DB;
}

.local-navigation .current {
color: white;
background: #4F4F4F;
border-color: #4F4F4F;
font-weight:bold:
}

はい、これで表示できました。

参考記事
[WordPress]プラグインを使わずにページナビゲーションを表示

 

Alibi3col theme by Themocracy