Skip to content

Commit 2579547

Browse files
authored
docs: correct migration and theme guides (emdash-cms#3038)
* docs: correct migration and theme guides * docs: keep screenshot updates separate
1 parent 6383623 commit 2579547

10 files changed

Lines changed: 1732 additions & 3440 deletions

File tree

docs/src/content/docs/coming-from/astro-for-wp-devs.mdx

Lines changed: 124 additions & 424 deletions
Large diffs are not rendered by default.

docs/src/content/docs/coming-from/astro.mdx

Lines changed: 104 additions & 316 deletions
Large diffs are not rendered by default.

docs/src/content/docs/coming-from/wordpress.mdx

Lines changed: 101 additions & 336 deletions
Large diffs are not rendered by default.

docs/src/content/docs/migration/content-import.mdx

Lines changed: 118 additions & 244 deletions
Large diffs are not rendered by default.

docs/src/content/docs/migration/from-wordpress.mdx

Lines changed: 103 additions & 183 deletions
Large diffs are not rendered by default.

docs/src/content/docs/migration/porting-plugins.mdx

Lines changed: 221 additions & 345 deletions
Large diffs are not rendered by default.

docs/src/content/docs/themes/creating-themes.mdx

Lines changed: 298 additions & 599 deletions
Large diffs are not rendered by default.
Lines changed: 57 additions & 101 deletions
Original file line numberDiff line numberDiff line change
@@ -1,139 +1,95 @@
11
---
2-
title: Themes Overview
3-
description: Understand how EmDash themes work and how they bootstrap new sites.
2+
title: Themes
3+
description: Install or create an EmDash theme as an Astro template with a seed file.
44
---
55

6-
import { Aside, Card, CardGrid } from "@astrojs/starlight/components";
6+
import { Aside } from "@astrojs/starlight/components";
77

8-
An EmDash theme is a complete Astro site -- pages, layouts, components, styles -- distributed via `create-astro`. It also includes a **seed file** that bootstraps the database with collections, fields, menus, redirects, and sample content on first run.
8+
An EmDash theme is a complete Astro project distributed as a `create-astro` template. It contains the public routes and components, EmDash runtime configuration, and an optional seed file for the site's initial content model.
99

10-
## What a Theme Provides
10+
There is no runtime theme package or template hierarchy. After scaffolding, the theme files belong to the site and can be edited directly.
1111

12-
A theme is a working Astro project with:
12+
## Theme contents
1313

14-
- **Pages** — Astro routes for rendering content (homepage, blog posts, archives, etc.)
15-
- **Layouts** — Shared HTML structure
16-
- **Components** — Reusable UI elements (navigation, cards, footers)
17-
- **Styles** — CSS or Tailwind configuration
18-
- **A seed file** — JSON that tells the CMS what content types and fields to create
14+
Current EmDash templates use these paths:
1915

20-
<Aside>
21-
A theme declares exactly which collections and fields it needs via the seed file. Most themes
22-
build on the standard **posts** and **pages** collections, adding fields and taxonomies as needed
23-
rather than inventing entirely new content types.
24-
</Aside>
25-
26-
## Theme Structure
27-
28-
A theme has the following layout:
29-
30-
```
31-
my-theme/
32-
├── package.json # Theme metadata + EmDash config
33-
├── astro.config.mjs # Astro integration setup
34-
├── src/
35-
│ ├── live.config.ts # Live Collections configuration
36-
│ ├── pages/ # Astro routes
37-
│ ├── layouts/ # Layout components
38-
│ └── components/ # UI components
39-
└── .emdash/
40-
├── seed.json # Schema + sample content
41-
└── uploads/ # Optional local media files
16+
```text title="Template structure"
17+
astro.config.mjs
18+
package.json
19+
seed/
20+
└── seed.json
21+
src/
22+
├── components/
23+
├── layouts/
24+
├── live.config.ts
25+
├── pages/
26+
└── styles/
4227
```
4328

44-
## How Themes Bootstrap Sites
45-
46-
Creating a site from a theme follows these steps:
29+
- `astro.config.mjs` configures server output, the deployment adapter, EmDash, the database, and storage.
30+
- `src/live.config.ts` registers the `_emdash` live collection.
31+
- `src/pages/` defines public routes.
32+
- `seed/seed.json` can declare initial collections, fields, settings, taxonomies, bylines, menus, redirects, widget areas, sections, and sample content.
33+
- `package.json#emdash.seed` points to the seed file.
4734

48-
1. `create-astro` scaffolds the project from the template
49-
2. Run `npm install` and `npm run dev`
50-
3. On first admin visit, the **Setup Wizard** runs automatically
51-
4. The wizard applies the seed file, creating collections, menus, redirects, and content
52-
5. The site is ready to use
35+
The blank template deliberately has no user seed and falls back to EmDash's built-in default seed. The other current templates point to `seed/seed.json`.
5336

54-
<CardGrid>
55-
<Card title="For Users" icon="laptop">
56-
Pick a theme, run the wizard, start editing. No database knowledge required.
57-
</Card>
58-
<Card title="For Developers" icon="seti:config">
59-
Themes are standard Astro projects. Customize freely after scaffolding.
60-
</Card>
61-
</CardGrid>
37+
## Install a template
6238

63-
## Installing a Theme
64-
65-
The following command scaffolds a site from an official theme template:
39+
The following command scaffolds the Node blog template:
6640

6741
```bash
6842
npm create astro@latest -- --template @emdash-cms/template-blog
6943
```
7044

71-
Community themes hosted on GitHub use the `github:` template prefix:
45+
Use the corresponding `-cloudflare` package for a Cloudflare Workers project:
7246

7347
```bash
74-
npm create astro@latest -- --template github:user/emdash-portfolio
48+
npm create astro@latest -- --template @emdash-cms/template-blog-cloudflare
7549
```
7650

77-
After scaffolding, install dependencies and start the dev server:
51+
Current template packages include:
52+
53+
| Purpose | Node | Cloudflare |
54+
| --- | --- | --- |
55+
| Empty project shell | `@emdash-cms/template-blank` | No current counterpart |
56+
| Basic pages site | `@emdash-cms/template-starter` | `@emdash-cms/template-starter-cloudflare` |
57+
| Posts, pages, categories, tags, and widgets | `@emdash-cms/template-blog` | `@emdash-cms/template-blog-cloudflare` |
58+
| Project portfolio | `@emdash-cms/template-portfolio` | `@emdash-cms/template-portfolio-cloudflare` |
59+
| Marketing pages with custom Portable Text renderers | `@emdash-cms/template-marketing` | `@emdash-cms/template-marketing-cloudflare` |
60+
61+
After scaffolding, install dependencies and start the generated site:
7862

7963
```bash
8064
cd my-site
8165
npm install
8266
npm run dev
8367
```
8468

85-
Visit `http://localhost:4321/_emdash/admin` to complete the Setup Wizard.
86-
87-
## The Setup Wizard
69+
Open `http://localhost:4321/_emdash/admin`. The first visit redirects to setup, where you enter the site identity and administrator details. When the selected template has sample entries, the wizard also lets you include or omit them. Including them is useful while evaluating the design because the routes have realistic content to render.
8870

89-
The Setup Wizard runs automatically on first admin visit. It performs these steps:
71+
## First setup
9072

91-
1. Prompts for site title, tagline, and admin credentials
92-
2. Offers an option to include sample content
93-
3. Applies the seed file to the database
94-
4. Redirects to the admin dashboard
73+
EmDash reads the seed at build time. It looks in this order:
9574

96-
<Aside type="tip">
97-
Check "Include sample content" when exploring a theme for the first time. The sample content
98-
demonstrates how the theme expects content to be structured.
99-
</Aside>
75+
1. `.emdash/seed.json`.
76+
2. The path in `package.json#emdash.seed`.
77+
3. `seed/seed.json`.
78+
4. The built-in default seed when no user seed is found.
10079

101-
## Official Themes
80+
On the first admin visit, the setup wizard shows seed metadata and lets the administrator choose whether to include sample content. It applies the seed to an empty database and records setup completion. Later starts do not reapply the seed to an existing site.
10281

103-
EmDash provides official starter themes, each available in local (SQLite + filesystem) and Cloudflare (D1 + R2) variants:
104-
105-
| Theme | Description | Use Case |
106-
| ----- | ----------- | -------- |
107-
| `@emdash-cms/template-blog` | Minimal blog with posts, pages, categories, and dark mode | Personal blogs, simple sites |
108-
| `@emdash-cms/template-portfolio` | Editorial-style portfolio with projects, serif typography (Playfair Display), and image-focused layouts | Freelancers, agencies, creatives |
109-
| `@emdash-cms/template-marketing` | Bold marketing site with custom Portable Text blocks (hero, features, testimonials, pricing, FAQ) | Landing pages, SaaS sites, product marketing |
110-
111-
### Cloudflare Variants
112-
113-
For deployment on Cloudflare Workers with D1 and R2, append `-cloudflare` to the template name, as in the following commands:
114-
115-
```bash
116-
npm create astro@latest -- --template @emdash-cms/template-blog-cloudflare
117-
npm create astro@latest -- --template @emdash-cms/template-portfolio-cloudflare
118-
npm create astro@latest -- --template @emdash-cms/template-marketing-cloudflare
119-
```
120-
121-
These variants include `wrangler.jsonc` for deployment configuration.
122-
123-
## Customizing After Install
124-
125-
After the Setup Wizard completes, the site is a standard Astro project. Customize it like any Astro site:
82+
<Aside type="caution">
83+
A seed is initial setup data, not a deployment migration system. After setup, change a live site's model through EmDash and export the resulting schema when the repository needs an updated baseline.
84+
</Aside>
12685

127-
- Edit pages in `src/pages/`
128-
- Modify layouts in `src/layouts/`
129-
- Add collections via the admin UI
130-
- Install Astro integrations
131-
- Deploy anywhere Astro runs
86+
## Customize the installed site
13287

133-
The seed file is only used during initial setup. After that, manage the content model in the admin panel or with the CLI.
88+
Edit the generated project directly:
13489

135-
## Next Steps
90+
- Change route files in `src/pages/`.
91+
- Change shared markup in `src/layouts/` and `src/components/`.
92+
- Change the initial model in `seed/seed.json` before first setup.
93+
- Manage an existing site's model under **Content Types** in the admin.
13694

137-
- **[Creating Themes](/themes/creating-themes/)** — Build your own EmDash theme
138-
- **[Seed File Format](/themes/seed-files/)** — Reference for seed file structure
139-
- **[Getting Started](/getting-started/)** — Create your first EmDash site
95+
Use [Creating themes](/themes/creating-themes/) to prepare a reusable template and [Seed files](/themes/seed-files/) for the complete seed contract.

0 commit comments

Comments
 (0)