技能 wordpress-theme-development
🎨

wordpress-theme-development

安全

使用现代区块���持构建 WordPress 主题

通过结构化工作流程简化 WordPress 主题开发，涵盖主题架构、模板层次和古腾堡区块编辑器集成。遵循 WordPress 最佳实践，从脚手架搭建到测试，创建响应式、可访问的主题。

支持: Claude Codex Code(CC)
🥉 73 青铜
1

下载技能 ZIP

2

在 Claude 中上传

前往 设置 → 功能 → 技能 → 上传技能

3

开启并开始使用

测试它

正在使用“wordpress-theme-development”。 Help me create a WordPress theme structure with block editor support

预期结果:

我会帮你设置一个支持 Gutenberg 的 WordPress 主题。首先，让我创建基本主题结构：

- 主题目录：your-theme/
- 核心文件：style.css、functions.php、index.php
- 模板文件：header.php、footer.php、single.php、page.php
- 区块支持：包含区块设置的 theme.json

我将首先创建带有正确主题头信息的 style.css 和用于区块编辑器配置的 theme.json。

正在使用“wordpress-theme-development”。 Register a custom post type for Portfolio items

预期结果:

我会为你的主题注册一个作品集自定义文章类型。以下是我将包含的内容：

- 文章���型标识符：'portfolio'
- 支持功能：title、editor、thumbnail、excerpt
- 自定义分类法：'portfolio_category'
- 存��模板：archive-portfolio.php
- 单页模板：single-portfolio.php

让我将注册代码添加到 functions.php 并创建必要的模板文件。

安全审计

安全
v1 • 2/25/2026

Static analysis detected 40 potential issues (28 external_commands, 12 blocker patterns). All findings are false positives. The 'external_commands' detections are backtick characters in markdown code blocks used for skill invocation examples (e.g., @app-builder, @frontend-developer), not actual shell command executions. The 'blocker' patterns are matches on the word 'block' referring to Gutenberg editor blocks, not cryptographic weaknesses. This is a legitimate WordPress theme development workflow skill with no malicious intent or security risks.

1
已扫描文件
190
分析行数
1
发现项
1
审计总数
低风险问题 (1)
SKILL.md:31-32SKILL.md:42-44SKILL.md:60-62SKILL.md:77-79SKILL.md:94-96SKILL.md:111-113SKILL.md:129-131SKILL.md:147-149
False Positive: Shell Command Patterns
Static scanner detected backtick characters in markdown code blocks as potential shell command execution. These are documentation examples showing skill invocations like @app-builder and @frontend-developer, not executable code.
审计者: claude

质量评分

38
架构
100
可维护性
87
内容
50
社区
100
安全
83
规范符合性

你能构建什么

创建自定义 WordPress 主题

从零开始设计和构建独特的 WordPress 主题，包含自定义模板、样式和区块编辑器支持，用于客户项目。

将 HTML 设计转换为 WordPress

将现有的 HTML/CSS 设计转换为功能完整的 WordPress 主题，包含正确的模板层次和动态内容。

添加区块编辑器支持

通过添加古腾堡区块支持、自定义区块模式和区块模板来现代化现有的 WordPress 主题。

试试这些提示

启动新的 WordPress 主题 
帮我创建一个名为 '{theme_name}' 的新 WordPress 主题，支持现代区块编辑器。设置基本目录结构、带有主题头信息的 style.css，以及包含基本主题支持功能的 functions.php。
创建自定义模板文件 
为我的主题创建 WordPress 模板文件，包括 single.php、page.php、archive.php，以及 '{custom_post_type}' 文章的自定义模板。遵循 WordPress 模板层次最佳实践。
注册自定义文章类型 
注册一个名为 '{post_type_slug}' 的自定义文章类型，支持 {features}。包含自定义分类法和元框，并创建相应的存档模板。
添加古腾堡区块支持 
为我的 WordPress 主题添加完整的古腾堡区块编辑器支持。启用区块样式，注册 {number} 个自定义区块，并为 {use_case} 创建区块模式。

最佳实践

  • 修改现有 WordPress 主题时始终使用子主题，以便在更新期间保留更改
  • 遵循 PHP、HTML、CSS 和 JavaScript 的 WordPress 编码标准以确保兼容性
  • 使用正确的文件名和后备模板实现适当的模板层次
  • 在多个浏览器和设备上测试主题，以确保响应式设计正常工作

避免

  • 避免直接编辑父主题文件 - 始终使用子主题或自定义插件进行修改
  • 永远不要硬编码绝对 URL 或路径 - 使用 WordPress 函数如 get_template_directory_uri() 和 home_url()
  • 不要使用 query_posts() 或 wp_reset_query() - 改用 WP_Query 或 pre_get_posts 过滤器
  • 除非绝对必要，否则避免注销核心 WordPress 脚本或样式

常见问题

WordPress 主题和插件有什么区别？
主题控制网站的外观和前端显示，而插件添加功能和特性。主题包含模板文件和资源，插件包含 PHP 函数和逻辑。使用主题进行展示，使用插件实现功能。
我应该使用经典主题还是区块主题？
区块主题是现代标准，通过 theme.json 和区块模板完全支持 Gutenberg 编辑器。经典主题使用 PHP 模板，区块支持可能有限。新项目应选择区块主题以利用全站编辑功能。
我需要懂 PHP 才能创建 WordPress 主题吗？
是的，PHP 知识对于主题开发至关重要。你需要 PHP 来创建模板文件、注册主题功能、排队加载资源以及与 WordPress API 交互。对于简单主题，基本的 PHP 技能就足够了，高级主题需要更深入的理解。
如何确保我的主题与页面构建器兼容？
大多数页面构建器可以与任何正确编码的 WordPress 主题配合使用。确保你的主题具有正确的包装标记、使用 WordPress CSS 类，并且不干扰内容过滤器。使用特定的页面构建器进行测试以验证兼容性。
我可以在 WordPress 主题中使用 Bootstrap 或 Tailwind 等 CSS 框架吗？
是的，你可以集成任何 CSS 框架。在 functions.php 中排队加载框架文件并覆盖默认的 WordPress 样式。请注意，某些框架可能与 WordPress 核心样式或区块编辑器输出冲突，因此请彻底测试。
如何使我的主题可访问并符合 WCAG 标准？
遵循 WordPress 可访问性指南：使用语义 HTML、正确的标题层次、ARIA 标签、键盘导航支持和足够的颜色对比度。使用可访问性工具进行测试，并确保所有交互元素都可以通过键盘访问。WordPress 核心提供了许多你应该利用的可访问性功能。

开发者详情

作者

sickn33

许可证

MIT

仓库

https://github.com/sickn33/antigravity-awesome-skills/tree/main/skills/wordpress-theme-development

引用

main

文件结构

📄 SKILL.md