Bricks 编辑器加了元素却不显示？Cloudflare Rocket Loader 惹的祸

现象：元素加了画布里看不到

后台用 Bricks 编辑器，拖了元素进去、点保存也成功了，但画布里就是看不到——或者编辑模式下元素时隐时现、刷新后才冒出来。

这个问题九成出现在域名挂了 Cloudflare CDN 的站点上。它跟你的 Bricks 版本、跟主题都没关系，纯粹是“加载被某个前端优化功能拦了”。

根因：Rocket Loader 把编辑器 JS 推后了

Cloudflare Rocket Loader 是个前端性能优化，核心机制是强制异步加载、延后执行页面上所有 JavaScript。对纯展示型静态页它确实能提速首屏，但对重度依赖 JS 的 Bricks 编辑器来说，它是真正的“编辑器杀手”——编辑器的 JS 被推后，元素自然渲染不出来。

大多数现代主题（含 Bricks）自身已经优化得不错，没必要再叠这种暴力的 JS 延迟工具。

方法A：Bricks 自带开关一键兼容

Bricks 后台其实藏了个针对 Rocket Loader 的兼容开关，最快：

1. 后台进入 Bricks → Settings（Bricks 设置）
2. 切到 Builder（有的版本叫 Building） 标签
3. 找到 Cloudflare Rocket Loader 这一项，把它开启
4. 保存后清一下缓存，重新进编辑器

这个选项的具体标签名在不同 Bricks 版本里略有出入，开启后若仍不生效，按官方文档补全确认位置，或直接走下面方法 B。

方法B：Cloudflare 全局关闭（最省心）

不想折腾规则，直接全局关掉最稳：

1. 登录 Cloudflare 控制台，进入你的域名
2. 左侧 Speed（速度）> Optimization（优化）
3. 找到 Rocket Loader，开关拨到 关闭
4. 再到 Caching（缓存）> Configuration（配置），点 Purge Everything（清除所有缓存）

清完缓存重新进 Bricks 编辑器，元素基本就回来了。

方法C：页面规则只排除编辑器

如果你想访客端保留 Rocket Loader 的加速、只让后台和编辑器不受影响，用 Page Rules 精准排除：

1. Cloudflare 进入 Rules（规则）> Page Rules（页面规则）
2. 点 Create Page Rule（创建页面规则）
3. URL 匹配填：*你的域名.com/*?bricks=run*（这是 Bricks 编辑器的 URL 特征）
4. 设置项选 Rocket Loader，状态 Off（关闭）
5. （可选）再加一条：*你的域名.com/wp-admin/*，同样关掉 Rocket Loader
6. 保存并部署

这样前台照样加速，后台编辑器不受影响。

和其他「元素不显示」情况区分

先确认是不是 Rocket Loader：用无痕窗口开编辑器，若元素出现，基本就是 Cloudflare 优化把 JS 推后了；若仍不显示，要排查别的原因——元素被 Conditions 隐藏、父容器 display:none、或 z-index 被盖住。Bricks 自带兼容开关（方法 A）优先试，不行再上 Cloudflare 层面解决，别一上来就全局关加速。

小结

Rocket Loader 对静态展示页是利器，对 Bricks 这类 JS 驱动的构建器是隐患。遇到“元素加了不显示”的灵异问题，先关 Rocket Loader 试，通常能瞬间解决大部分后台编辑器故障。

你的站也挂了 Cloudflare、编辑器和前端表现对不上？联系 Ray Chan，顺手帮你把这类坑排了。

• 相关阅读：Bricks Setup Guide 延伸阅读

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

常见问题（FAQ）

Bricks 自带兼容开关在哪？ 在 Bricks 设置的性能相关项里有关闭与 Rocket Loader 兼容的开关，先打开试试，最不影响访客速度。

方法 A/B/C 怎么选？ 想最省心选 B 全局关；想保留访客端加速选 C 页面规则只排除编辑器；A 是 Bricks 内部兼容开关，优先试。

改完要清缓存吗？ 要，去 Cloudflare 清一次缓存，否则旧规则还在生效。

不是 Rocket Loader 怎么办？ 检查 Conditions 条件、父容器显示状态和 z-index，这些也会让元素「加了却不显示」。

站长

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.

获取报价 →浏览全部教程