Elementor 模板以 JSON 形式存储。这意味着一个 HTML 页面可以转换为 JSON 模板文件,并像其他 Elementor 模板一样导入——可移植、可复用,且不依赖剪贴板。下面介绍 JSON 方式的运作原理以及何时选择它。
两种导出格式,相同的组件
转换 HTML 后,你可以通过两种方式导出。复制 Elementor 数据会把 JSON 数据放到剪贴板上,供你立即粘贴到已打开的编辑器中。下载 JSON 模板则将相同结构保存为 .json 文件。组件完全相同;区别在于文件可移植,而剪贴板数据不可移植。
何时应选择 JSON 文件
- 跨站点复用。 在任何安装了 Elementor 的 WordPress 站点上导入同一文件。
- 版本控制。 文件是纯 JSON,因此你可以将它保存在仓库中、比较两次导出,或将某个日期的设计原样归档。
- 分享。 你可以把文件发送给同事或客户;但无法把剪贴板发送给他们。
- 构建库。 一个包含已命名 JSON 模板的文件夹会成为一个组件库,供你组装未来页面。
如何将 JSON 模板导入 Elementor
- 转换 HTML,然后点击 下载 JSON 模板。
- 在 WordPress 中,打开 模板 → 已保存模板。
- 点击 导入模板,选择
.json文件。 - 模板会出现在你的库中;可通过 Elementor 库按钮将其插入任何页面。
JSON 里有什么
该文件描述了一个 Elementor 元素树:包括容器的布局、背景、边框和间距,以及小部件的内容和样式设置。由于这是 Elementor 的原生格式,所有内容都会作为可编辑小部件导入,而不是 HTML 块。标题、文本、图片、按钮、图标框、图片框和网格都会在导入后即可编辑。
一个实用提示:JSON 中的图片引用是 URL,而不是嵌入文件。如果你的源内容使用了真实的媒体库 URL,导入时它们会正常解析;本地路径和 Base64 图片会变成空占位符,你需要之后补齐。先上传图片,这是让 JSON 模板干净导入的唯一需要做的改变。
保存前让模板与站点无关
硬编码颜色和字体的模板导入下一个站点后会显得不协调。在导出你打算复用的区块之前,请使用 站点颜色 和 站点排版 进行转换。这样模板会采用目标站点定义的任何调色板和字体,因此同一个 JSON 在任何导入站点都会显得自然。
保持结构简洁
一个良好的可复用模板应包含一个顶层 Container,内部树状结构较浅。导出前,查看结构图:较低的嵌套深度,以及卡片行是直接容纳小部件的 Grid——而不是每张卡片都包裹在自己的容器里——会让模板在导入后更容易重新设置样式。干净的输入会生成干净的 JSON。
复制还是下载——快速判断
如果你只是将数据一次性插入正在编辑的页面,请粘贴剪贴板数据。对于任何需要多次导入、分享或保留的内容,请下载 JSON 文件。相同的转换,两种去向——根据你是否需要可移植性来选择。