本教程旨在解决 WordPress 中如何在父页面上显示子文章的问题。通过自定义 WP_Query 查询，我们可以有效地检索并展示指定父页面下的所有子文章，从而增强网站内容的组织性和用户体验。本文将提供详细的代码示例和解释，帮助开发者轻松实现这一功能。
在 WordPress 中，父子文章关系是一种常见的组织内容的方式。有时，我们需要在父页面上显示其所有子文章，以便用户可以更方便地浏览相关内容。以下是一种实现此功能的有效方法：
使用 WP_Query 查询子文章
我们可以使用 WP_Query 类来查询指定父页面的子文章。以下代码展示了如何实现：
<?php
$args = array(
'post_type' => 'custom-post-type-name', // 替换为你的自定义文章类型名称
'posts_per_page' => 15, // 显示的文章数量，-1 表示显示所有
'post_parent' => $post->ID, // 父页面的 ID
'order' => 'ASC', // 排序方式，ASC 表示升序，DESC 表示降序
);
$parent = new WP_Query( $args );
if ( $parent->have_posts() ) :
while ( $parent->have_posts() ) :
$parent->the_post();
?>
<div id="parent-<?php the_ID(); ?>" class="parent-page">
<h1>
<a href="<?php the_permalink(); ?>" title="<?php the_title(); ?>">
<?php the_title(); ?>
</a>
</h1>
</div>
<?php
endwhile;
endif;
?>代码解释：
-
$args 数组： 定义了 WP_Query 的查询参数。
- post_type: 指定要查询的文章类型。请将 'custom-post-type-name' 替换为你的自定义文章类型名称。如果使用默认的文章类型（post），则设置为 'post'。
- posts_per_page: 指定每页显示的文章数量。设置为 -1 表示显示所有符合条件的文章。
- post_parent: 指定父页面的 ID。 $post->ID 获取当前父页面的 ID。
- order: 指定文章的排序方式。'ASC' 表示升序，'DESC' 表示降序。
$parent = new WP_Query( $args );: 创建一个新的 WP_Query 对象，并传入查询参数。
if ( $parent->have_posts() ) :: 检查查询结果是否有文章。
DeepBI DHTML 页面生成器下载生成可在 deepbi 沙箱 iframe 内运行或作为独立文件运行的交互式 HTML 页面，使用 `window.deepbi` JS SDK 实现数据查询、空间管理、文件浏览及用户操作。当用户提出以下需求时启用该能力： - 创建 KPI 仪表盘、数据表格、文件浏览器、成员列表、管理页面； - 明确要求“转成 dhtml”、“转译成 HTML”、“把 XX 页面转成……”、“控制台页面”、“管理后台”、“DeepBI 页面迁移”； - 提及位于 `apps/console/src/featur
while ( $parent->have_posts() ) :: 循环遍历查询结果中的每一篇文章。
$parent->the_post();: 设置当前文章为全局文章，以便可以使用 WordPress 的模板标签。
- : 创建一个 div 容器来包裹每个子文章的内容。
使用方法：
将上述代码复制到你的 WordPress 主题的 page.php 文件中，或者你希望显示子文章的任何其他模板文件中。请确保将 'custom-post-type-name' 替换为你的实际文章类型名称。
注意事项：
- 确保在循环中使用 $parent->the_post();，以便正确设置全局文章对象。
- 可以根据需要调整查询参数，例如 posts_per_page 和 order。
- 可以自定义 HTML 结构和 CSS 样式，以适应你的网站设计。
- 如果父页面没有子文章，则不会显示任何内容。
总结：
通过使用 WP_Query 类，我们可以轻松地在 WordPress 父页面上显示子文章。这种方法灵活且可定制，可以满足各种不同的需求。只需要修改文章类型、排序方式以及显示数量，即可适用于不同的应用场景。 记住根据你的实际需求调整代码，并进行适当的测试，以确保一切正常运行。
