Communitygithub.com

emdash-cms/emdash

WordPressテーマのデザインとテンプレート動作を、EmDashを搭載したAstroサイトに移植します。テーマの移行、デザインの一致、PHPテンプレートの変換、CMS配線に使用します。サイトのテーマに影響を与えないWordPressプラグインの動作には使用しないでください。

emdash とは?

このスキルは、WordPressテーマのデザインとテンプレート動作をEmDashを搭載したAstroサイトに移植するために設計されています。ユーザーが要求する視覚的な忠実度と機能範囲を維持しつつ、すべてのWordPressテンプレートやデモ機能をそのまま移植するわけではありません。主なユースケースは、テーマの移行、デザインの一致、PHPテンプレートの変換、CMS配線です。サポートされるプラットフォームは、EmDashをバックエンドとするAstroサイトです。スキルは、テーマソース、`theme.json`、スタイルシート、テンプレート、`functions.php`などの証拠に基づいて作業を進めます。PHPテンプレートはAstroのルート、レイアウト、コンポーネントに、カスタム投稿タイプとメタデータはEmDashのコレクションとフィールドにマッピングされます。作業は発見、デザイン抽出、テンプレート変換、動的機能、シードデータ、検証の各フェーズに分けて行われます。結果の検証では、ビルド後に該当するすべてのページとインタラクションをテストし、参照と比較します。

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

お気に入りのAIに質問する

このエージェントスキルを事前に読み込んだ状態で新しいチャットを開きます。

ドキュメント

WordPressテーマをEmDashに移植する

テーマの該当するレイアウトとインタラクションを、EmDashをバックエンドとするAstroサイトとして再現します。ユーザーが要求する視覚的な忠実度と機能範囲を維持し、すべてのWordPressテンプレートやデモ機能が移植先に属するとは想定しないでください。

現在のEmDashのスキーマ、クエリ、レンダリング、キャッシュ、シードパターンについては building-emdash-site を読み込んでください。ライブの参照サイトが利用可能な場合は、レンダリング比較に 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、関連する空の状態やエラー状態が含まれます。

視覚的な忠実度が受け入れ基準の一部である場合は、before/afterまたは参照/結果のスクリーンショットをキャプチャしてください。意図的な逸脱、欠落しているソース証拠、サポートされていないWordPressの動作、アセットの代替について報告してください。

ライセンスと帰属

ソーステーマの実際のライセンスと通知を確認してください。必要な著作権と帰属を保持し、再利用されたコードには該当するライセンステキストを含め、サードパーティのアセットは個別に識別してください。ソースがWordPressテーマであるという理由だけで、移植先をGPL-2.0-or-laterとラベル付けしないでください。

Individual skills in this repo

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

関連スキル