Agent Skills
返回列表
💻

WordPress 区块主题脚手架

开发编程 更新于 2026.08.30

将以下提示词粘贴到你的 AI 对话框中:

请根据 https://skillhub.cn/install/skillhub.md 安装 @user_3c6cb52e/wordpress-block-theme-scaffolder

技能介绍

解决哪些具体问题

从零构建 WordPress 区块主题时,开发者常需手动搭建 theme.json 配置、编写区块模式注册逻辑、拆分模板部件文件,过程中易出现结构不规范、样式预设冲突、编辑器资源加载异常等问题。尤其对于全站编辑(FSE)场景,若 theme.json 的排版、颜色等预设未按 v3 规范配置,会导致前端渲染与编辑器预览不一致;若遗漏 wp_enqueue_block_editor_assets 集成,区块编辑器的自定义样式将无法正常加载。

核心能力与工作逻辑

该工具通过模板化结构生成解决上述痛点,核心流程分三步:

  • 生成 FSE 兼容的基础框架:自动创建 theme.json v3 配置文件,预置符合规范的全局样式、排版预设(如 typography.customFontSize)与颜色渐变规则,确保编辑器与前端样式统一。
  • 封装区块模式与模板部件:提供 register_block_pattern() 接口快速定义可复用区块组合,自动拆分 templates/ 与 parts/ 目录下的模板文件,支持页面级布局复用。
  • 集成编辑器资源加载:通过 wp_enqueue_block_editor_assets 钩子引入自定义样式与脚本,保障区块编辑器中实时预览与最终渲染一致。

适用边界与注意点

  • 依赖 Node.js 开发环境,需提前配置好本地开发工具链。
  • 仅覆盖区块主题的结构与样式基础,不涉及插件逻辑或自定义区块开发,复杂交互需额外编写 PHP 代码。
  • 生成的配置严格遵循 WordPress 官方 theme.json 规范,若需使用实验性 API,需自行调整配置文件。

使用场景

  • 接手企业官网改版,需要快速生成符合 FSE 规范的区块主题骨架并统一全站样式预设。
  • 为多个客户交付 WordPress 站点,需要复用相同的 `theme.json` 排版与颜色配置以减少重复配置时间。
  • 在现有主题中扩展自定义区块模式,需通过 `register_block_pattern()` 快速注册可复用布局片段。
  • 开发需要编辑器内实时预览的主题,需确保 `wp_enqueue_block_editor_assets` 正确加载自定义样式资源。

适合人员

  • 负责客户主题交付的前端开发者,需要快速产出符合规范的区块主题基础结构。
  • 维护多站点样式一致性的团队技术负责人,需要统一的 `theme.json` 预设方案。
  • 为现有主题扩展功能的 WordPress 工程师,需要快速注册自定义区块模式。
  • 专注主题性能优化的开发者,需要确保编辑器资源加载不拖慢页面速度。