浏览中非常基础且重要的用户体验优化,它能帮助用户在浏览完当前文章后,无缝地继续阅读相关内容,从而降低网站的跳出率,增加用户停留时间。
在织梦CMS中,实现这个功能非常简单,主要通过调用系统内置的 GetPreNext() 函数来完成。
核心函数:GetPreNext()
这个函数是织梦专门为文章内容页设计的,用于获取当前文章的上一篇和下一篇的链接。
函数原型与参数
GetPreNext($typeid, $titlelen, $type)
$typeid(整数): 文章所在的栏目ID,这个参数非常重要,它决定了“上一篇/下一篇”的查找范围,通常情况下,我们希望是在同一个栏目内查找,所以这里应该传入当前文章的栏目ID。$titlelen(整数): 标题显示的长度,如果上一篇或下一篇的标题过长,可以用这个参数来截断,以避免页面布局错乱,单位是“字节”,如果设置为0,则不截断。$type(字符串): 的类型,这是一个可选参数,可以控制输出的格式。- 默认值: (空字符串),此时函数会返回一个包含完整HTML链接的字符串,
<a href='...'>上一篇标题</a> | <a href='...'>下一篇标题</a>。 'pre':只返回上一篇的链接信息。'next':只返回下一篇的链接信息。
- 默认值: (空字符串),此时函数会返回一个包含完整HTML链接的字符串,
返回值
函数返回一个字符串,当 $type 为默认值时,返回格式通常是:
<a href='上一篇的URL'>上一篇的标题</a> | <a href='下一篇的URL'>下一篇的标题</a>
如果当前文章是所在栏目的第一篇,上一篇”的部分会显示为“没有了”,如果是最后一篇,则“下一篇”部分会显示为“没有了”。
页模板中的使用方法
这是最常见的应用场景,你需要修改织梦的文章内容页模板,通常是 /templets/default/article_article.htm 文件。
操作步骤:
- 登录织梦后台 -> 模板 -> 模板管理。
- 找到你当前使用的模板,点击“默认模板”或“修改”。
- 在文件列表中找到并打开
article_article.htm文件。 - 在你希望显示“上一篇/下一篇”的位置(通常在文章内容的下方或侧边),添加以下代码。
示例1:最简单的用法(直接输出)
在 article_article.htm 的合适位置(<div class="article-content">...</div> 下面)加入:
<div class="prenext">
{dede:getprev name='pre'/}
{dede:getnext name='next'/}
</div>
或者,更推荐直接使用 GetPreNext() 函数:
<div class="prenext">
<strong>上一篇:</strong>{dede:field name='pre'/}<br />
<strong>下一篇:</strong>{dede:field name='next'/}
</div>
注意:在织梦的模板语法中,
{dede:field name='pre'}和{dede:field name='next'}是GetPreNext()函数的简写形式,它们会自动获取当前文章的ID和栏目ID,并进行处理,这是最常用、最简洁的方式。
示例2:使用 GetPreNext() 函数(更灵活)
如果你想要更精细地控制样式,或者需要传入自定义参数,可以直接使用PHP代码,织梦模板支持在特定标签内写PHP。
<div class="prenext">
<p>
<strong>上一篇:</strong>
<?php
$pre = GetPreNext($typeid, 30, 'pre'); // 获取上一篇,标题截取30字节
echo $pre;
?>
</p>
<p>
<strong>下一篇:</strong>
<?php
$next = GetPreNext($typeid, 30, 'next'); // 获取下一篇,标题截取30字节
echo $next;
?>
</p>
</div>
$typeid:这里可以直接使用织梦模板变量{dede:field.typeid/}来获取当前文章的栏目ID。30最多显示30个字节,如果超长会被截断并加上省略号。'pre'和'next':分别只获取上一篇和下一篇。
示例3:结合CSS美化样式
为了让“上一篇/下一篇”看起来更美观,你可以添加一些CSS样式。
在模板文件的 <head> 部分或外部的CSS文件中添加:
.prenext {
margin: 20px 0;
padding: 15px;
border-top: 1px dashed #ccc;
border-bottom: 1px dashed #ccc;
font-size: 14px;
color: #666;
}
.prenext a {
color: #0066cc;
text-decoration: none;
}
.prenext a:hover {
color: #ff6600;
text-decoration: underline;
}
然后HTML结构可以这样写:
<div class="prenext">
<p>
<strong>上一篇:</strong>
{dede:field.pre/}
</p>
<p>
<strong>下一篇:</strong>
{dede:field.next/}
</p>
</div>
最终效果会是一个带有分割线,链接颜色和悬停效果都已设置好的区域。
跨栏目调用“下一篇”
我们可能希望用户在读完当前文章后,能跳转到网站中最新发布的文章,而不是局限于当前栏目,这时,就需要修改默认的调用逻辑。
默认的 {dede:field.next/} 是基于 arc.archives.class.php 文件中的 GetPreNext() 函数实现的,它会查询 #@__arctiny 表,按 id 递减查找。
方法:修改核心文件(风险:升级会失效)
- 打开
/include/arc.archives.class.php文件。 - 找到
GetPreNext()函数(大约在640行左右)。 - 修改SQL查询语句,原SQL可能类似这样:
$query = "SELECT id,title FROM `#@__arctiny` WHERE (id < $aid) AND (typeid = $typeid) ORDER BY id DESC LIMIT 0, 1";要实现跨栏目调用,只需去掉
typeid = $typeid这个条件,或者替换为其他条件,例如只查找最近发布的N篇文章。// 修改后的示例:查找全站ID比当前文章小的一篇文章(即全站下一篇) $query = "SELECT id,title FROM `#@__arctiny` WHERE (id < $aid) ORDER BY id DESC LIMIT 0, 1";警告:直接修改核心文件不是一个好习惯,因为当你升级织梦CMS时,这些修改会被覆盖,如果网站非常重要,建议通过二次开发或覆盖类文件的方式来实现,但这超出了基础教程的范围。
总结与最佳实践
| 需求场景 | 推荐代码 | 说明 |
|---|---|---|
| 常规用法(同栏目) | {dede:field.pre/} 和 {dede:field.next/} |
最常用,简洁高效,能满足90%的需求。 |
| 长度 | <?php echo GetPreNext($typeid, 30, 'pre'); ?> |
需要精确控制标题显示长度时使用。 |
| 分别获取上一篇/下一篇 | {dede:field name='pre/'} 和 {dede:field name='next/} |
语法清晰,易于理解。 |
| 自定义样式和结构 | 结合HTML和CSS,使用{dede:field.pre/} |
灵活性最高,可以构建任何样式的“上一篇/下一篇”区域。 |
| 跨栏目调用 | 修改 arc.archives.class.php |
不推荐,升级会丢失,优先考虑使用其他方案,如“相关文章”。 |
对于绝大多数网站,使用 {dede:field.pre/} 和 {dede:field.next/} 就完全足够了,配合适当的CSS样式,就能打造出既美观又实用的文章导航。
