php文章上下篇,emlog阅读页添加同分类上下篇文章翻页效果-CSDN博客

前言：

因为趣乐分享网用的是FLY模板的缘故，模板并没有上下篇文章翻页功能，这个对用户体验不怎么好，就寻思着自己动手添加这个功能！由于自己对网页前端也不怎么熟悉，所以就去网上搜了下相关教程！全部试了个遍没有一个满意的。不是不显示就是错位，要么样式难看！最后无意中看到有个网站有自己满意的样式，准备给他仿下来！效果就跟本站一样！如下图：

好了不说太多废话！咱们直接开始教程：

教程说明：

我们先把样式表需要的CSS代码添加到模板CSS文件里面，FLY模板是style.css ，其他模板应该差不多！自己看看就知道了。

CSS代码：/*上下篇翻页*/

.nav-single {margin-bottom: 21px;}

.nav-single a {display: block;}

.meta-nav {background:#fff;float:left; width:50%; text-align:center; margin-right:-1px; padding:10px 20px; white-space:nowrap; word-wrap:normal; text-overflow:ellipsis; overflow:hidden; border:1px solid #ddd; box-shadow:0 1px 1px rgba(0, 0, 0, 0.04); border-radius:10px; }

.meta-nav:hover { color:#fff; background:#2caffb; }

.meta-nav a{ text-align:center; white-space:nowrap; word-wrap:normal; text-overflow:ellipsis; overflow:hidden; }

.meta-nav a:hover { color:#fff; background:#2caffb; }

.clear { clear: both; display: block; }

.comment_admin{ display:inline-block; padding:0px 5px 0px 5px; background-image:url(../img/ux.png); background-repeat:no-repeat; line-height:20px; background-position:0px -20px; }

.comment_visitor{ display:inline-block; padding:0px 5px 0px 21px; background-image:url(../img/ux.png); background-repeat:no-repeat; line-height:20px; background-position:0px -40px; }

插入位置：

然后我们再去module.php文件添加相应功能代码：

功能代码：<?php

// 上下篇翻页

function nextLog($logid, $sortid, $flag, $pattern=0){$Log_Model = new Log_Model();if($flag == 'prev'){$sql = " AND gid < $logid ORDER BY gid DESC";$word = '上一篇';}else{$sql = " AND gid > $logid ORDER BY gid ASC";$word = '下一篇';}

$log = $Log_Model -> getLogsForHome(" AND sortid = $sortid "."$sql", 1, 1);if($log){foreach($log as $value):echo $word.'
';?><?php echo $value['log_title'];?><?php endforeach;}else{echo $word.'
没有了';}}?>

插入位置如图：

最后一步就是去文章阅读页相应位置插入调用代码，这个位置看个人喜好，我插入的是在版权后面！

调用代码：

如图：

最后就是去后台刷新下网站缓存，去找篇文章刷新下页面看看是不是出来了上下篇翻页按钮！好了，教程到此结束。有问题评论区留言交流！