Communitygithub.com

emdash-cms/emdash

將 WordPress 主題的設計與模板行為移植到由 EmDash 驅動的 Astro 網站。適用於主題遷移、設計匹配、PHP 模板轉換與 CMS 串接。請勿用於不影響網站主題的 WordPress 外掛行為。

emdash 是什麼?

此技能專門協助開發者將 WordPress 主題遷移至 EmDash 驅動的 Astro 網站。它會引導使用者按階段進行移植,包括盤點所需頁面類型、元件、響應式狀態與互動,並將 WordPress 的 PHP 模板、自訂文章類型、選單、小工具等概念對應至 EmDash 與 Astro 的實作方式。此技能支援透過即時網站、螢幕截圖或設計檔案進行視覺比對,以確保視覺忠實度。由於動態 EmDash 內容路由必須保持伺服器端渲染,因此它使用 EmDash 的 Image 元件處理媒體欄位,而一般主題素材則可透過 Astro 的資產處理功能管理。最終會驗證所有涵蓋範圍內的頁面與互動,並在必要時擷取參考與結果的螢幕截圖,同時記錄已知的偏差與資產替代方案。作業全程需注意授權與歸屬規範,確保僅在許可範圍內重用素材。

相容平台✓Claude Code~Codex CLI~Cursor
npx skills add https://github.com/emdash-cms/emdash/tree/HEAD/skills/wordpress-theme-to-emdash

在你喜歡的 AI 中提問

開啟一個已預先載入此 Agent Skill 的新對話。

說明文件

將 WordPress 主題移植至 EmDash

以 EmDash 作為後端,將主題相關的版面配置與互動重建成為 Astro 網站。保留使用者要求的視覺忠實度與功能範圍;請勿假設每個 WordPress 模板或示範功能都屬於移植範圍。

載入 building-emdash-site 以取得目前的 EmDash 綱要、查詢、渲染、快取與種子資料模式。當有即時參考網站可用時,使用 agent-browser CLI 進行渲染比對;執行 agent-browser skills get core --full 即可取得其指令參考。

選擇證據

請依此順序使用最佳可用來源:

  1. 主題原始碼與 theme.json、樣式表、模板以及 functions.php;
  2. 在代表性的桌上型與行動裝置檢視區下的即時示範網站;
  3. 使用者提供的螢幕截圖或設計檔案;
  4. 當來源不明確時,明確的設計決策。

請勿推斷示範內容或影像與主題程式碼共享授權。僅在授權或使用者的權利允許時才重複使用素材;否則應使用具有類似尺寸與視覺權重、且授權清楚的替代素材。

規劃移植

僅盤點所請求網站需要的頁面類型、元件、響應式狀態與互動。在實作前先對應 WordPress 的責任範圍:

  • PHP 模板轉換為 Astro 路由、佈局與元件。
  • 自訂文章類型、中繼資料與分類法轉換為 EmDash 集合、欄位與分類法。
  • 主題自訂器值轉換為網站設定或明確的專案設定。
  • 選單位置轉換為由模板查詢的具名 EmDash 選單。
  • 側邊欄與小工具轉換為小工具區域或一般的 Astro 元件。
  • 短代碼與外掛擁有的行為可能需要單獨的外掛遷移。

在轉換模板階層、functions.php 註冊、模板標籤、掛勾、小工具或可重複使用區塊時,請閱讀 WordPress 主題概念對應。

動態 EmDash 內容路由必須保持伺服器端渲染。對 EmDash 媒體欄位使用 EmDash Image 元件;一般主題素材可使用 Astro 的資產處理功能。

分階段工作

僅在該階段適用時才讀取階段檔案:

建立獨立主題專案時,從儲存庫目前的網站模板或使用者的現有專案開始。在寫入前確認目標位置,且未經明確指示不得取代現有網站結構。

驗證結果

建置網站並測試每個涵蓋範圍內的頁面與互動。將比對後的檢視區與參考進行比較,包括響應式導覽、含有長值與遺失值的內容、當管理介面或主題行為依賴方向時的 RTL,以及相關的空狀態或錯誤狀態。

當視覺忠實度屬於驗收條件的一部分時,擷取前後對比或參考與結果的螢幕截圖。回報刻意偏離、遺失的來源證據、不支援的 WordPress 行為以及資產替代情況。

授權與歸屬

檢查原始主題的實際授權與注意事項。保留必要的版權與歸屬資訊,對重複使用的程式碼包含適用的授權條款,並分別標識第三方素材。請勿僅因來源是 WordPress 主題就將移植標記為 GPL-2.0-or-later。

Individual skills in this repo

This repo contains 1 individual skill — each has its own dedicated page.

相關技能