安装 Bricks 与启用子主题
官网购买后,进账号的 DOWNLOADS 分别下载 Bricks Theme 和 Child Theme 两个 zip 包(不用解压)。在 WordPress 后台「主题」里按序上传安装,并启用 Bricks Child 子主题。
为什么要子主题? 子主题通过 WordPress 可识别的代码和父主题关联,继承父主题全部功能,同时可以修改/新增 CSS、PHP,却不动父主题任何文件。父主题每次更新都会替换全部文件,若把代码写进父主题,更新后代码全没;写进子主题则安全。
brickswiki 视角:建议编辑器界面用英文。一来官方中文翻译疑似机翻、有误导,二来英文术语在各编辑器里基本统一,熟悉后更容易切换工具、也方便查国外优质教程。
通用设置(General)
进 Settings 逐项看:
- Post types:默认即可。真要用 Bricks 编辑博客正文时,再打开 Posts 开关。
- Gutenberg data:保持默认。
- SVG uploads:建议只开放管理员上传权限。SVG 本质是代码(记事本可打开),可能被植入恶意代码,务必只用可信来源;Logo 推荐用 SVG(矢量不失真,可用 AI 编辑)。
- Miscellaneous:建议禁用前两项。一般用专门的 SEO 插件,关掉 Bricks 自带相关功能以防冲突。
- Custom breakpoints:需要自定义断点时才开。Bricks 默认 4 档:桌面端(≥992px)、平板端(768–991px)、手机横屏(479–767px)、手机纵屏(≤478px)。
- Convert:一般不用。版本大改时 Bricks 会在这里提供一键迁移。
Builder Access 与代码执行权限
- Builder access:默认即可,一般只让管理员拥有编辑权限。
- Code Execution:开启后,Code 小部件下会出现 Execute Code 开关,之后在 Code 小部件里写的代码就能运行。通常也只给管理员开。
Builder 界面与性能设置
- 自动保存:默认 60 秒一次,可按需改。
- 界面颜色/语言:默认灰黑,可换;语言建议选 English(配合英文术语学习)。
- 结构面板:按个人习惯配置即可。
- 动态数据:建议禁用 WP REST API(有安全隐患);Dynamic data 按喜好设。
- 性能(Performance):Bricks 本身加载快,因为它大幅压缩了自身 CSS/JS,并内置了缓存插件常见的优化(禁用 emoji、禁用谷歌字体、图片懒加载等)。
- 没用到谷歌字体就一并禁用。
- CSS 加载方式:推荐 External files,加载更快。
- Webfont 加载方式:默认 Stylesheets 是先出文字再套样式,网慢时字体突变更明显、CLS 值可能偏高;Webfont Loader (JS) 则是字体加载完才显示文字,减少偏移,但网慢时用户可能已划到下方而忽略上方文字。按场景取舍。
API 与全局 Custom Code
- API:用到时再填对应密钥(如 Google Maps、reCAPTCHA 等)。
- Custom Code:可直接在这里加全局 CSS/JS,省掉额外代码管理插件。这里加的代码全站加载,适合放 GTM 之类全局代码;只想单页加载的代码,要到具体页面/模板的 Style → CSS → Custom CSS 里加。
小结
安装用 Bricks + Child 子主题,基础设置里重点盯住 SVG 权限、Miscellaneous 冲突项、断点、Code Execution 权限、CSS 用 External files 这几项。设置好就可以去熟悉界面和基本操作了。
内容说明(整理稿):本文选题与步骤框架参考自竞对站 trybricks.com / qinbanliang 站的公开教程(源多为截图驱动教程,正文极薄),内容为 BricksWiki 基于 Bricks 官方公开文档与通用实操经验重写整理,非原文逐字翻译,也不构成官方文档。操作入口/路径以你当前 Bricks 版本为准,实操前建议对照官方文档核对。
延伸阅读
Bricks 网站速度究竟如何——实测与提速清单
教程:Bricks 站快不快,取决于生成代码质量和你的优化动作。拆解 Bricks 的性能底子,给你一套能直接抄的提速清单。
tutorialBricks 主题本地化 Google 字体
教程:把 Google 字体下载托管到自己服务器,去掉外部请求,提升 Bricks 站首屏速度与稳定性。
tutorialBricks 主题购买安装指南
教程:从官网下单到站点上线的清晰五步——买授权、下 zip、上传启用激活、基础配置、开搭页面,新手照着走。
tutorialBricks 用 ACF Checkbox 字段渲染自定义 SVG 图标列表
教程:Bricks 用 ACF Checkbox 字段渲染自定义 SVG 图标列表——acf 附完整代码可直接复用,适合外贸独立站与 WordPress 开发者。
