网站版块转 Elementor 模板

安装指南

1. ClawHub CLI 从源直接安装技能的最快方式。
   npx clawhub@latest install elementor-section
2. 手动安装 将技能文件夹复制到以下位置之一
   全局模式
   ~/.openclaw/skills/
   工作区
   /skills/
   优先级：工作区 > 本地 > 内置
3. 提示词安装 将此提示词复制到 OpenClaw 即可自动安装。
   请帮我使用 Clawhub 安装 elementor-section。如果尚未安装 Clawhub，请先安装（npm i -g clawhub）。
   更倾向于下载？
   获取包含原生技能文件的ZIP压缩包。
   下载技能 (.zip)

什么是

网站版块转 Elementor 模板使用 MiroMiro 检查线上页面，解析其实际样式（包括颜色、字体、间距、响应式行为和悬停效果），并返回完整的 Elementor 模板 JSON 文件。借助 Openclaw Skills，用户可以在自己的 WordPress 网站上重建主视觉区、定价表、页眉、页脚、功能列表、客户评价、常见问题或 CTA。
生成的版块会以一个带样式的 HTML 区块交付，并附带作用域限定的 CSS，而不是由一组原生 Elementor 小工具组成。将未经修改的 JSON 导入 WordPress，然后从 Elementor 的模板库中插入。除非内容属于你，否则请在发布前替换原网站的文本、徽标和图片。

应用场景

在由 Elementor 驱动的 WordPress 页面中重建线上网站的主视觉区。
根据参考 URL 构建定价表、功能版块、客户评价、常见问题或 CTA。
将网站页眉或页脚作为可导入模板加入 WordPress 设计。
根据指定名称的版块生成 Elementor JSON 模板，无需手动复制样式。
当源网站提供深色主题时，请求生成深色主题版本。
在非 WordPress 项目中使用 MiroMiro 的其他输出框架——Tailwind、HTML、JSX 或 Vue。

工作原理

提供线上页面 URL；如适用，还需提供版块名称：hero、header、footer、pricing、features、testimonials、faq 或 cta。省略 section 时会请求主视觉区。
使用 framework: "elementor" 调用已连接的 MiroMiro extract_code 工具，或使用用户的 MIROMIRO_API_KEY 调用 REST API。
检查响应。完整模板包含在 code 中；css 有意设为 null，因为样式已嵌入模板。sections 字段可提供其他页面版块可直接使用的选择器——不要猜测 CSS 选择器。
如果结果内容较少或包含 hint，请对同一 URL 重试一次，并设置 render=true，以便运行 JavaScript。这会额外消耗 5 个积分；首次请求时不要启用渲染。
将完整且未经修改的 code 值保存为 -.json 并提供给用户。经过编辑或缩短的 JSON 可能无法导入。
在 WordPress 中，通过 模板 → 已保存模板 → 导入模板 导入文件；随后在 Elementor 中打开页面，选择 添加模板 → 我的模板，并插入该版块。
发布前，请将源网站的文案、徽标和图片替换为已获授权的内容。

配置指南

此技能需要访问 MiroMiro，可通过已连接的工具或其 REST API 使用。如果用户没有 API 密钥，请引导他们访问 https://miromiro.app/api/onboarding；该服务每月提供 300 个积分，无需银行卡。向用户索取其密钥；切勿编造密钥。每次提取消耗 25 个积分，JavaScript 渲染重试会额外消耗 5 个积分。
REST API 示例：
curl -s "https://miromiro.app/api/v1/code?url=stripe.com&section=pricing&framework=elementor"
-H "Authorization: Bearer $MIROMIRO_API_KEY" 要提取主视觉区，请省略 section 参数。如果源网站提供深色版本，并且你希望请求该版本，请在工具请求中使用 theme: "dark"。响应中的 theme 字段会标明返回的版本。提取后，将完整的 code 值保存为 .json 文件，并通过 模板 → 已保存模板 → 导入模板 将其导入 WordPress。在 Elementor 中，通过 添加模板 → 我的模板 插入。

数据架构

提取响应会提供模板及相关元数据：
字段或值 用途
code 完整的 Elementor 模板 JSON。交付和保存时不得编辑或删减。
css 按设计为 null；样式已包含在模板中。
sections 可用的页面版块，包括后续调用可直接使用的选择器。
theme 指明返回的是哪个主题版本，例如在请求且可用时返回的深色版本。
section 可选的版块名称：hero、header、footer、pricing、features、testimonials、faq 或 cta。
输出文件名 保存为 -.json。
导入的版块是一个带样式的 HTML 区块，而不是多个独立的原生 Elementor 小工具。用户可以在该区块的 HTML 中编辑文本和图片。版块包含响应式和悬停样式，且 CSS 使用作用域限定，以避免与 WordPress 主题冲突。

高级特性

从线上页面提取解析后的样式，包括颜色、字体、间距、响应式规则和悬停状态。
支持按名称提取版块，并返回可用版块及用于其他请求的现成选择器。
当初始结果内容较少或包含提示时，可选择使用
render=true
重试，以运行 JavaScript；重试额外消耗 5 个积分。
如果源网站提供深色主题，可返回深色主题；响应中的
theme
字段会报告所选版本。
支持用于非 WordPress 项目的其他输出框架——
tailwind
、
html
、
jsx
vue
；每次提取消耗 25 个积分。
在 Elementor 模板中嵌入作用域限定的样式，以降低其与网站主题冲突的可能性。
支持已连接的 MiroMiro 工具，或使用
MIROMIRO_API_KEY
直接进行经过身份验证的 REST API 调用。

name: elementor-section description: Turn a section of any live website into an Elementor template the user imports into WordPress. Use when the user builds with WordPress or Elementor and wants a hero, pricing table, header, footer, features, testimonials, FAQ or CTA "like " on their own site, or asks for an Elementor template or JSON from a website. homepage: https://miromiro.app/api/html-to-elementor-api