Advanced Themer（下文简称 AT）打算加一个很实用的功能：按下 Cmd/Ctrl + Shift 会在右侧边栏的元素快捷键上显示数字，输入数字就会点击对应按钮，从而在 Bricks 编辑器里添加该元素。
想法虽好，但作者更偏好按元素名称来添加元素，像这样：
| 键盘快捷键 | 添加的元素 |
| — | — |
| Cmd + Shift + S | Section |
| Cmd + Shift + C | Container |
| Cmd + Shift + B | Block |
| Cmd + Shift + D | Div |
| Cmd + Shift + H | Heading |
| Cmd + Shift + P | Basic Text（段落） |
| Cmd + Shift + I | Image |
| Cmd + Shift + K | Code |
| Cmd + Shift + L | Text Link |
这个方案可以用 Mac Workflow for Adding Elements in Bricks Editor（Keyboard Maestro 工作流）实现。
相比 AT 功能（2026-08-17 注：请核实该功能在当前 2.3.x 是否已上线，若已上线改为现状表述），这个方案还有一个好处（个人偏好）：新添加的元素会立刻获得焦点/变为激活状态。
如果你用的是 Windows，或者不想用 Keyboard Maestro，可以在 AT 设置里启用右侧元素快捷键侧边栏（Builder Tweaks → Structure Panel → General Tweaks：Enable shortcuts for creating new elements）之后，用下面的 JavaScript 代码：
document.body.addEventListener('keydown', (e) => {
// ctrl/cmd + shift + s - add Section.
if (e.key === 's' && (e.ctrlKey || e.metaKey) && e.shiftKey) {
e.stopPropagation()
e.preventDefault()
parent.document.querySelector('.brxce-panel-shortcut__container [data-panel="section"]').click()
}
// ctrl/cmd + shift + c - add Container.
if (e.key === 'c' && (e.ctrlKey || e.metaKey) && e.shiftKey) {
e.preventDefault()
parent.document.querySelector('.brxce-panel-shortcut__container [data-panel="container"]').click()
}
// ctrl/cmd + shift + b - add Block.
if (e.key === 'b' && (e.ctrlKey || e.metaKey) && e.shiftKey) {
e.preventDefault()
parent.document.querySelector('.brxce-panel-shortcut__container [data-panel="block"]').click()
}
// ctrl/cmd + shift + d - add Div.
if (e.key === 'd' && (e.ctrlKey || e.metaKey) && e.shiftKey) {
e.preventDefault()
parent.document.querySelector('.brxce-panel-shortcut__container [data-panel="div"]').click()
}
// ctrl/cmd + shift + h - add Heading.
if (e.key === 'h' && (e.ctrlKey || e.metaKey) && e.shiftKey) {
e.preventDefault()
parent.document.querySelector('.brxce-panel-shortcut__container [data-panel="heading"]').click()
}
// ctrl/cmd + shift + p - add Basic Text.
if (e.key === 'p' && (e.ctrlKey || e.metaKey) && e.shiftKey) {
e.preventDefault()
parent.document.querySelector('.brxce-panel-shortcut__container [data-panel="text-basic"]').click()
}
// ctrl/cmd + alt + l - add Text Link.
if (e.key === 'l' && (e.ctrlKey || e.metaKey) && e.shiftKey) {
e.preventDefault()
parent.document.querySelector('.brxce-panel-shortcut__container [data-panel="text-link"]').click()
}
// ctrl/cmd + shift + i - add Image.
if (e.key === 'i' && (e.ctrlKey || e.metaKey) && e.shiftKey) {
e.preventDefault()
parent.document.querySelector('.brxce-panel-shortcut__container [data-panel="image"]').click()
}
// ctrl/cmd + shift + k - add Code.
if (e.key === 'k' && (e.ctrlKey || e.metaKey) && e.shiftKey) {
e.preventDefault()
parent.document.querySelector('.brxce-panel-shortcut__container [data-panel="code"]').click()
}
}, false)用 JS 方案似乎无法阻止 Chrome 对 Cmd + Shift + T 的默认行为（重新打开最近关闭的标签页），所以作者从代码里删掉了 T 的绑定——你可以改用 Cmd + Shift + P。
至于这段代码怎么运行，这里有一种方式——用 WPCodeBox：
AT 后续版本很可能会加一个快捷键管理器。
目前作者会继续用自定义 Keyboard Maestro 工作流，因为：
-
按关联的字母比按数字更符合直觉
-
希望新添加的元素自动变为激活状态
-
无论 AT 是否运行，都能在任何 Bricks 站点上使用这些快捷键
Update 1：论坛相关讨论：https://forum.bricksbuilder.io/t/tutorial-create-elements-using-keyboard-shortcuts/19923/2
参考
https://wpdevdesign.com/custom-keyboard-shortcuts-in-bricks/
💡 译者注：原文代码中 Text Link 的注释写的是
ctrl/cmd + alt + l，实际判断条件仍是shiftKey（与原表格 Cmd+Shift+L 一致），属原文笔误，代码未改动；另外原文对「T 被删后改用 P」的建议与 P 已绑定 Basic Text 存在冲突，系原文自身问题，照实保留。
相关阅读：
适用场景
这个功能靠 Advanced Themer 这类辅助插件实现，不是 Bricks 自带。它最适合天天搭页面的人——按元素名称搜一下、回车就加好，比在侧边栏一层层点选省太多时间。偶尔建一两个页面的人收益不大。团队分工时，把常用元素对应的快捷键记成清单，新成员上手也快。注意某些系统级快捷键可能占用组合键，键位冲突时去插件设置里改掉即可。
常见问题（FAQ）
Q：这是 Bricks 自带功能吗？
A：不是，依赖 Advanced Themer 等辅助插件；纯 Bricks 本身没有按名称搜索并添加元素的能力。
Q：快捷键会和浏览器或系统冲突吗？
A：Cmd/Ctrl+Shift 组合一般安全，但个别系统快捷键可能占用，遇到冲突在插件里改键位即可。
Q：适合大项目吗？
A：适合频繁搭页面的用户，能省下大量点选时间；偶尔建站的话收益不明显，按需开启就好。
延伸阅读
- 想要现成外贸独立站模板与建站实战？看 铲子铺 chanzipu 的外贸建站教程（同用 Bricks，从零搭出能收询盘的站）
- 相关阅读：Bricks Setup Guide
延伸阅读
Bricks 查询循环输出 ACF 图片字段的 Alt、Caption、标题数据
教程：Bricks 查询循环输出 ACF 图片字段的 Alt、Caption、标题数据——acf 附完整代码可直接复用，适合外贸独立站与 WordPress 开发者。
tutorialBricks 中输出 ACF Relationship 关联文章的数量
教程：Bricks 中输出 ACF Relationship 关联文章的数量——acf 附完整代码可直接复用，适合外贸独立站与 WordPress 开发者。
tutorialACF Relationship 字段 + Bricks 查询循环：显示关联文章
教程：ACF Relationship 字段 + Bricks 查询循环：显示关联文章——acf 附完整代码可直接复用，适合外贸独立站与 WordPress 开发者。
tutorial把任意自定义 WP_Query 循环接入 Bricks 查询循环
教程：把任意自定义 WP_Query 循环接入 Bricks 查询循环——Bricks 附完整代码可直接复用，适合外贸独立站与 WordPress 开发者。