codeigniter 4 分页完全支持自定义样式,无需修改核心代码;可通过配置、预设模板(如bootstrap/tailwind)、自定义模板文件或继承pagerrenderer类实现灵活适配。

CodeIgniter 4 的分页样式默认是基础 HTML 结构,但完全支持自定义——不需要改核心代码,靠配置和模板就能适配 Bootstrap、Tailwind 或自定义 CSS。
直接在控制器里配置分页样式参数
CI4 的 Pager 类允许你在调用 paginate() 后,通过 $pager->setStyle() 或直接设置 display 属性来控制输出结构。更常用的是在视图中用链式方法定制:
- 使用
only()指定显示哪些链接(首页、上一页、页码、下一页、尾页) - 用
setTemplate()加载自定义 HTML 模板字符串或文件 - 通过
setAttributes()给<a></a>或<span></span>添加 class、data-* 等属性
例如,在视图中这样写:
= $pager->setTemplate('bootstrap') ?>
= $pager->links() ?>
CI4 自带 bootstrap, default, bulma, tailwind 等预设模板,放在 app/Views/pager/ 下,可直接复用或复制修改。
用自定义模板文件替换默认结构
把 app/Views/pager/default.php 复制一份,重命名为 my_pager.php,然后按需调整 HTML 和逻辑:
- 用
$pager->hasPrevious()判断是否显示「上一页」 - 用
$pager->getDetails()获取当前页、总页数、起始条目等数据 - 用
$pager->makeLink($page)手动生成某页链接(含 URL 和 active 状态)
常见改法包括:
- 把
<ul></ul>换成<div class="flex gap-1"> 适配 Flex 布局 <li>给当前页 <code><span></span>加class="bg-blue-500 text-white px-3 py-1 rounded" - 把「首页」「尾页」文字换成图标
<i class="icon-home"></i> - 隐藏页码太多时,用省略号:
if ($i === $start - 1) echo '…';
全局统一配置分页行为
在 app/Config/Pager.php 中修改默认设置:
public $templates = [
'default' => 'Pager\DefaultRenderer',
'my_style' => \App\Views\Pager\MyStyleRenderer::class,
];
再新建一个渲染器类,继承 \CodeIgniter\Pager\PagerRenderer,重写 render() 方法,就能彻底接管所有分页 HTML 输出。
避免和前端框架冲突的小技巧
- 不依赖 CI4 默认的
class="page-link",改用你项目里已有的 class 名(如btn btn-sm或px-3 py-1) - 关闭自动包裹:
$pager->setFullTagOpen('')->setFullTagClose(''),自己在外面套容器 - 若用 Vue/React 渲染,只用
$pager->getDetails()提供的数据,前端完全手写分页 UI
基本上就这些。关键不是“怎么改”,而是“在哪改”——模板文件最灵活,配置类最省事,自定义渲染器最彻底。











