Agent Skills
› Automattic/studio
Automattic/studio
GitHub用于WordPress站点视觉标注的Agent技能。通过打开带标注工具的浏览器，让用户点击元素并反馈修改需求，Agent读取标注后利用WP-CLI和CSS进行样式或内容调整，并截图验证结果。
Install All Skills
npx skills add Automattic/studio --all -g -y
Skills in Collection (35)
用于WordPress站点视觉标注的Agent技能。通过打开带标注工具的浏览器，让用户点击元素并反馈修改需求，Agent读取标注后利用WP-CLI和CSS进行样式或内容调整，并截图验证结果。
用户希望直接点击网页元素以指出需要修复、微调或重新设计的具体位置
用户需要对网站前端界面进行可视化反馈和即时修改
npx skills add Automattic/studio --skill annotate -g -y
指导在 WordPress Studio 中编写可编辑的区块标记，规范使用核心区块、主题 CSS 及样式变体，限制 HTML 块和自定义类名，确保内容与布局符合区块主题最佳实践。
编写或编辑 WordPress 页面内容
创建模板或区块模式
生成 WordPress 区块标记
npx skills add Automattic/studio --skill block-content -g -y
提供WordPress.com及Pressable套餐、定价和功能层级查询。强制通过API获取实时数据，严禁凭记忆回答，确保价格与功能信息的准确性。
询问WordPress套餐名称或层级
查询具体套餐的价格
确认某功能在哪个套餐中可用
咨询升级建议
npx skills add Automattic/studio --skill hosting-plans-helper -g -y
指导在WordPress站点中生成AI图片的规范，包括规划、路径选择（主题资产或媒体库）、批量调用、撰写提示词及验证渲染效果。
需要为网站设计生成英雄图、封面、产品图等
准备调用 generate_images 工具前
npx skills add Automattic/studio --skill imagery -g -y
将Wix等封闭平台网站迁移至Studio WordPress，提取内容并重建为可编辑区块或高保真主题。
用户希望迁移、导入、解放或重建来自特定平台的网站
npx skills add Automattic/studio --skill liberate -g -y
对 WordPress 网站进行前端性能审计，测量 Core Web Vitals 和页面组成，并提供具体的优化建议。
用户需要评估网站加载速度
用户希望优化前端性能指标
npx skills add Automattic/studio --skill need-for-speed -g -y
指导在WordPress中为电商、表单、课程等核心块未覆盖的功能推荐并配置首选插件，遵循决策规则与发现工作流，优先使用插件提供的可编辑块而非原始HTML。
需要实现电商、商店或结账功能
需要创建联系表单或邮件订阅功能
需要在线课程、测验或投票调查功能
询问WordPress特定功能的插件解决方案
npx skills add Automattic/studio --skill plugin-recommendations -g -y
对WordPress站点进行页面SEO审计，识别缺失标签、结构问题等，并基于现有插件提供优先修复建议。
需要优化网站搜索引擎可见性
请求进行SEO审计或检查
npx skills add Automattic/studio --skill rank-me-up -g -y
在创建WordPress站点前，通过交互收集网站名称和布局偏好，生成包含功能及插件建议的站点规范，指导后续设计与开发。
用户请求创建新的WordPress站点
需要初始化站点配置或获取建站需求
npx skills add Automattic/studio --skill site-spec -g -y
AI驱动的WordPress分类法优化工具，自动分析站点文章，建议合并重复、归档废弃及新建分类，并重新归类文章。支持预览和日志记录，确保操作安全可控。
用户希望清理或优化WordPress网站的分类结构
需要合并重复分类或整理死分类
npx skills add Automattic/studio --skill taxonomist -g -y
指导网站或页面视觉方向规划与执行，涵盖布局、排版、色彩及动效设计。提供从美学定位到代码实现（如WordPress主题开发）的全流程规范，确保视觉表现力与技术实现的统一。
需要创建新网站或落地页的视觉方案
进行网站改版或重新设计
定义网站的配色、字体和动画系统
解决前端界面视觉一致性问题
npx skills add Automattic/studio --skill visual-design -g -y
用于验证和打磨网站视觉设计，通过截图与DOM检查诊断渲染问题并批量修复，确保页面符合预期。
网站构建或重新设计后的视觉验证
修复生成的站点外观不精致的问题
npx skills add Automattic/studio --skill visual-polish -g -y
用于通过 wpcom_request 工具远程管理 WordPress.com 站点，涵盖 API 命名空间选择、端点发现及内容、主题、插件等资源的增删改查操作。
需要查询或修改 WordPress.com 站点的文章、页面、媒体等资源
需要安装、激活/停用插件或切换主题
需要获取或更新站点设置和全局样式
npx skills add Automattic/studio --skill wpcom-remote-management -g -y
指导构建新平台适配器以从支持的网站提取内容。包括平台检测、内容发现与提取，以及通过API映射处理复杂场景，最终生成可接入现有流水线的工作适配器。
需要支持新的内容平台
为未适配的网站构建数据提取器
npx skills add Automattic/studio --skill adapt -g -y
提供从零创建WordPress自定义区块的模板与规范，涵盖静态、动态及交互式区块的开发指南。
需要从零开始生成新的WordPress区块文件
询问WordPress区块开发的最佳实践或模板结构
npx skills add Automattic/studio --skill creating-blocks -g -y
指导从零创建WordPress区块主题，强调首页设计、最小模板集及FSE兼容规范。
从零开始创建新的WordPress主题
生成符合规范的theme.json和模板文件
npx skills add Automattic/studio --skill creating-themes -g -y
基于HTML/CSS分析及脚手架数据，构建语义化设计基础JSON。优先使用聚合分析文件确定颜色、排版等角色，仅在歧义时调用截图辅助，确保设计资产可追溯且符合规范。
需要生成WordPress主题前的设计基础定义
处理liberate_design_foundation_scaffold输出的半成品
npx skills add Automattic/studio --skill design-foundations -g -y
用于排查数据提取失败或质量低下的问题，通过分析日志和探测源站定位根因。
提取大量页面失败
提取内容质量低
提取过程挂起或崩溃
npx skills add Automattic/studio --skill diagnose -g -y
提供修改现有WordPress区块的指导原则，强调先理解架构再修改、最小化变更范围，并规范了属性更新、动静转换及交互添加的具体步骤和文件操作要求。
用户请求修改现有的WordPress区块文件
需要调整区块属性或渲染逻辑时
npx skills add Automattic/studio --skill editing-blocks -g -y
提供修改现有WordPress块主题文件的指南，强调最小化变更、保持原有设计方向，并规定读取参考文件及谨慎使用编辑工具。
需要修改现有的WordPress主题文件
调整主题样式或模板但不创建新主题
npx skills add Automattic/studio --skill editing-themes -g -y
指导生成WordPress主题块模式，处理页面构建器内容映射。核心原则是严格保留源文本原文或占位，禁止改写、合成或推断任何可见文案，确保复制品的高保真度与数据真实性。
需要为WordPress主题创建块模式时
处理页面构建器导出的div结构并映射为标准区块时
涉及产品卡片、评论网格或应用下载等特定组件生成时
npx skills add Automattic/studio --skill generating-patterns -g -y
将网站或本地目录迁移至WordPress的别名技能，委托给liberate流程执行。
用户输入以/migrate开头的命令并附带URL或本地路径
需要将现有静态站点或本地文件导入WordPress
npx skills add Automattic/studio --skill migrate -g -y
分析本地静态网站中的JS数据或重复HTML卡片，生成data-model.json模型，以便将其转换为WordPress原生内容、分类和查询循环，同时保留原有样式。
静态网站包含由JavaScript填充的挂载容器
静态网站包含内嵌的数据数组渲染的内容列表
静态网站包含直接硬编码在HTML中的重复内容卡片
npx skills add Automattic/studio --skill model-local-data -g -y
针对WXR内容迁移的QA工具，逐页比对源站与提取内容，识别缺失文本、标题等并修复，生成健康评分和结构化报告。
qa
check extraction
compare content
verify extraction quality
npx skills add Automattic/studio --skill qa -g -y
作为design-qa的子代理，当其他修复手段无效时，将分歧的页面区块重建为符合规范的WordPress核心块标记。通过对比源HTML、截图和设计令牌，确保视觉一致性和内容无损输出。
设计QA流程中R1-R3修复失败后
需要将特定HTML/截图区块重构为标准WordPress核心块
npx skills add Automattic/studio --skill rebuild-section -g -y
用于检查 JavaScript 文件语法错误的技能。通过查找 JS 文件并使用 Node.js 的 --check 命令验证语法，自动修复最多3轮语法错误，确保不修改业务逻辑，最终输出 PASS/FAIL 报告。
需要检查 JavaScript 文件是否存在语法错误
验证代码库中 JS 文件的语法正确性
npx skills add Automattic/studio --skill testing-js -g -y
用于检测 PHP 文件语法错误的技能。通过 find 命令定位文件，使用 php -l 检查语法，自动修复并验证，最多3轮循环，仅修正语法错误，不修改业务逻辑，最后输出 PASS/FAIL 报告。
用户要求检查 PHP 代码语法
需要批量验证项目内 PHP 文件是否存在语法错误
npx skills add Automattic/studio --skill testing-php -g -y
用于使用 wp-now 在运行时验证 WordPress 插件和主题的加载情况，包括启动服务、检查 PHP 错误日志及 HTTP 响应状态。
验证 WordPress 插件或主题在运行时的加载正确性
检查 WordPress 环境下的运行时错误
npx skills add Automattic/studio --skill testing-wp-runtime -g -y
用于管理本地 WordPress 站点的 CLI 工具技能，涵盖站点创建、启停、配置及故障排查。
需要创建或管理本地 WordPress 站点
查询站点状态或配置信息
使用 Studio CLI 进行站点操作
npx skills add Automattic/studio --skill studio-cli -g -y
将渲染后的HTML和截图转换为WordPress块编辑器标记，确保内容源自源文件并应用设计基础令牌。
需要将原始HTML升级为WordPress块标记
页面导入后需生成post_content
npx skills add Automattic/studio --skill compose-page-blocks -g -y
用于主题复刻后的视觉质量检查循环。通过截图对比、响应式测试及无障碍审查，驱动自动化修复流程，确保副本与源站像素级一致，未解决差异则升级上报。
主题安装与内容导入后
需要验证复刻站点视觉一致性时
npx skills add Automattic/studio --skill design-qa -g -y
通过两阶段流程实现页面视觉与设计稿的对齐：先全页测量差异，再迭代修复偏差区块。支持基于日志的重播与验证，确保重构后设计一致性。
需要验证或修复前端页面的视觉设计与源截图的一致性
执行自动化设计质量保证（Design QA）任务
npx skills add Automattic/studio --skill match-page -g -y
通过AI视觉对比循环，将WordPress区块标记调整为与源站设计完全一致，修复颜色、间距等视觉差异并生成审计报告。
需要修复单个网页区块的视觉还原度
执行match-page流程中的单区块精细化调整
npx skills add Automattic/studio --skill match-section -g -y
用于将源网站HTML近乎原样复制并作用域化CSS，生成高保真但不可块编辑的WordPress主题。在/liberate捕获后触发，以视觉还原度为核心目标。
用户选择“主题复制”功能
要求保留原始HTML结构
需要对源站CSS进行隔离处理
npx skills add Automattic/studio --skill replicate-theme -g -y
驱动基于规范的整站区块主题重建流程，将提取的站点还原为响应式可编辑的WordPress块主题，确保布局、内容与视觉设计的高度一致。
用户要求“重建此站点”或“复制设计”
需要生成匹配源站布局的WordPress版本
对已提取的站点重新应用主题
npx skills add Automattic/studio --skill replicate-with-blocks -g -y
