用途:把 Figma 设计转换为干净、语义化的 GenerateBlocks V2 区块,用于 WordPress 建站。
主要能力:支持多种输入形式,包括截图/图片、Figma URL(有 Dev Mode 时可提取设计令牌)、复制的 CSS、设计规格和文字描述。转换流程先分析布局结构、排版、颜色、间距与视觉效果,再映射为 GenerateBlocks 区块(element、text、media、shape)或 WordPress 核心区块(image、gallery、video、embed、table、quote、code、list、cover、separator、file、paragraph)。
使用方式:输出始终写入文件而非聊天内联,文件名为 {design-name}.html,复杂设计按区块拆分为多个文件,并在聊天中给出简要说明。区块代码采用 WordPress 区块注释格式,需同时提供 styles 与 css 两个属性,css 为压缩并按字母排序,不含 hover 与过渡(由插件从 styles 生成)。htmlAttributes 必须为普通对象而非对象数组。uniqueId 采用 {section}{number}{letter} 格式,element 区块需带 className。
适用场景:将 Figma 中的 Hero、卡片、导航栏等常见版式转为 WordPress 区块,并补充响应式断点(1024px、768px、480px)与流体字号(clamp)。
限制:除 WordPress 区块分隔注释外,禁止添加任何其他 HTML 注释,否则会破坏区块编辑器。颜色不明确时使用资料中给出的默认回退值。具体收费、价格与平台支持情况暂未提供。