SuperAPI AI 工具集

html-to-generateblocks

前端与建站

查看项目

更新于 10-16 06:48

技能介绍

用途:把现有 HTML/CSS 布局转换为 GenerateBlocks V2 区块标记,样式通过区块属性内联,而非自定义类名。

主要能力:使用 generateblocks/element 承载布局容器与卡片,generateblocks/text 承载标题、段落、纯文本链接,generateblocks/media 承载图片,generateblocks/shape 承载 SVG 图标;对视频、音频、iframe、表格、引用、代码、列表、分隔线、画廊、封面等特殊内容改用 WordPress 核心区块。支持响应式媒体查询、伪元素、动画与父级悬停子元素等复杂样式。

使用方式:转换结果始终写入文件,命名为 {original-name}-converted.html,大型转换按区块拆分多文件,聊天中仅给简要说明。样式同时写入 styles 与 css 两个属性:styles 放基础属性并支持 "@media (max-width:1024px)" 等响应式键;css 只放基础样式(按字母排序、压缩为单行)及伪元素、媒体查询、动画、父级悬停子元素等例外,不得包含 hover 状态与过渡。htmlAttributes 必须是普通对象而非对象数组,媒体区块的 linkHtmlAttributes 仍用数组格式。唯一 ID 采用 {section}{number}{letter} 约定。

适用场景:将静态页面或组件迁移到 WordPress GenerateBlocks V2,含卡片、网格、图标按钮、徽章、动态文章查询等。

限制:资料未提供安装命令、收费、平台要求与效果数据;需自行核对转换结果在区块编辑器中的表现。