子比主题美化 – 翻页按钮增加页数跳转教程

在使用子比主题搭建的网站中，文章列表页的默认翻页方式通常仅提供 “上一页”“下一页” 及有限的数字页码按钮。当文章数量较多时，用户若想快速跳转至特定页数会比较麻烦。今天就教大家通过添加一段简单的 JavaScript 代码，在翻页按钮处增加一个 “页数输入框 + 前往按钮” 的组合，让用户可以直接输入页码快速跳转。

效果预览

代码部署

一、功能前提：开启数字翻页模式

在添加代码之前，需先确保子比主题已开启 “数字翻页按钮” 模式，否则代码将无法生效。具体操作步骤如下：

1. 进入 WordPress 后台，点击左侧菜单的 “子比主题设置”。
2. 找到 “文章列表” 选项卡并点击进入。
3. 在列表中找到 “列表翻页模式”，将其选择为 “数字翻页按钮”。
4. 拉到页面底部，点击 “保存设置”。

二、添加自定义 JavaScript 代码

接下来，我们将把准备好的代码添加到子比主题的自定义代码区域。

1. 同样在 WordPress 后台的 “子比主题设置” 中，找到并点击 “自定义代码” 选项卡。
2. 在页面中找到 “自定义 javascript 代码” 的输入框。
3. 将以下代码完整复制并粘贴到该输入框中：

4. 再次点击页面底部的 “保存设置”。

结语

以上就是子比主题翻页按钮增加页数跳转功能的完整实现教程。

这个功能的核心优势在于全程无需修改主题核心文件，完全依托子比主题自带的自定义代码面板与原生样式体系实现，零基础也能快速上手，且完全不用担心主题更新后功能失效。只需提前开启主题设置内的数字翻页按钮模式，再粘贴对应 JS 代码，就能给网站列表页添加上便捷的页码直达入口。

对于文章数量多、分页链路长的站点来说，这个小小的优化，既能极大降低访客的翻页成本、提升浏览体验，也能有效带动网站的页面访问深度，是子比主题轻量化用户体验优化的高性价比方案。