Bricks 条件显示与动态数据:一套模板管整站

2026年10月3日 · 约 4 分钟读完

Bricks 与拖拽类构建器最大的思路差别:不要为每种内容建一个页面,而是建一套模板加几条条件。这一篇讲完成这件事需要的四个能力。

一、条件显示(Conditions)

条件可以挂在模板、元素或代码块上,判定对象大致三类:

  • 查询对象:文章类型、分类、标签、特定文章、页面模板、是否搜索结果页、是否首页
  • 访客:用户角色、是否登录、自定义字段值、Cookie、URL 参数
  • 时间:起止日期,用于促销与季节页

典型用法三条:

  1. 单篇模板按分类分流:SEO 分类的文章底部加一条「服务推广」区块,其它分类不显示
  2. 登录后在导航显示会员入口,访客看到的是注册按钮
  3. 带 ?utm_source= 参数进来时,把首页 Hero 换成活动版本

注意:条件为假的元素不会输出到 HTML(这跟 display:none 不一样),所以对 SEO 与调试都是干净的。排查「内容不见了」时,第一件事是看它挂了什么条件,而不是怀疑缓存。

二、动态数据(Dynamic Data)

在任意文本字段里可以插入动态数据:{post_title}、{post_excerpt}、{acf 开头的自定义字段}、{user_display_name}、{site_title}、日期与时间格式等。

三个实用细节:

  • 字段可以套格式(例如日期格式化、首字母大写),别在 CSS 里用 text-transform 补救
  • 没有值时会输出空,注意在容器上留 min-height 或加条件,避免出现空白块
  • 自定义字段建议先接 ACF 或 SCF,再在 Bricks 里引用,不要靠硬编码 meta 键名

三、循环与数据源

Loop Grid 或 Loop Carousel 的内容来自 Query 设置:

数据源 典型用途 注意
Posts(当前查询) 归档页、分类页列表 会跟随主查询,分页由 WordPress 管
Posts(自定义查询) 首页「最新教程」、分类 hub 页的「本分类教程」 要自己设分类与每页数量
Related posts 文章末尾「接着看」 按分类或标签关联,样本少时会空
Comments 评价区自定义外观 评论表单是另一套
WooCommerce products 畅销、新品、相关商品 分类 hub 页可直接循环产品
手动(Manual) 固定三条案例 别用它做本该自动更新的内容

空结果一定要填 No results text,并给出下一步(看全部教程、去联系页),否则客户会以为网站坏了。本站六个分类 hub 页就是这么配的。

四、分页

自定义查询的分页要开 Pagination 元素并绑定同一个查询 id,同时确认「paged」参数正确传递。分类 hub 里嵌了自定义查询时,分页常和主查询打架,出现「第二页还是同样的内容」。稳妥做法:hub 页用主查询加条件分流,或者把自定义查询的分页改成「加载更多」。

实例:用模板替代重复建页

教程文章

一个 Single Post 模板搞定:标题带(分类、标题、日期、预计阅读时长)、正文、上一篇下一篇、同类推荐三篇、评论。新建文章只要填内容与选分类,前台结构自动出现。

分类 hub 页

一个模板配六条条件(分别对应六个分类),区块内容是「本分类教程」的自定义查询。加第七个分类时只加一条条件。

产品页

一个 WooCommerce 单产品模板,用条件区分「有变体」和「仅询盘」两种产品,后者隐藏加购按钮换成报价表单。

五、代码元素(Code)用在哪

条件与动态数据覆盖不到的,才用代码:调用外部接口渲染区块、按业务规则改显示、加统计事件。三条纪律:

  1. 只给可信角色开执行代码权限,见 编辑器设置
  2. 每个代码块加注释说明用途与依赖
  3. 能被 WordPress 钩子或函数解决的,不要塞进元素里

衡量标准:如果加一篇文章或一个分类需要你去编辑模板,那条件写错了;如果模板改了十处才开始出现奇怪行为,那你缺的是一段代码而不是更多条件。

留下第一个评论