WordPress 如何实现页面间的分页导航功能?

来源:个人站长网作者:又改需求头衔:程序员
导读:本期聚焦于小伙伴创作的《WordPress 如何实现页面间的分页导航功能?》,敬请观看详情,探索知识的价值。以下视频、文章将为您系统阐述其核心内容与价值。如果您觉得《WordPress 如何实现页面间的分页导航功能?》有用,将其分享出去将是对创作者最好的鼓励。

在 WordPress 中,把长内容拆成多个独立页面并为它们加上分页导航,是提升用户体验的常见做法。这种做法不依赖插件,主要通过页面模板和循环查询完成。

WordPress 如何实现页面间的分页导航功能?

一、准备多个页面

先在后台新建若干个页面,例如“教程一”“教程二”“教程三”,记录它们的 ID 或别名。我们将以页面 ID 为例,在数组中按顺序排好。

二、在模板中获取当前页码

通过 URL 参数 paged 来判断用户当前在第几页,默认是第一页。利用 WP_Query 可查询对应页面的内容。

<?php
// 页面 ID 顺序排列
$page_ids = array(12, 15, 18);
$total = count($page_ids);

// 获取当前页码,默认 1
$paged = isset($_GET['paged']) ? intval($_GET['paged']) : 1;
if ($paged < 1) { $paged = 1; }
if ($paged > $total) { $paged = $total; }

// 查询当前页面内容
$args = array(
  'post_type' => 'page',
  'post__in'  => array($page_ids[$paged - 1]),
  'posts_per_page' => 1
);
$query = new WP_Query($args);
?>

三、输出页面内容与导航

循环输出当前页面正文,并在下方生成上一页、下一页链接。使用 get_permalink 拿到页面自身链接,再拼上 paged 参数。

<?php if ($query->have_posts()) : while ($query->have_posts()) : $query->the_post(); ?>
  <h3><?php the_title(); ?></h3>
  <div><?php the_content(); ?></div>
<?php endwhile; endif; wp_reset_postdata(); ?>

<nav class="page-pagination">
  <?php if ($paged > 1): ?>
    <a href="?paged=<?php echo $paged - 1; ?>">上一页</a>
  <?php endif; ?>
  <span>第 <?php echo $paged; ?> 页 / 共 <?php echo $total; ?> 页</span>
  <?php if ($paged < $total): ?>
    <a href="?paged=<?php echo $paged + 1; ?>">下一页</a>
  <?php endif; ?>
</nav>

四、样式补充建议

可为 nav 添加简单 CSS,让链接排成一行并留出间距:

.page-pagination {
  margin-top: 24px;
}
.page-pagination a {
  margin: 0 8px;
  padding: 6px 12px;
  border: 1px solid #ccc;
  text-decoration: none;
}
.page-pagination span {
  margin: 0 8px;
}

五、注意事项

  • 页面 ID 调整时,需同步修改模板中的 $page_ids 数组。
  • 若使用伪静态链接,可将 ?paged=2 形式改为 /paged/2/ 并重写规则。
  • 不要在正文里误写 <input> 这类标签名称,如需说明请转义展示。

通过上述方式,你就能在 WordPress 的独立页面之间实现清晰的分页导航,方便读者按顺序浏览内容。

WordPress分页导航WP_Query修改时间:2026-07-25 19:27:20

免责声明:​ 已尽一切努力确保本网站所含信息的准确性。网站内容多为原创整理与精心编撰,观点力求客观中立。本站旨在免费分享,内容仅供个人学习、研究或参考使用。若引用了第三方作品,版权归原作者所有。如内容涉及您的权益,请联系我们处理。
内容垂直聚焦
专注技术核心技术栏目,确保每篇文章深度聚焦于实用技能。从代码技巧到架构设计,为用户提供无干扰的纯技术知识沉淀,精准满足专业提升需求。
知识结构清晰
覆盖从开发到部署的全链路。AI、前端、编程、数据库、服务器、建站、系统层层递进,构建清晰学习路径,帮助用户系统化掌握开发与运维所需的核心技术。
深度技术解析
拒绝泛泛而谈,深入技术细节与实践难点。无论是数据库优化还是服务器配置,均结合真实场景与代码示例进行剖析,致力于提供可直接应用于工作的解决方案。
专业领域覆盖
精准对应开发生命周期。从前端界面到后端编程,从数据库操作到服务器运维,形成完整闭环,一站式满足全栈工程师和运维人员的技术需求。
即学即用高效
内容强调实操性,步骤清晰、代码完整。用户可根据教程直接复现和应用于自身项目,显著缩短从学习到实践的距离,快速解决开发中的具体问题。
持续更新保障
专注既定技术方向进行长期、稳定的内容输出。确保各栏目技术文章持续更新迭代,紧跟主流技术发展趋势,为用户提供经久不衰的学习价值。