EmDash pour les développeurs WordPress

EmDash conserve des concepts de contenu familiers : articles, pages, taxonomies, menus, médias et révisions. Astro fournit la couche de thème : routes, layouts, composants et rendu côté serveur.

Ce qui reste familier

Les éditeurs continuent de travailler avec des types de contenu nommés, des champs structurés, les états brouillon et publié, des catégories hiérarchiques, des étiquettes à plat, des menus imbriqués, des médias et un historique de révisions. Ces concepts passent dans les collections EmDash et dans ses écrans de gestion.

Le flux de développement change. La sélection de templates PHP devient des routes Astro explicites, les parties de template deviennent des composants importés, et le code est déployé séparément du contenu de la base de données. Vous n’avez pas besoin de React pour construire le site public ; les composants .astro combinent du TypeScript côté serveur avec des templates proches du HTML.

Correspondance des concepts

Modèle de contenu

Créez et modifiez les collections sous Content Types dans l’administration d’EmDash. Une collection possède des champs typés explicites et peut activer les brouillons, les révisions, la planification, la recherche, le SEO ou les commentaires.

Les requêtes renvoient des entrées de live collection Astro. entry.id est l’identifiant de la route et correspond normalement au slug ; entry.data.id est l’ID de contenu en base de données.

L’archive suivante interroge les articles par ordre de publication :

---
import { getEmDashCollection } from "emdash";

const { entries: posts, error } = await getEmDashCollection("posts", {
  orderBy: { published_at: "desc" },
  limit: 10,
});

if (error) return new Response("Could not load posts", { status: 500 });
---

{posts.map((post) => (
  <article>
    <h2><a href={`/posts/${post.id}`}>{post.data.title}</a></h2>
    {post.data.excerpt && <p>{post.data.excerpt}</p>}
  </article>
))}

Fichiers du thème

Les routes Astro remplacent la hiérarchie de templates de WordPress. Un template choisit lui-même sa structure d’URL au lieu de s’appuyer sur des noms de fichiers magiques.

Lisez Astro pour les développeurs WordPress pour la structure du projet, la syntaxe des composants, les props, les slots, les layouts, le routage et le flux de requêtes rendues côté serveur qu’utilisent les templates EmDash.

Menus et zones de widgets

Les menus et les zones de widgets résident dans la base de données et restent modifiables après la configuration. Les templates les interrogent au moment de la requête :

---
import { getMenu } from "emdash";
import { WidgetArea } from "emdash/ui";

const primary = await getMenu("primary");
---

<nav>
  {primary?.items.map((item) => <a href={item.url}>{item.label}</a>)}
</nav>

<aside><WidgetArea name="sidebar" /></aside>

Paramètres du site et taxonomies

L’identité du site, à la manière du Customizer, se trouve dans les paramètres d’EmDash. Récupérez les paramètres une seule fois et utilisez l’URL du logo résolue lorsqu’elle existe :

---
import { getSiteSettings } from "emdash";

const settings = await getSiteSettings();
---

<a href="/">
  {settings.logo?.url
    ? <img src={settings.logo.url} alt={settings.logo.alt || settings.title} />
    : settings.title}
</a>

Les termes de taxonomie sont des enregistrements distincts, et non des valeurs stockées directement dans entry.data. Résolvez un terme, puis utilisez son slug dans un filtre de collection :

import { getEmDashCollection, getTerm } from "emdash";

const news = await getTerm("category", "news", { includeCounts: false });
const { entries: posts } = news
  ? await getEmDashCollection("posts", { where: { category: news.slug } })
  : { entries: [] };

Formats de plugins

EmDash a deux formats de plugins :

• Un plugin sandboxed utilise emdash-plugin.jsonc pour son identité et son contrat de confiance, plus un objet src/plugin.ts exporté par défaut et typé avec SandboxedPlugin. Il peut s’exécuter dans un runtime isolé et utiliser Block Kit pour l’UI d’administration.
• Un plugin natif exporte une factory de descripteur au moment de la compilation et une fonction createPlugin() au moment de l’exécution, construite avec definePlugin(). Utilisez ce format pour les composants React d’administration, les composants Astro publics ou les fragments de page.

Commencez par Choisir un format de plugin. Les noms de hooks et les APIs PluginContext sont partagés, mais les formes de paquets et de gestionnaires ne sont pas interchangeables.

Importer du contenu WordPress

Dans la barre latérale de l’administration, sélectionnez Import pour ouvrir la page Import from WordPress, ou rendez-vous directement sur /_emdash/admin/import/wordpress. EmDash prend en charge deux chemins d’importation :

1. Téléversez un fichier WordPress eXtended RSS (WXR) exporté depuis Tools → Export.
2. Installez le plugin EmDash Exporter sur le site WordPress et connectez-vous avec un mot de passe d’application WordPress. Ce chemin peut inclure du contenu qu’une API REST publique classique n’expose pas.

Saisir une URL WordPress sans l’exporteur peut détecter le site et compter les articles, pages et médias publics. Cette sonde REST n’importe pas de contenu.

L’importeur fait correspondre le statut WordPress publish au statut EmDash published. Les statuts brouillon, en attente, privé, planifié, corbeille et inconnu deviennent des brouillons. Vérifiez les permissions importées et l’état de publication avant de modifier le DNS ou de mettre WordPress hors service.

Suivez Migrer depuis WordPress pour la procédure complète et le comportement de reprise.

Flux de travail éditorial

L’administration d’EmDash fournit des listes de collections, un éditeur Portable Text, la gestion des médias, l’édition des menus, la gestion des taxonomies, les révisions et des liens de prévisualisation. Ce n’est pas une copie visuelle de wp-admin : les blocs Gutenberg deviennent du Portable Text, et les écrans disponibles dépendent des collections et des fonctionnalités configurées pour le site.

Prochaines étapes