一、默认的分页样式

typecho 官方文档中对模板中分页的描述就是简单的一行代码:

<?php $this->pageNav(); ?>

这个代码输出后,实际上内容是下面的 html 代码:

<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>

a.jpg

一般来说,借助上面 html 中的 class 来定义 css 即可实现需要的分页样式。

二、 自定义内容输出

typecho 允许通过参数对 pageNav() 进行自定义。

如果要契合 bootstrap4 的分页代码,我使用的是如下的代码:

<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
currentClassactive 的 class,是加在 itemTag 上的
prevClassprev 的 class
nextClassnext 的 class

三、效果

aaa.jpg