HTML 转 Elementor JSON：导出与导入模板

Elementor 模板是以 JSON 形式存储的。这意味着一个 HTML 页面可以转换成一个 JSON 模板文件，像其他 Elementor 模板一样导入——便于携带、可以复用，也不依赖剪贴板。下面讲讲 JSON 这条路怎么用，以及什么时候该选它。

一个转换后的元素树通向两条导出路径：将 Elementor 粘贴数据复制到剪贴板，或下载可移植的 JSON 模板文件。 — 两种方式生成的组件完全相同。对于已经打开的页面，使用剪贴板最快；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 导入到哪里都像原生的一样。

保持结构干净

好的可复用模板是一个顶层容器，里面是一棵层级很浅的结构树。导出前看一眼结构映射：嵌套层级低，卡片行是一个直接装着小部件的网格——而不是每张卡片各自套一个容器——这样的模板导入后要重新调整样式会容易得多。干净的输入，才有干净的 JSON。

文件实际的样子

它没什么神秘的，了解了各个字段，这个格式就没那么吓人了。下载得到的模板是一个 JSON 对象，包含五个键：

content——元素树：容器和小部件，每个都带有各自的设置。
page_settings——页面级设置，转换出来的区块这一项为空。
version——"0.4"，Elementor 模板结构的版本号。
title——你在模板标题栏里填写的内容，默认为“HTML Converted Page”。
type——"page"。

值得弄明白的是那个 type 值。把模板声明为页面而不是区块，意味着它会以页面模板的身份出现在“已保存的模板”里——你照样可以通过模板库按钮把它插入任何现有页面，什么都不会损失；同时你也可以直接用它新建一个空白页面。

为什么剪贴板里的数据长得不一样

如果你查看“复制”按钮放到剪贴板上的内容，会发现它不是同一个对象。它带有 type: "elementor"、一个 siteurl 和元素数组——没有版本号，也没有标题。

这是 Elementor 的粘贴格式，而不是它的模板格式。当你右键选择从其他站点粘贴时，编辑器正是靠这个标记来识别剪贴板里是 Elementor 数据而不是普通文本。这就是为什么粘贴不需要任何导入步骤；也正因如此，你不能把剪贴板数据存成文件再拿去导入——这两种格式不能互换，尽管它们描述的是同样的组件。

纯 JSON 意味着真正的版本管理

因为这个文件是可读的 JSON，而不是二进制包，它的表现就像源代码一样，由此带来几项真正有用、却很少有人对页面区块这样做的用法：

对比两次导出。转换一个区块，修改源码，再转换一次，然后对比两个文件，就能确切看到哪些设置变了。要弄懂某个转换选项到底改了什么，这是目前最快的办法。
按时间点存档设计。一个标好日期的 JSON 文件，精确记录了某个区块当时的样子；即使线上页面早已被改得面目全非，也能把它找回来。
导入前先审查。在文件里搜索 http，就能看到它引用的每一个图片 URL，立刻知道它能否干净地导入另一个站点。

最后这一项只需十秒钟，却能拦住最常见的导入失败——模板里的 URL 全都指向一个目标站点访问不到的站点。

复制还是下载——一条简单规则

只是一次性插入你正在编辑的页面，就粘贴剪贴板数据。凡是要多次导入、要分享或要留存的，就下载 JSON 文件。同一次转换，两个去处——看你是否需要可携带性来选。