1. David Wu首页
  2. WordPress
  3. WordPress安装教程

WordPress分页功能-WordPress开发教程

WordPress默认翻页功能很弱,一页页翻,弄到你手麻,所以类似wp-pagenavi翻页插件,几乎是WordPress博客必装的插件,也是普及率很高的一款插件。 虽然网上有如何把wp-pagenavi

WordPress默认翻页功能很弱,一页页翻,弄到你手麻,所以类似wp-pagenavi翻页插件,几乎是WordPress博客必装的插件,也是普及率很高的一款插件。

虽然网上有如何把wp-pagenavi插件集成到WordPress主题的教程,但wp-pagenavi插件函数代码拖沓,只是变相启用插件而已,并没有真正脱离wp-pagenavi插件。

下面有2种方法,都是用一段轻量级的函数来实现分页插件的功能。

方法一(分页显示数量无法自定义)

WordPress 现在已经自己支持 Pagenavi 功能了,首先要在 functions.php 文件中加入以下代码

/*@分页功能*/ 
function native_pagenavi(){ 
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("page","%#%"), 
"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( !emptyempty($wp_query->query_vars["s"]) ) 
$pagination["add_args"] = array("s"=>get_query_var("s")); 
echo paginate_links($pagination); 
}

调用

在需要调用的位置插入以下代码即可实现 Pagenavi 的功能。

<div class="pagenav"><?php native_pagenavi();?></div>

分析

’base’ 参数用来提供创建页面链接的参考链接
’format’ 参数是用来替换成页码
’total’ 参数是设置页面的总数
’current’ 参数用于设置当前的页码,它们都必须是整数。这些参数我们在使用的时候必须提供的。
‘show_all’参数设置为 true 就会显示所有的页面,默认情况它是被设置为 false 的
通过 ‘end_size’ 和 ‘mid_size’ 这两个参数来控制页码显示的规则。’end_size’ 参数是用来控制在开始和结束的两端显示多少个数字,默认是 1 。’mid_size’ 参数是用来显示多少个数字显示在当前页数字的两边,并且不包括当前页。
‘prev_next’ 这个参数是用来设置是否显示上一页和下一页的页码链接,默认是 true,然后我们可以通过 ‘prev_text’ 和 ‘next_text’ 这两个参数来控制上一页和下一页的文本。

更多参考官方 <?php echo paginate_links( $args ) ?>

CSS方案一

.pagenav{ 
clear:both; 
padding-top:9px; 
} 
.pagenav span,.pagenav a{ 
font-size:14px; 
margin: 2px 6px 2px 0; 
background:#fff; 
border:1px solid #e5e5e5; 
color:#787878; 
padding:3px 8px; 
text-decoration:none; 
} 
.pagenav a:hover{ 
background: #8391A7; 
border:1px solid #fff; 
color:#fff; 
} 
.pagenav .current{ 
border:1px solid #8d8d8d; 
color:#393939 
}

CSS方案二

/*@pagenav*/ 
.pagenav{ 
text-align:center; 
padding:1em; 
clear:both; 
} 
.page-numbers{ 
border-bottom:5px solid #ccc; 
padding:5px 8px 4px; 
margin:0 5px; 
} 
.page-numbers:hover,.pagenav .current{ 
color:#000; 
border-bottom:5px solid #000; 
}

方法二(可自定义分页显示数量)

functions.php中加入

function pagination($query_string){ 
global $posts_per_page, $paged; 
$my_query = new WP_Query($query_string ."&posts_per_page=-1"); 
$total_posts = $my_query->post_count; 
if(emptyempty($paged))$paged = 1; 
$prev = $paged - 1; 
$next = $paged + 1; 
$range = 2; // only edit this if you want to show more page-links 
$showitems = ($range * 2)+1;$pages = ceil($total_posts/$posts_per_page); 
if(1 != $pages){ 
echo "<div class="pagination">"; 
echo ($paged > 2 && $paged+$range+1 > $pages && $showitems < $pages)? "<a href="".get_pagenum_link(1)."">最前</a>":""; 
echo ($paged > 1 && $showitems < $pages)? "<a href="".get_pagenum_link($prev)."">上一页</a>":"";for ($i=1; $i <= $pages; $i++){ 
if (1 != $pages &&( !($i >= $paged+$range+1 || $i <= $paged-$range-1) || $pages <= $showitems )){ 
echo ($paged == $i)? "<span class="current">".$i."</span>":"<a href="".get_pagenum_link($i)."" class="inactive" >".$i."</a>"; 
} 
}echo ($paged < $pages && $showitems < $pages) ? "<a href="".get_pagenum_link($next)."">下一页</a>" :""; 
echo ($paged < $pages-1 && $paged+$range-1 < $pages && $showitems < $pages) ? "<a href="".get_pagenum_link($pages)."">最后</a>":""; 
echo "</div>\\n"; 
} 
}

在需要调用分页的位置用以下代码

<?php pagination($query_string);?>

CSS方案

.pagination{ 
line-height:23px; 
} 
.pagination span, .pagination a{ 
font-size:12px; 
margin: 2px 6px 2px 0; 
background:#fff; 
border:1px solid #e5e5e5; 
color:#787878; 
padding:2px 5px 2px 5px; 
text-decoration:none; 
} 
.pagination a:hover{ 
background: #8391A7; 
border:1px solid #fff; 
color:#fff; 
} 
.pagination .current{ 
background: #fff; 
border:1px solid #8d8d8d; 
color:#393939; 
font-size:12px; 
padding:2px 5px 2px 5px; 
}

根据自己的主题调整CSS即可。

原创文章,作者:DavidWu,如若转载,请注明出处:https://www.davidwu.net/archives/121469

服务项目 服务内容 收费标准(元)
开发定制 WordPress主题/插件开发定制 (以最终需求为准)
主题/插件汉化 汉化团队WordPress主题/插件,翻译率95% (以标的主题/插件的句子数量为准)
服务器环境配置 基于您现有服务器,搭建配置网站运行环境,结合我们多年来实战经验,可完美支持WordPress等PHP程序运行,并配置伪静态规则、优化目录权限等问题。服务器我们强烈推荐使用Linux系统。 100元/次
网站托管 若贵站目前尚无技术人员,无法完成服务器环境配置,可选择我们的网站托管服务,直接交付正常运行的WordPress站点,并且无需担心服务器的后续维护工作,一切都由我们来帮您完成。 标配套餐:1000元/年/站点 高配套餐:联系客服获取
网站加速优化 从服务器后端配置优化到WordPress数据库缓存、前端页面缓存、JS和CSS压缩合并,全方位优化网站加载速度,实现秒开。(此服务仅针对(云)服务器/VPS) 500元/次(仅站内优化200元/次)
主题配置 本站所有主题均支持,可快速实现,若有任何问题可以咨询客服解决,若您希望我们提供配置服务,可选购此服务。 英文主题安装 60元/次 汉化主题安装 30元/次
HTTPS配置 HTTPS已经不断普及,并且有着更高的安全性以及SEO上的优待。该服务收取的为服务费,SSL证书产生的费用请自行承担。 100元/次
网站搬家 迁移网站所有文件和数据库信息、网站相关配置的调整、以及迁移中的疑难问题故障排除。 标准收费:500元/次 若网站数据量大,需协商
网站运维 提供整站的运维服务,保证网站正常运行。包含:网站故障定位及排除、网站数据备份和恢复、网站攻击及木马等问题的处理等 标准收费:2000元/年 IP 5000以上需协商

发表评论

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