一、默认的分页样式
typecho 官方文档中对模板中分页的描述就是简单的一行代码:
1 |
<?php $this->pageNav(); ?> |
这个代码输出后,实际上内容是下面的 html 代码:
1 2 3 4 5 |
<ol class="page-navigator"> <li class="current"><a href="#####/page/1/">1</a></li> <li><a href="#####/index.php/page/2/">2</a></li> <li><a href="#####/page/3/">3</a></li> </ol> |
一般来说,借助上面 html 中的 class 来定义 css 即可实现需要的分页样式。
二、 自定义内容输出
typecho 允许通过参数对 pageNav()
进行自定义。
如果要契合 bootstrap4
的分页代码,我使用的是如下的代码:
1 2 3 |
<nav aria-label="Page navigation "> <?php $this->pageNav('«', '»', 1, '...', array('wrapTag' => 'ul', 'wrapClass' => 'pagination', 'itemTag' => 'li', 'textTag' => 'a', 'currentClass' => 'active', 'prevClass' => 'prev', 'nextClass' => 'next',)); ?> </nav> |
其中前面四个参数不重复他们的意义,如果要自定义符合框架的样式,那么 html 标签和 class 必然要契合框架的样式。
上面参数中的主要说明:
参数 | 说明 |
---|---|
wrapTag |
最外层的包裹标签 |
wrapClass |
最外层包裹标签的 class |
itemTag |
单独连接的包裹标签 |
textTag |
非连接字符的包裹标签,像是 ... 这种,是没有链接的,但是为了契合bootstrap,我依旧使用 a |
currentClass |
active 的 class,是加在 itemTag 上的 |
prevClass |
prev 的 class |
nextClass |
next 的 class |
三、效果
本文最后更新于2021年4月8日,已超过 1 年没有更新,如果文章内容或图片资源失效,请留言反馈,我们会及时处理,谢谢!