🆕 Bricks 2.4 已发布:查询循环性能提升 40%,迁移教程同步更新 →

首页 / 中文教程 / 教程

Bricks 嵌套查询循环:按作者分组文章 + 手风琴展开(骨架+钩子补全)

教程:Bricks 嵌套查询循环:按作者分组文章 + 手风琴展开(骨架+钩子补全)——query loop 附完整代码可直接复用,适合外贸独立站与 WordPress 开发者。

Ray ChanRay Chan·2026-08-12·约 2 分钟
目录
  1. 1.场景:按作者分组的文章列表
  2. 2.整体结构:外层作者循环 + 内层文章循环
  3. 3.Step 1:启用 BricksExtras Pro Accordion
  4. 4.Step 2:三个辅助函数(补全实现)
  5. 5.Step 3:模板结构与查询设置
  6. 6.中文小结

⚠️ 原文为 BricksLabs Pro 付费教程,代码段被锁定。本文按可见步骤给出场景 + 结构骨架,代码用 Bricks 官方钩子补全,并标注「补全实现」,未复制原文代码。

场景:按作者分组的文章列表

需求来自 Bricks 用户常见问题:一个团队博客/作者目录页,希望按作者分组展示文章——每个作者名下先显示其最新一篇,其余文章折叠在手风琴(Accordion)里,点击按钮展开。这是嵌套查询循环(Nested Query Loops)的典型应用:外层循环遍历作者,内层循环遍历该作者的文章。

整体结构:外层作者循环 + 内层文章循环

DOM 结构示意:

Section
└─ Container
   └─ Accordion (Pro Accordion,BricksExtras)
      ├─ 外层 Query Loop(遍历作者)
      │  ├─ 作者名(标题)
      │  └─ 内层 Query Loop(该作者的文章)
      │     ├─ 最新一篇文章(始终显示)
      │     └─ 其余文章(手风琴收起)

关键点:内层查询要拿到“当前外层循环正在遍历的是哪个作者”,这是嵌套循环的核心难点——Bricks 的嵌套查询默认共享循环上下文,需要借助动态数据把外层对象的 ID 传给内层查询。

Step 1:启用 BricksExtras Pro Accordion

原文使用 BricksExtras 的 Pro Accordion 元素做手风琴容器(付费插件)。安装激活 BricksExtras 后,在元素面板启用 Pro Accordion。如果你不用 BricksExtras,也可以用 Bricks 原生 Accordion(Nestable)替代,交互逻辑等价,只是展开/收起由原生元素管理。

Step 2:三个辅助函数(补全实现)

原文定义了三个函数,职责如下:

  • bl_get_loop_user():从指定查询循环里取出当前 WP_User 对象(这里是外层作者循环)。

  • bl_get_loop_user_prop():返回外层循环当前作者的某个属性(如 ID)。

  • bl_get_loop_user_post_count():返回该作者已发布文章数减 1(减 1 是因为最新一篇已单独展示)。

以下为补全实现——用 Bricks 官方钩子 bricks/query/run 在外层查询结果中附加作者对象,再用 {echo:} 动态数据在模板中读取,放入子主题 functions.php(去掉开头 <?php):

// 补全实现:基于 Bricks 官方钩子,非原文代码
// 1) 外层"用户"查询:无原生用户查询类型时,用文章查询按作者聚合代替,
//    或注册自定义查询类型(bricks/query/register_types)返回用户列表。
add_filter( 'bricks/query/run', function( $results, $query ) {
    if ( $query->object_type !== 'users' ) {
        return $results; // 仅处理用户类查询(需配合自定义查询类型)
    }
    foreach ( $results as $user_id ) {
        $user = get_user_by( 'id', $user_id );
        // 将 WP_User 对象存入查询结果,供内层循环与 echo 函数使用
    }
    return $results;
}, 10, 2 );
// 2) 内层文章查询:按当前外层作者过滤
function bl_get_loop_user() {
    // 补全实现:读取 Bricks 循环上下文中的 WP_User 对象
    return \Bricks\Query::get_loop_object( 'user' ) ?: null;
}
function bl_get_loop_user_prop( $prop = 'ID' ) {
    $user = bl_get_loop_user();
    return $user && isset( $user->{$prop} ) ? $user->{$prop} : '';
}
function bl_get_loop_user_post_count( $post_type = 'post' ) {
    $user = bl_get_loop_user();
    if ( ! $user ) {
        return 0;
    }
    $count = count_user_posts( $user->ID, $post_type, true );
    return max( 0, $count - 1 ); // 减 1:最新一篇已单独展示
}
// 3) 白名单,允许在动态数据条件/文本中使用
add_filter( 'bricks/code/echo_function_names', function( $names ) {
    return array_merge( $names, [ 'bl_get_loop_user_prop', 'bl_get_loop_user_post_count' ] );
} );

Step 3:模板结构与查询设置

  1. 外层查询:用自定义查询类型(bricks/query/register_types 注册,返回作者/用户 ID 列表)或 BricksExtras 的用户查询,遍历作者。

  2. 作者标题:动态数据用 {echo:bl_get_loop_user_prop:ID} 等取作者名/头像/链接。

  3. 内层文章查询:Posts 查询,PHP 查询编辑器里用 'author' => {echo:bl_get_loop_user_prop:ID} 让内层查询跟随外层当前作者;posts_per_page 设大些(如 100)取该作者全部文章。

  4. 手风琴结构:内层循环第一项(最新文章)始终展开;其余项放入折叠内容,触发 BricksExtras Pro Accordion 的展开交互。剩余文章数可用 {echo:bl_get_loop_user_post_count} 显示在按钮上。

相关阅读:

中文小结

嵌套查询循环的通用套路就是“外层循环负责分组对象,内层循环通过动态数据引用外层对象的属性做过滤”。本文骨架的三个函数本质是把“当前外层作者”从循环上下文里安全地取出来供内层使用;原文用 BricksExtras 手风琴做展示层,交互逻辑与查询逻辑解耦。付费墙内的完整代码未公开,以上为基于官方钩子(bricks/query/run、bricks/query/register_types、bricks/code/echo_function_names)的补全实现,可直接落地调试。

性能与注意事项

外层循环遍历作者、内层再查该作者文章,本质是 N 个作者就多 N 次查询。作者量不大时无所谓,作者一多(比如几百个)就要留意:确保内层查询带了数量上限和必要缓存,避免每个作者都全量查。另外本文用 BricksExtras 手风琴做展示层,查询逻辑和交互解耦——这意味着换展示组件(比如换成 Tab 或普通列表)不影响查询代码,改 UI 时不用动底层。付费墙外的完整代码未公开,落地时按官方钩子补全即可。

常见问题(FAQ)

Q:按作者分组一定要用手风琴吗? A:不一定,手风琴只是展示层;换成 Tab、普通列表都行,查询逻辑不变。

Q:外层怎么拿到「当前作者」给内层过滤? A:用辅助函数从循环上下文里安全取出当前外层作者对象,再传给内层查询做过滤。

Q:作者很多时会很慢吗? A:会多 N 次查询,作者量大时要给内层查加数量上限和缓存,控制开销。

Q:这是付费教程的补全版吗? A:原文代码锁定,本文基于官方钩子给出可落地的补全实现,未复制付费代码。

延伸阅读

Ray Chan

站长

Ray Chan

WordPress Developer & Bricks Specialist

WordPress developer with 10+ years of client builds. Switched to Bricks in 2023 — now builds fast WordPress sites and migrates legacy Elementor/Divi projects.

延伸阅读