博客、文档常需要在正文旁放侧边栏(目录、最新文章、广告)。Bricks 处理侧边栏有两条路:用 WordPress 小工具区,或直接用容器布局。本文讲清楚。
两条路线
- 路线 A:沿用 WordPress 原生侧边栏(Widgets),在外观 → 小工具里拖模块,Bricks 模板里调用这个侧边栏区域。
- 路线 B:不依赖小工具,直接在 Bricks 用 Container 拼一个侧边栏区块(最新文章列表、分类等用动态数据或 Query Loop 拉取),更灵活、更好看。
用 Bricks 容器做侧边栏
- 在 Single/Archive 模板里,把版面分成「主内容 + 侧边栏」两栏(用 Container 横排)。
- 侧边栏容器里放一个 Basic Text 当标题,再用 Query Loop 拉「最新文章」列表。
- 用模板条件让文章页统一显示这套两栏版式。
响应式处理
桌面两栏,手机上侧边栏通常移到正文下方或隐藏。用容器在手机视口改为纵向堆叠即可。
小结
Bricks 侧边栏既能接原生小工具,也能纯用容器+Query Loop 自建。追求统一视觉就走容器路线,简单挂模块就走小工具路线。
内容说明(整理稿):本文选题与步骤框架参考自竞对站 trybricks.com / qinbanliang 站的公开教程(源多为截图驱动教程,正文极薄),内容为 BricksWiki 基于 Bricks 官方公开文档与通用实操经验重写整理,非原文逐字翻译,也不构成官方文档。操作入口/路径以你当前 Bricks 版本为准,实操前建议对照官方文档核对。
延伸阅读
ACF Relationship 字段 + Bricks 查询循环:显示关联文章
教程:ACF Relationship 字段 + Bricks 查询循环:显示关联文章——acf 附完整代码可直接复用,适合外贸独立站与 WordPress 开发者。
tutorialBricks 查询循环按 ACF Repeater 子字段值筛选行
教程:Bricks 查询循环按 ACF Repeater 子字段值筛选行——acf 附完整代码可直接复用,适合外贸独立站与 WordPress 开发者。
tutorialBricks 按 ACF Repeater 子字段排序行
教程:Bricks 按 ACF Repeater 子字段排序行——acf 附完整代码可直接复用,适合外贸独立站与 WordPress 开发者。
tutorialBricks 让元素输出 N 次(N = 自定义字段值):Array 查询类型实战
教程:Bricks 让元素输出 N 次(N = 自定义字段值):Array 查询类型实战——query loop 附完整代码可直接复用,适合外贸独立站与 WordPress 开发者。
