技能 wordpress-theme-development
🎨

wordpress-theme-development

安全

使用現代區塊支援建立 WordPress 主題

透過結構化的工作流程簡化 WordPress 主題開發，涵蓋主題架構、範本層級和 Gutenberg 區塊編輯器整合。按照 WordPress 最佳實踐，從建立專案結構到測試，建立響應式且無障礙的主題。

支援: Claude Codex Code(CC)
📊 69 充足
1

下載技能 ZIP

2

在 Claude 中上傳

前往 設定 → 功能 → 技能 → 上傳技能

3

開啟並開始使用

測試它

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

預期結果:

I'll help you set up a WordPress theme with Gutenberg support. First, let me create the basic theme structure:

- Theme directory: your-theme/
- Core files: style.css, functions.php, index.php
- Template files: header.php, footer.php, single.php, page.php
- Block support: theme.json with block settings

I'll start by creating style.css with proper theme headers and theme.json for block editor configuration.

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

預期結果:

I'll register a Portfolio custom post type for your theme. Here's what I'll include:

- Post type slug: 'portfolio'
- Supports: title, editor, thumbnail, excerpt
- Custom taxonomy: 'portfolio_category'
- Archive template: archive-portfolio.php
- Single template: single-portfolio.php

Let me add the registration code to functions.php and create the necessary template files.

安全審計

安全
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
內容
23
社群
100
安全
83
規範符合性

你能建構什麼

建立自訂 WordPress 主題

從頭開始為客戶專案設計和建立獨特的 WordPress 主題，包含自訂範本、樣式和區塊編輯器支援。

將 HTML 設計轉換為 WordPress

將現有的 HTML/CSS 設計轉換為功能完整的 WordPress 主題，包含正確的範本層級和動態內容。

新增區塊編輯器支援

透過新增 Gutenberg 區塊支援、自訂區塊模式和區塊範本，讓現有的 WordPress 主題現代化。

試試這些提示

開始新的 WordPress 主題 
幫我建立一個名為 '{theme_name}' 的新 WordPress 主題，支援現代區塊編輯器。設定基本目錄結構、含主題標頭的 style.css，以及含基本主題支援功能的 functions.php。
建立自訂範本檔案 
為我的主題建立 WordPress 範本檔案，包括 single.php、page.php、archive.php，以及 '{custom_post_type}' 文章的自訂範本。遵循 WordPress 範本層級最佳實踐。
註冊自訂文章類型 
註冊一個名為 '{post_type_slug}' 的自訂文章類型，支援 {features}。包含自訂分類法和中繼框，並建立對應的 archive 範本。
新增 Gutenberg 區塊支援 
為我的 WordPress 主題新增完整的 Gutenberg 區塊編輯器支援。啟用區塊樣式、註冊 {number} 個自訂區塊，並建立用於 {use_case} 的區塊模式。

最佳實務

  • 修改現有 WordPress 主題時務必使用子主題，以在更新時保留變更
  • 遵循 WordPress PHP、HTML、CSS 和 JavaScript 程式碼標準以確保相容性
  • 使用正確的檔案名稱和備用範本來實作適當的範本層級
  • 在多個瀏覽器和裝置上測試主題，以確保響應式設計正常運作

避免

  • 避免直接編輯父主題檔案 - 始終使用子主題或自訂外掛進行修改
  • 切勿硬編碼絕對 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 範本，可能只有有限的區塊支援。選擇區塊主題以充分利用全站編輯功能進行新專案。
建立 WordPress 主題需要會 PHP 嗎？
是的，PHP 知識對主題開發至關重要。您需要 PHP 來建立範本檔案、註冊主題功能、載入資產，以及與 WordPress API 互動。簡單的主題只需要基本 PHP 技能，进阶主题需要更深入的理解。
如何確保我的主題與頁面建置器相容？
大多數頁面建置器可與任何正確編碼的 WordPress 主題配合使用。確保您的主題有正確的包裝標記、使用 WordPress CSS 類別，且不會干擾內容篩選器。請與特定的頁面建置器進行測試以驗證相容性。
我可以將 Bootstrap 或 Tailwind 等 CSS 框架與 WordPress 主題一起使用嗎？
是的，您可以整合任何 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