EmDash テーマは、ページ・レイアウト・コンポーネント・スタイルを含む完全な Astro サイトであり、create-astro 経由で配布されます。初回起動時にコレクション、フィールド、メニュー、リダイレクト、サンプルコンテンツでデータベースを初期化する シードファイル も含みます。
テーマが提供するもの
テーマは、次を備えた動作する Astro プロジェクトです。
- Pages — コンテンツを描画する Astro ルート（ホーム、ブログ記事、アーカイブなど）
- Layouts — 共有の HTML 構造
- Components — 再利用可能な UI（ナビゲーション、カード、フッターなど）
- Styles — CSS または Tailwind の設定
- シードファイル — CMS に作成するコンテンツ型とフィールドを伝える JSON
テーマの構造
my-theme/
├── package.json # テーマのメタデータ + EmDash 設定
├── astro.config.mjs # Astro インテグレーションの設定
├── src/
│ ├── live.config.ts # Live Collections の設定
│ ├── pages/ # Astro ルート
│ ├── layouts/ # レイアウトコンポーネント
│ └── components/ # UI コンポーネント
└── .emdash/
├── seed.json # スキーマ + サンプルコンテンツ
└── uploads/ # 任意のローカルメディアテーマによるサイトのブートストラップ
テーマからサイトを作成すると、次のようになります。
create-astroがテンプレートからプロジェクトを足場組みしますnpm installとnpm run devを実行します- 管理画面への初回アクセスで セットアップウィザード が自動で動きます
- ウィザードがシードファイルを適用し、コレクション、メニュー、リダイレクト、コンテンツを作成します
- サイトの利用を開始できます
利用者向け
テーマを選び、ウィザードを進め、編集を始めます。データベースの知識は不要です。
開発者向け
テーマは標準の Astro プロジェクトです。足場組み後に自由にカスタマイズできます。
テーマのインストール
create-astro にテンプレートを指定します。
npm create astro@latest -- --template @emdash-cms/template-blogコミュニティテーマは GitHub 経由です。
npm create astro@latest -- --template github:user/emdash-portfolioインストール後:
cd my-site
npm install
npm run devセットアップウィザードを完了するには http://localhost:4321/_emdash/admin を開きます。
セットアップウィザード
セットアップウィザードは管理画面への初回アクセス時に自動で実行されます。次のことを行います。
- サイトのタイトル、タグライン、管理者の認証情報を入力します
- サンプルコンテンツを含めるかどうかを選択できます
- シードファイルをデータベースに適用します
- 管理ダッシュボードへリダイレクトします
┌────────────────────────────────────────────────────────┐
│ │
│ ◆ EmDash │
│ │
│ 新しいサイトへようこそ │
│ │
│ サイトタイトル: [すごいブログ ] │
│ タグライン: [思考とアイデア ] │
│ │
│ 管理者メール: [[email protected] ] │
│ 管理者パスワード: [•••••••••••• ] │
│ │
│ ☑ サンプルコンテンツを含める │
│ │
│ [サイトを作成 →] │
│ │
│ テンプレート: Blog Starter │
│ 作成内容: コレクション 2、ページ 3、投稿 1 │
└────────────────────────────────────────────────────────┘公式テーマ
EmDash には公式のスターターテーマがあり、それぞれローカル（SQLite + ファイルシステム）版と Cloudflare（D1 + R2）版があります。
| テーマ | 説明 | 用途 |
|---|---|---|
@emdash-cms/template-blog | 投稿・ページ・カテゴリ・ダークモード付きのミニマルなブログ | 個人ブログ、シンプルなサイト |
@emdash-cms/template-portfolio | プロジェクト、セリフ体（Playfair Display）、画像重視レイアウトの編集者向けポートフォリオ | フリーランス、代理店、クリエイター |
@emdash-cms/template-marketing | カスタム Portable Text ブロック（ヒーロー、機能、お客様の声、料金、FAQ）の力強いマーケサイト | ランディング、SaaS、プロダクトマーケ |
Cloudflare 版
Cloudflare Pages（D1 + R2）向けにデプロイする場合は、テンプレート名の末尾に -cloudflare を付けます。
npm create astro@latest -- --template @emdash-cms/template-blog-cloudflare
npm create astro@latest -- --template @emdash-cms/template-portfolio-cloudflare
npm create astro@latest -- --template @emdash-cms/template-marketing-cloudflareこれらのバリアントにはデプロイ設定用の wrangler.jsonc が含まれます。
インストール後のカスタマイズ
セットアップウィザードが終わると、サイトは通常の Astro プロジェクトです。他の Astro サイトと同様に編集できます。
src/pages/のページを編集するsrc/layouts/のレイアウトを変更する- 管理 UI からコレクションを追加する
- Astro インテグレーションをインストールする
- Astro が動く環境ならどこへでもデプロイする
シードファイルは初回セットアップ時のみ使われます。適用後、スキーマはデータベースに保存されます。