EmDash para desenvolvedores WordPress

O EmDash mantém conceitos de conteúdo familiares, como posts, páginas, taxonomias, menus, mídia e revisões. O Astro fornece a camada do tema: rotas, layouts, componentes e renderização no servidor.

O que permanece familiar

Os editores continuam trabalhando com tipos de conteúdo nomeados, campos estruturados, os estados de rascunho e publicado, categorias hierárquicas, tags simples, menus aninhados, mídia e histórico de revisões. Esses conceitos passam para as coleções do EmDash e para as telas de gerenciamento.

O fluxo de desenvolvimento muda. A seleção de templates PHP se torna rotas Astro explícitas, as partes de template se tornam componentes importados e o código é implantado separadamente do conteúdo do banco de dados. Você não precisa de React para construir o site público; os componentes .astro combinam TypeScript do lado do servidor com templates semelhantes a HTML.

Mapa de conceitos

Modelo de conteúdo

Crie e edite coleções em Content Types no administrador do EmDash. Uma coleção tem campos tipados explícitos e pode ativar rascunhos, revisões, agendamento, busca, SEO ou comentários.

As consultas retornam entradas de live collection do Astro. entry.id é o identificador da rota e normalmente é o slug; entry.data.id é o ID do conteúdo no banco de dados.

O arquivo a seguir consulta posts em ordem de publicação:

---
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>
))}

Arquivos do tema

As rotas do Astro substituem a hierarquia de templates do WordPress. Um template escolhe a própria estrutura de URL, em vez de depender de nomes de arquivo mágicos.

Leia Astro para desenvolvedores WordPress para a estrutura do projeto, a sintaxe de componentes, props, slots, layouts, roteamento e o fluxo de consultas renderizadas no servidor usados pelos templates EmDash.

Menus e áreas de widgets

Os menus e as áreas de widgets ficam no banco de dados e continuam editáveis após a configuração. Os templates os consultam no momento da requisição:

---
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>

Configurações do site e taxonomias

A identidade do site no estilo do Customizer fica nas configurações do EmDash. Busque as configurações uma única vez e use a URL do logotipo já resolvida quando houver uma:

---
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>

Os termos de taxonomia são registros separados, e não valores armazenados diretamente em entry.data. Resolva um termo e depois use o slug dele em um filtro de coleção:

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: [] };

Formatos de plugins

O EmDash tem dois formatos de plugins:

• Um plugin sandboxed usa emdash-plugin.jsonc para sua identidade e seu contrato de confiança, mais um objeto src/plugin.ts exportado por padrão e tipado com SandboxedPlugin. Ele pode ser executado em um runtime isolado e usar o Block Kit para a UI de administração.
• Um plugin nativo exporta uma fábrica de descritores em tempo de compilação e uma função createPlugin() em tempo de execução, construída com definePlugin(). Use este formato para componentes React de administração, componentes Astro públicos ou fragmentos de página.

Comece com Escolher um formato de plugin. Os nomes dos hooks e as APIs de PluginContext são compartilhados, mas as formas de pacotes e handlers não são intercambiáveis.

Importar conteúdo WordPress

Na barra lateral do administrador, selecione Import para abrir a página Import from WordPress, ou acesse diretamente /_emdash/admin/import/wordpress. O EmDash oferece suporte a dois caminhos de importação:

1. Envie um arquivo WordPress eXtended RSS (WXR) exportado em Tools → Export.
2. Instale o plugin EmDash Exporter no site WordPress e conecte-se com uma senha de aplicativo do WordPress. Esse caminho pode incluir conteúdo que uma API REST pública comum não expõe.

Informar uma URL do WordPress sem o exportador pode detectar o site e contar posts, páginas e mídia públicos. Essa sondagem REST não importa conteúdo.

O importador mapeia o publish do WordPress para o published do EmDash. Os estados rascunho, pendente, privado, agendado, lixeira e desconhecido se tornam rascunhos. Revise as permissões importadas e o estado de publicação antes de alterar o DNS ou aposentar o WordPress.

Siga Migrar do WordPress para o procedimento completo e o comportamento de tentativa.

Fluxo de trabalho editorial

O administrador do EmDash oferece listas de coleções, um editor de Portable Text, gerenciamento de mídia, edição de menus, gerenciamento de taxonomias, revisões e links de pré-visualização. Ele não é uma cópia visual do wp-admin: os blocos do Gutenberg se tornam Portable Text, e as telas disponíveis dependem das coleções e dos recursos configurados para o site.

Próximos passos