高级群:117942452 逐浪CMS技术交流①群 开放群:62769555 逐浪CMS开发总群
​ZoomlaCMS3.0时尚流行的分页导航标签制作方法
返回逐浪CMS技术讨论区
3回复贴,共1页,点击数:916

实现效果可参照zoomla开发者社区的帖子分页效果。这里我贴上我的实现效果

这种分页导航的效果特别流行,尤其是在 资讯类、博客类(wordpress为典型)的网站使用最多。

zoomlaCMS官方很贴心的为我们在CMS里集成了这一功能模块。


实现关键:

1、html标签

近来的前端html开发我都在使用zoomlaCMS官方推荐的Bootstrap框架,它的好处就在于“我不用太过于关注如此复杂的分页导航代码是如何实现的”

官方文档直接复制过来就Ok了(正在学习中的朋友们请忘记我刚才说的话)

4.jpg


2、分页逻辑实现

 进入zoomla后台:系统->标签管理,添加“分页标签”,就能看到下边的界面

5.jpg


先上代码吧:

<ul class="pagination pagination-lg">
        <li><a href="{prvurl/}" aria-label="Previous"><span aria-hidden="true"><</span></a></li>  <!--上一页-->
        {loop range=\'2\'}//显示半径
       <li><a href="{pageurl/}">{pageid/}</a></li> <!--循环代码-->
       $$$
      <li class="active"><a href="#">{currentpage/}</a></li>  <!--当前代码-->
     {/loop}          
     <li><a href="{nexturl/}" aria-label="Next"><span aria-hidden="true">></span></a></li> <!--下一页-->
</ul>

实现这样的一个分页导航效果,在这里用到了几个关键标签

【上一页地址】【下一页地址】【分页循环】【循环内页码】【循环内路径】

-------------------------------

逐一解释一下:

a、上一页地址,下一页地址 字面意思即可理解

b、【分页循环】点击一下就会发现,这可以理解为一个固定的公式,也是实现本文说的分页效果的关键

{loop range=\'显示半径\'}循环代码$$$当前代码{/loop}

显示半径:(个人理解为:在“页码1”到“...”之间显示几个页码)

循环代码:(个人理解为:循环显示除当前页外的页码)

当前代码:那就是当前页码了。

c、循环内页码:{pageid/}

d、循环内路径:{pageurl/}


---------========================-----------------

OK,马马虎虎就写到这里,不知道大家能否看得懂,如有问题,楼下回复!

1楼 2015年12月20日 21:25

此帖绝对高大上,

对逐浪的内核研发非常清楚到位

表示非常高大上!

学习!


建议官方加精!

2楼 2015年12月20日 21:28 收起回复

强大,这些分页在不同场合使用。

同时,官方在下一版会校正新分页样式。

感谢楼主!

3楼 2015年12月20日 21:32 收起回复

很棒的分页效果,

4楼 2015年12月23日 21:58 收起回复
3回复贴,共1
您未登录,没有发贴权限[点此登录]