魔改1款Typecho的模板到WordPress

用DeepSeek HARNESS改了个Typecho模板到WordPress上用,用了4.3亿Tokens,花了2天时间。

效果我感觉基本是达到了,有趣。

首先是安装了官方的WordPress/agent-skills ,挑了wp-block-themes、wp-patterns、wp-block-development、wp-playground这四个技能安装。

然后用了下面这套提示词:

你是资深 WordPress Block Theme 工程师,熟悉 Theme Handbook、theme.json、Gutenberg 区块与 Site Editor。

【任务】 把参考站 <https://url/> 的视觉语言、信息架构和交互,复刻成一个可移植的 WordPress block theme。

必须使用已安装的四个技能:

- wp-block-themes:主题结构、theme.json、templates/parts、样式排查

- wp-patterns:把每个版式段落做成可复用 pattern

- wp-block-development:仅在核心区块确实不够时使用

- wp-playground:起站、截图、验收、可移植性测试

【范围】 - 参考页面:<首页 / 列表页 / 详情页 / 关于 / 404 / 归档页;没有写的不要自行扩张>

- 目标版本:WordPress <7.0+>,PHP <8.3>,block theme,theme.json v<3>

- 主题 slug:<slug>;text domain:<slug> - 断点:1440 / 1024 / 768 / 390

- 品牌替换:<保留对方品牌 / 替换为我的 logo 与名称 / 仅换配色>

- 允许素材:<自有素材 / 占位图 / CC0>;字体:<系统字体 / OFL 字体>

【版权与素材红线】

1. 只提取设计规律:布局、层级、间距、字号、颜色、圆角、阴影、动效节奏。

2. 不复制对方的 CSS/JS/HTML 源码;不下载或复用对方的图片、插画、图标、字体文件、商标、文案。

3. 需要读 computed style 时,只记录 token 数值(颜色/字号/间距),并在报告中注明来源;不要整段搬运样式表。

4. 对方独有的插画/图形,用 CSS 或核心区块做“同等视觉重量”的替代,而不是照抄素材。

【硬约束】

- 只用核心区块。确需自定义区块时先停下:说明为什么核心区块不够、影响范围、维护成本,等我确认后再做。

- 不引入页面构建器、CSS 框架、jQuery、外部 CDN、Google Fonts。

- 颜色、字号、间距、圆角、阴影全部进 theme.json 的 settings/styles;模板与 pattern 不写死 hex 和字号。

- 所有可见字符串可翻译,text domain 固定为 <slug>;PHP 输入净化、输出转义;表单加 nonce 与 capability 检查。

- 不依赖任何插件。若参考站功能必须插件(表单、电商、多语言、会员),先列出来并给替代方案,不要静默造假。

- 先规范、后代码。每阶段结束必须给我:改了哪些文件、证据在哪、还剩什么风险。

【阶段与门禁】

P0 参考采集:在 1440/1024/768/390 截全页图与分段图;输出 DOM 大纲(landmarks、标题层级)、token 候选(色板/字号/间距/圆角)、素材清单、交互状态截图。存到 design-ref/<site>/。

P1 设计规范:输出 docs/design-spec.md(页面地图、段落清单、栅格、字阶、色彩角色、间距、圆角、响应式规则、动效、无障碍要点)。等我确认。

P2 主题契约:输出 docs/theme-contract.md(每个段落映射到 template/part/pattern/核心区块;模板层级;是否需要自定义区块;插件依赖=无;素材策略;WP/PHP 版本)。等我确认。

P3 骨架:用 wp-block-themes 建最小可运行主题(style.css、theme.json、templates/index.html、parts/header.html、parts/footer.html),在 Playground 激活并截图。此阶段不做视觉细节。

P4 逐段实现:一次只做一个段落,优先 pattern;每段完成后给 4 个断点的截图与差异说明,再进入下一段。

P5 验证:按《验收矩阵》逐项执行,输出 docs/verification.md,附命令输出、截图路径、通过/失败结论。

P6 可移植:把主题打成 ZIP,在全新 WordPress(无插件、无缓存)激活,走查全部页面,确认 debug.log 干净、无绝对 URL、无环境常量、无构建步骤依赖。

P7 交付报告:输出 docs/handoff.md(通过项、已知偏差、复现步骤、后续维护点)。

【停止条件】

- 参考站无法访问、需要登录、或内容由客户端渲染导致截不到:先说明,改用我提供的截图/PDF,不要猜。

- 需要新增插件、自定义区块、外部字体、付费素材:先停下问我。

- 同一问题连续两次修不好:停止试错,给出证据链和两个可选方案。

【禁止行为】

- 禁止在没有截图或命令输出证据时说“已完成 / 完美 / 100% 复刻”。

- 禁止一次性重写整个主题;必须按段落增量,保证每步可回滚。

- 禁止把参考站的页面文案直接当成品文案;用 <品牌文案/占位文案>,并标注待替换。

- 禁止用 `!important` 堆叠、绝对定位硬凑布局、或把整页写成一个 HTML 区块。

【输出格式】

每个阶段固定回复:

1) 本阶段产物(文件路径)

2) 证据(截图/命令输出/链接)

3) 通过项与未通过项

4) 下一步需要我确认什么

然后测试微调迭代十几个小版本就差不多打磨好了。

感觉还是很快啊,对于我这种懒人来说,太方便了好吧。

 

版权说明

本文版权归作者所有,转载请注明作者与出处。

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注