你现在的位置:首页 > PHP网站建设知识库 > WordPress > 正文

WordPress中给文章添加“上一篇 下一篇”功能

在浏览别人的网站或博客的时候,经常会看到在文章的上方或文章下方有"上一篇 下一篇"这样的链接。如果你正在使用wordpress,而使用的主题又没有提供这样一个功能,在你看完这篇文章之后,就可以自己手动修改主题,实现这一功能。

需要用到函数
按照惯例,首先介绍一下需要用到的函数,如果你对函数不感兴趣,可以直接跳到下面的实现方法。

wordpress提供了不少函数可以实现这一功能,不过随着版本的升级,有些函数已经不被推荐使用。今天DDBug介绍的是两个最常用的函数previous_post_link和next_post_link:

previous_post_link的功能是显示上一篇文章,原型如下

previous_post_link($format='« %link', $link='%title', $in_same_cat = false, $excluded_categories = '')  
第一个参数$format定义链接的格式或者说显示样式默认为    « %link  ,其中%link的内容在第二个参数中定义

第二个参数$link定义第一个参数中%link的显示内容,默认为%title,即文章标题,你也可以使用其它文字代替。

第三个参数$in_same_cat定义是否只显示同一分类下的文章,默认为否,即显示全部文章。

第四个参数$excluded_categories定义排除的分类ID,即不显示这些分类ID下的文章。

下面例举几个常用实例,来加深对这个函数的理解
代码:

<!--p previous_post_link();-->  
效果:« 上一篇文章标题

代码:

<!--p previous_post_link('上一篇: %link');-->  
效果:上一篇:上一篇文章标题

代码:

<!--p previous_post_link('%link','上一篇');-->  
效果:上一篇
另一个函数next_post_link的作用是显示下一篇文章的链接,原型如下:

next_post_link($format='%link »', $link='%title', $in_same_cat = false, $excluded_categories = '')  
该函数的参数和previous_post_link函数的参数是一样的,请参看上面对previous_post_link参数的说明。结合上面的实例,下面是与其对应的显示下一篇文章链接的参考实例:

代码:

<!--p next_post_link();-->  
效果:下一篇文章标题»

代码:

<!--p next_post_link('下一篇:%link');-->  
效果:下一篇:下一篇文章标题

代码:

<!--p next_post_link('%link','下一篇');-->  
效果:下一篇

如果你想进一步了解previous_post_link和next_post_link,可以参看它们的源代码:wp-includes\link-template.php

实现方法
在你的模板文件夹下找到single.php文件,用文本编辑器打开,先找到Loop循环的位置,一般以下面这段代码开始

<!--p if (have_posts()) :-->  
<!--p while (have_posts()) : the_post();-->  
然后在其后的适当位置(一般在标题上面或者文章结束的下方)中加入如下代码

<div class="nearbypost">    
<div class="alignleft"><!--p previous_post_link('« « %link');--></div>    
<div class="alignright"><!--p next_post_link('%link  » » '); ?></div>    
</div>    
你可以通过CSS定义表现样式,比如我的CSS样式是这样定义的

.alignleft {  
 float:left;  
 text-align:left;  
 margin-right:10px;  
}  
.alignright {  
 float:rightright;  
 text-align:rightright;  
 margin-left:10px;  
}  
这样的效果就是:上一篇的链接对齐到左边,下一篇的链接对齐到右边,效果如下:

« « 上一篇文章标题 下一篇文章标题 » »

高级应用
或许你有这样一个想法:我不想显示文章标题,只显示"上一篇 下一篇",当鼠标经过的时候在提示中显示文章标题.由于函数的源代码中,没有对链接添加"title"属性,所以要想实现这样一个功能,就需要修改源代码:

找到wp-includes目录下的link-template.php文件,并用文本编辑器打开
查找adjacent_post_link的函数定义位置

function adjacent_post_link($format, $link, $in_same_cat = false, $excluded_categories = '', $previous = true) {  
在这个函数的定义体中,你会发现这样一行

$string = '<a href="'.get_permalink($post).'">';</a><a title="'.$title.'" href="'.get_permalink($post).'">';</a>  

把它修改成

$string = '<a title="'.$title.' href="'.get_permalink($post).'">';</a><a title="'.$title.'" href="'.get_permalink($post).'">';</a>   
这样修改以后,再调用previous_post_link和next_post_link函数时,就会在提示中显示文章标题。我们就可以这样调用

<div>    
<div><!--p previous_post_link('«« %link','上一篇');--></div>    
<div><!--p next_post_link('%link  » » ','下一篇');--></div>    
</div>    

这样就达成了我们的目的。