HappyFiles 文件夹图片的 Bricks 查询循环：三种取图方案

这篇教程探索：用 HappyFiles 整理过的 WordPress 媒体库图片，如何通过 Bricks 的查询循环（query loop）拉取并展示出来。

注意：只有当你想获得比 HappyFiles 自带的「HappyFiles – Gallery」Bricks 元素更多的控制权时，才需要用到这些方案。

目录

• 方案一：嵌套查询循环

• 方案二：单个 PHP 查询循环

• 方案三：配合 BricksExtras Dynamic Lightbox

方案一：嵌套查询循环

先看一个简单场景：图片放在名为「Business」的文件夹里。

要用 Bricks 查询循环展示这些图片，需要两层查询：外层先循环遍历「Business」这个 HappyFiles 文件夹（分类项 term），内层再查询该文件夹里的 Media 文章类型附件（attachment）。

外层查询设置（查询 HappyFiles 的 business 分类项）：

内层查询设置（查询附件，按外层当前分类项过滤）：

结构（外层查询循环里嵌套内层查询循环）：

要让图片可点击、在灯箱（lightbox）里看大图，给图片元素加上链接设置：

完整结构可以直接复制这份 Section JSON（粘贴到 Bricks 页面/模板即可）。

方案二：单个 PHP 查询循环

如果你只想用一个 Bricks 查询循环，在查询设置里启用 PHP query 并把下面的代码粘贴进去：

// Query attachments in the HappyFiles category
$args = [
  'post_type' => 'attachment',
  'post_status' => 'inherit',
  'posts_per_page' => -1,
  'fields' => 'ids',
  'no_found_rows' => true,
  'tax_query' => [
    [
      'taxonomy' => 'happyfiles_category',
      'field' => 'slug',
      'terms' => 'business',
    ],
  ],
];
$hf_query = new WP_Query( $args );
$image_ids = $hf_query->posts;
// Return query args for Bricks
if ( ! empty( $image_ids ) ) {
  return [
    'post_type' => 'attachment',
    'post_status' => 'inherit',
    'posts_per_page' => -1,
    'no_found_rows' => true,
    'post__in' => $image_ids,
    'orderby' => 'post__in',
  ];
}
// Return empty result set
return [
  'post_type' => 'attachment',
  'post__in' => [ 0 ],
];

把 business 换成你的 HappyFiles 文件夹 slug。

保存代码并保存页面。对应结构的 Section JSON 在此。

相关阅读：

• ACF Relationship 字段 + Bricks 查询循环：显示关联文章

• 把任意自定义 WP_Query 循环接入 Bricks 查询循环

• Meta Box Relationship 字段 + Bricks 查询循环：显示关联文章

方案三：配合 BricksExtras Dynamic Lightbox

如果想让某个 HappyFiles 文件夹里的每张图片在灯箱里显示什么内容都由你完全掌控，用 BricksExtras 的 Dynamic Lightbox 元素。

给「Small Image」（小图）加一个 CSS 类 post-lightbox：

确保它链接到 #。

Dynamic Lightbox 设置：

对应的 Section JSON 在此。

想显示图片描述，可以用 x_attachment_description 动态标签（放在花括号里使用）。

BricksExtras 为附件（图片）添加的其他动态标签还有：

• x_attachment_alt_text —— 显示附件的 alt 文本。

• x_attachment_title —— 显示附件标题。

• x_attachment_url —— 显示附件图片 URL。

• x_attachment_caption —— 显示附件说明文字（caption）。

Bricks 里关于 HappyFiles 的所有教程都在这里。另外也可以看这个 Bricks 论坛帖子（如何在查询子文件夹及其图片时创建画廊）。

三种方案怎么选

方案一（嵌套查询循环）最直观，适合文件夹层级浅、要原样展现目录树；方案二（单个 PHP 查询循环）更灵活、能自定义排序和过滤，适合文件多或要按字段筛；方案三（配 BricksExtras Dynamic Lightbox）适合做图库/素材展示，点开大图。误区是「嵌套就够」——文件一多嵌套层级深、查询重，反而不如方案二清爽。按你的文件量和交互需求选，别无脑套最复杂的。

延伸阅读

• 想要现成外贸独立站，从零搭出能收询盘的站？看 铲子铺 chanzipu 的外贸建站教程（同用 Bricks）

常见问题（FAQ）

嵌套查询循环适合什么？ 适合文件夹层级浅、要原样展现目录树的场景，最直观。

单个 PHP 查询循环强在哪？ 更灵活，能自定义排序、过滤，文件多或要按字段筛时更顺。

Dynamic Lightbox 方案干嘛用？ 做图库/素材展示，点缩略图弹大图，配合 BricksExtras 最省事。

文件很多选哪个？ 文件多、层级深时优先方案二，嵌套太深查询会重、维护也乱。

• 相关阅读：Bricks Query Loop Api Data

站长

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.

获取报价 →浏览全部教程