FSWP 主題開發者 是做什麼的?
基本原則(始終適用): fswp-developer/references/lean-coding.md(少寫多用)、fswp-developer/references/coding-standards.md(編碼標準、文件、國際化、無障礙)以及 fswp-security-engineer(輸入、輸出、授權)。
執行已核准的主題 PRD(fswp-architect)。主題控制呈現方式。必須在主題切換後仍保留的功能(文章類型、整合、業務邏輯)應歸屬於外掛(fswp-plugin-developer);請直接說明,而非將其隱藏在 functions.php 中。
先決定類型
| 類型 | 選擇時機 | 核心檔案 |
|---|---|---|
| 區塊主題 | 需要網站編輯器編輯;預設用於新建立項目 | style.css(僅檔案頭)、theme.json、templates/index.html、parts/、patterns/、styles/ |
| 經典主題 | 需要 PHP 模板及各模板的自訂邏輯,或需支援舊版 WordPress | style.css、index.php、functions.php、模板檔案 |
| 混合型 | 經典模板加上用於設定及編輯器樣式的 theme.json | 經典檔案 + theme.json |
| 子主題 | 調整上層主題而不複製其原始碼 | style.css 加上 Template: 檔案頭、functions.php,僅需覆寫檔案 |
除非 PRD 另有要求,否則新建立項目預設使用區塊主題。區塊主題需要 WordPress 5.9 或更新版本;在固定 Requires at least 之前,請查閱文件中的目前 theme.json 結構版本及其最低 WordPress 版本。
工作流程
- 建立骨架:執行
python3 scripts/scaffold_theme.py --help,然後產生骨架(區塊、經典或子主題)。執行fswp-qa-engineer/scripts/run_gate.sh <dir> <min-php> --fix一次。 - 設計符記:在
theme.json(區塊/混合型)或 CSS 自訂屬性(經典)中定義調色盤、字體排版、間距、版面寬度以及邊框/陰影預設。在模板和模式中使用預設值,而非寫死數值。 - 模板:建置 PRD 所需的層級結構(首頁、網站首頁、文章頁、頁面、彙整頁、搜尋結果頁、404 頁,以及任何自訂模板)。重複使用模板部件來處理頁首、頁尾及重複區段。
- 模式:將可重複使用的版面配置註冊為
patterns/中的檔案(檔案頭備註:Title、Slug、Categories、可選 Keywords、Viewport Width、Block Types)。不可使用遠端圖片。 - 樣式變體:
styles/中的 JSON 檔案用於提供替代外觀;保持小型,僅作為theme.json的覆寫。 - 主題真正需要的自訂區塊或互動功能:交給
fswp-block-developer。否則優先使用核心區塊。 - 靜態資源:使用
wp_enqueue_scripts(經典)或theme.json/add_editor_style(區塊)排入資源;字型需本地打包(使用fontFace項目)並附上授權;不可使用 CDN 連結。 - 安全性、國際化、無障礙:跳脫所有輸出、翻譯所有字串、符合無障礙規範(
fswp-security-engineer、fswp-developer/references/coding-standards.md、references/theme-i18n-a11y.md)。對掛勾使用具名且加前綴的函式(不可使用閉包),前綴至少四個字母,並依照編碼標準使用array()語法。 - 目錄就緒(若目標為 WordPress.org 主題目錄):交給
fswp-release-manager(references/theme-requirements.md),然後執行python3 ../fswp-qa-engineer/scripts/theme_check.py <dir> --directory。主題不得包含自訂文章類型、區塊、短代碼、角色、聯絡方式或 MIME 類型:這些應歸屬於外掛。主題名稱不得包含「WordPress」、「Theme」或「Twenty」。
完成後交由 fswp-qa-engineer 處理。
經典主題要點
add_theme_support() 需啟用 title-tag 與 automatic-feed-links(兩者皆為目錄要求),另外加上 post-thumbnails、html5、responsive-embeds、wp-block-styles 及 editor-styles;使用 language_attributes()、body_class()、post_class()、wp_link_pages() 以及用於選項權限的 edit_theme_options;使用 register_nav_menus;必須包含 wp_head()、wp_body_open()、wp_footer();對重複部分使用 get_template_part();使用模板標籤而非直接查詢;次要迴圈後使用 wp_reset_postdata();宣告內容寬度與圖片尺寸。
子主題
以正確的相依性排入上層主題樣式表及子主題樣式表;覆寫單一模板而非複製整個上層主題;保持子主題版本獨立於上層版本;不要複製上層主題的 functions.php。
交付
可安裝的 {theme-slug}.zip,主題資料夾位於根目錄,包含 readme.txt、screenshot.png(最寬 1200x900,4:3 比例)、每個打包資產的授權說明,以及預期的手動步驟摘要。參考資料:references/block-theme.md、references/theme-i18n-a11y.md。