E EmDash CMS Everything Guides, use cases, plugins, templates
Italiano

Panoramica dei temi

In questa pagina

Un tema EmDash è un sito Astro completo — pagine, layout, componenti, stili — distribuito tramite create-astro. Include anche un file seed che inizializza il database con collezioni, campi, menu, reindirizzamenti e contenuti di esempio alla prima esecuzione.

Cosa fornisce un tema

Un tema è un progetto Astro funzionante con:

  • Pages — Route Astro per il rendering dei contenuti (homepage, post del blog, archivi, ecc.)
  • Layouts — Struttura HTML condivisa
  • Components — Elementi UI riutilizzabili (navigazione, card, footer)
  • Styles — Configurazione CSS o Tailwind
  • Un file seed — JSON che indica al CMS quali tipi di contenuto e campi creare

Struttura del tema

Un tema ha il seguente layout:

my-theme/
├── package.json           # Metadati del tema + configurazione EmDash
├── astro.config.mjs       # Configurazione integrazione Astro
├── src/
│   ├── live.config.ts     # Configurazione Live Collections
│   ├── pages/             # Route Astro
│   ├── layouts/           # Componenti layout
│   └── components/        # Componenti UI
└── .emdash/
    ├── seed.json          # Schema + contenuti di esempio
    └── uploads/           # File multimediali locali opzionali

Come i temi inizializzano i siti

Creare un sito da un tema segue questi passaggi:

  1. create-astro crea il progetto dal template
  2. Eseguire npm install e npm run dev
  3. Alla prima visita admin, il Setup Wizard viene eseguito automaticamente
  4. Il wizard applica il file seed, creando collezioni, menu, reindirizzamenti e contenuti
  5. Il sito è pronto per l’uso

Per gli utenti

Scegli un tema, esegui il wizard, inizia a modificare. Non sono richieste conoscenze di database.

Per gli sviluppatori

I temi sono progetti Astro standard. Personalizzali liberamente dopo lo scaffolding.

Installare un tema

Il seguente comando crea un sito da un template di tema ufficiale:

npm create astro@latest -- --template @emdash-cms/template-blog

I temi della community ospitati su GitHub usano il prefisso template github::

npm create astro@latest -- --template github:user/emdash-portfolio

Dopo lo scaffolding, installa le dipendenze e avvia il server di sviluppo:

cd my-site
npm install
npm run dev

Visita http://localhost:4321/_emdash/admin per completare il Setup Wizard.

Il Setup Wizard

Il Setup Wizard viene eseguito automaticamente alla prima visita admin. Esegue questi passaggi:

  1. Richiede titolo del sito, tagline e credenziali admin
  2. Offre un’opzione per includere contenuti di esempio
  3. Applica il file seed al database
  4. Reindirizza alla dashboard admin

Temi ufficiali

EmDash fornisce temi starter ufficiali, ciascuno disponibile in varianti locali (SQLite + filesystem) e Cloudflare (D1 + R2):

TemaDescrizioneCaso d’uso
@emdash-cms/template-blogBlog minimale con post, pagine, categorie e modalità scuraBlog personali, siti semplici
@emdash-cms/template-portfolioPortfolio in stile editoriale con progetti, tipografia serif (Playfair Display) e layout incentrati sulle immaginiFreelancer, agenzie, creativi
@emdash-cms/template-marketingSito di marketing audace con blocchi Portable Text personalizzati (hero, funzionalità, testimonianze, prezzi, FAQ)Landing page, siti SaaS, marketing di prodotto

Varianti Cloudflare

Per il deployment su Cloudflare Workers con D1 e R2, aggiungi -cloudflare al nome del template, come nei seguenti comandi:

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

Queste varianti includono wrangler.jsonc per la configurazione del deployment.

Personalizzazione dopo l’installazione

Dopo il completamento del Setup Wizard, il sito è un progetto Astro standard. Personalizzalo come qualsiasi sito Astro:

  • Modifica le pagine in src/pages/
  • Modifica i layout in src/layouts/
  • Aggiungi collezioni tramite l’interfaccia admin
  • Installa integrazioni Astro
  • Distribuisci ovunque Astro funzioni

Il file seed viene utilizzato solo durante la configurazione iniziale. Successivamente, gestisci il modello di contenuto nel pannello admin o con la CLI.

Prossimi passi