静坐不虚兰室趣 清游自带竹林风

wordpress分页导航不用插件

wordpress默认的分页导航,仅有“较早日志”与“最近日志”两个,个人比较喜欢带一行数字的分页导航。分页导航插件很多(如:WP-PageNavi),如不喜欢用插件,实现分页导航的方法就在下面,与需要的你一起分享正在使用的分页导航代码!效果如本站。

一、添加功能代码至 functions.php(的php循环内)

function vt_nav(){

global $wp_query, $wp_rewrite;

$wp_query->query_vars['paged'] > 1 ? $current = $wp_query->query_vars['paged'] : $current = 1;

$pagination = array(

'base' => @add_query_arg('paged','%#%'),
'format' => '',
'total' => $wp_query->max_num_pages,
'current' => $current,
'prev_text' => '« 上一页',
'next_text' => '下一页 »'

);

if( $wp_rewrite->using_permalinks() )

$pagination['base'] = user_trailingslashit( trailingslashit( remove_query_arg('s',get_pagenum_link(1) ) ) . 'page/%#%/', 'paged');

if( !empty($wp_query->query_vars['s']) )

$pagination['add_args'] = array('s'=>get_query_var('s'));

echo '<div><span>'.$pagination[current].' / '.$pagination[total].'</span>'.paginate_links($pagination).'</div>';

}

二、添加美化代码至主题style.css,根据自己的主题自行修改。在使用偶发现一个问题,默认分页导航无法纵向居中,谁有好的解决办法,别忘了分享一下。

.vt_nav{clear:both;margin:5px -2px;overflow:hidden;zoom:1;text-align:center;}
.vt_nav .page-numbers:hover{background:#FF3D86;color:#FFF;-moz-box-shadow:1px 1px 1px #DDD;-webkit-box-shadow:1px 1px 1px #DDD;box-shadow:1px 1px 1px #DDD;}
.vt_nav .page-numbers,
.vt_nav .dots:hover,
.vt_nav .pages:hover{-moz-border-radius:2px;-webkit-border-radius:2px;border-radius:2px;background:#FFF;display:inline-block;float:left;height:18px;margin:2px;min-width:28px;_width:28px;padding:1px;}
.vt_nav .page-numbers:visited{opacity:0.5;}
.vt_nav .current,
.vt_nav .current:hover{background:#7BAFA7;color:#FFF;font-weight:bold;-moz-box-shadow:1px 1px 1px #DDD;-webkit-box-shadow:1px 1px 1px #DDD;box-shadow:1px 1px 1px #DDD;}
.vt_nav .pages,
.vt_nav .pages:hover{color:#CCC;width:120px;}

三、添加调用代码至主题index.php、search.php等需要的地方

<?php if(function_exists('vt_nav')) {vt_nav(); } ?>

到此,效果出来了,又可以删掉一个插件了,折腾暂时结束。

2 thoughts on “wordpress分页导航不用插件

发表评论

电子邮件地址不会被公开。 必填项已用*标注