EmDash para desenvolvedores WordPress

O EmDash traz conceitos familiares do WordPress—posts, páginas, taxonomias, menus, widgets e uma biblioteca de mídia—para uma stack moderna com Astro. O seu conhecimento de gestão de conteúdos transfere-se diretamente.

O que continua familiar

Os conceitos que conhece no WordPress são funcionalidades de primeira classe no EmDash:

• Collections funcionam como Custom Post Types—defina a estrutura do conteúdo e consulte-a nos templates
• Taxonomies da mesma forma—hierárquicas (como categorias) e planas (como etiquetas)
• Menus com ordenação por arrastar e largar e itens aninhados
• Widget Areas para barras laterais e regiões de conteúdo dinâmico
• Media library com carregamento, organização e gestão de imagens
• Admin UI que editores podem usar sem mexer em código

O que muda

A implementação muda, mas o modelo mental mantém-se:

Referência rápida

Content APIs

Consultar collections

As consultas WordPress usam WP_Query ou funções auxiliares. O EmDash usa funções de consulta tipadas.

<?php
$posts = new WP_Query([
  'post_type' => 'post',
  'posts_per_page' => 10,
  'post_status' => 'publish',
  'category_name' => 'news',
]);

while ($posts->have_posts()) :
$posts->the_post();
?>

  <h2><?php the_title(); ?></h2>
  <?php the_excerpt(); ?>
<?php endwhile; ?>

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

const { entries: posts } = await getEmDashCollection("posts", {
status: "published",
limit: 10,
where: { category: "news" },
});

---

{posts.map((post) => (

  <article>
    <h2>{post.data.title}</h2>
    <p>{post.data.excerpt}</p>
  </article>
))}

Obter uma única entrada

<?php
$post = get_post($id);
?>
<article>
  <h1><?php echo $post->post_title; ?></h1>
  <?php echo apply_filters('the_content', $post->post_content); ?>
</article>

---
import { getEmDashEntry } from "emdash";
import { PortableText } from "emdash/ui";

const { slug } = Astro.params;
const { entry: post } = await getEmDashEntry("posts", slug);

## if (!post) return Astro.redirect("/404");

<article>
  <h1>{post.data.title}</h1>
  <PortableText value={post.data.content} />
</article>

Hierarquia de templates

O WordPress usa uma hierarquia de templates para escolher qual ficheiro renderiza uma página. O Astro usa encaminhamento explícito baseado em ficheiros.

Template parts → Componentes

As partes de template WordPress tornam-se componentes Astro:

// In template:
get_template_part('template-parts/content', 'post');

// template-parts/content-post.php:

<article class="post">
  <h2><?php the_title(); ?></h2>
  <?php the_excerpt(); ?>
</article>

---
const { post } = Astro.props;
---

<article class="post">
	<h2>{post.data.title}</h2>
	<p>{post.data.excerpt}</p>
</article>

---
import PostCard from "../components/PostCard.astro";
import { getEmDashCollection } from "emdash";

const { entries: posts } = await getEmDashCollection("posts");
---

{posts.map((post) => <PostCard {post} />)}

Menus

O EmDash tem suporte de menu de primeira classe com resolução automática de URL:

<?php
wp_nav_menu([
  'theme_location' => 'primary',
  'container' => 'nav',
]);
?>

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

## const menu = await getMenu("primary");

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

Os menus criam-se na admin UI, ficheiros seed ou importação WordPress.

Áreas de widgets

As áreas de widgets funcionam como barras laterais no WordPress:

<?php if (is_active_sidebar('sidebar-1')) : ?>
  <aside>
    <?php dynamic_sidebar('sidebar-1'); ?>
  </aside>
<?php endif; ?>

---
import { getWidgetArea } from "emdash";
import { PortableText } from "emdash/ui";

## const sidebar = await getWidgetArea("sidebar");

{sidebar && (

  <aside>
    {sidebar.widgets.map((widget) => {
      if (widget.type === "content") {
        return <PortableText value={widget.content} />;
      }
      // Handle other widget types
    })}
  </aside>
)}

Definições do site

As opções do site e do personalizador mapeiam para getSiteSetting():

import { getSiteSetting } from "emdash";

const title = await getSiteSetting("title");
const logo = await getSiteSetting("logo"); // Returns { mediaId, alt, url }

Taxonomias

As taxonomias são conceptualmente iguais—hierárquicas (como categorias) ou planas (como etiquetas):

import { getTaxonomyTerms, getEntryTerms, getTerm } from "emdash";

// Get all categories
const categories = await getTaxonomyTerms("categories");

// Get a specific term
const news = await getTerm("categories", "news");

// Get terms for a post
const postCategories = await getEntryTerms("posts", postId, "categories");

Hooks → Sistema de plugins

Os hooks WordPress (add_action, add_filter) tornam-se hooks de plugins EmDash:

O que melhora no EmDash

Ligações de pré-visualização

O EmDash gera URLs de pré-visualização seguras com tokens assinados HMAC. Os editores podem pré-visualizar rascunhos sem iniciar sessão em produção—partilham uma ligação, não credenciais.

Sem conflitos entre plugins

Os conflitos típicos de plugins WordPress desaparecem. Os plugins EmDash executam em contextos isolados com APIs explícitas. Sem poluição de estado global.

Experiência do editor de conteúdo

Os editores usam o painel de administração EmDash, semelhante ao wp-admin:

• Dashboard com atividade recente
• Listagens de collections com pesquisa, filtros e ações em massa
• Editor rico para conteúdo (Portable Text, não Gutenberg)
• Biblioteca de mídia com carregamento por arrastar e largar
• Construtor de menus com ordenação por arrastar e largar
• Editor de áreas de widgets para conteúdo da barra lateral

A experiência de edição é familiar. A tecnologia por baixo é moderna.

Caminho de migração

O EmDash importa conteúdo WordPress diretamente:

1. Exportar do WordPress (Ferramentas → Exportar)
2. Carregar o ficheiro .xml no admin EmDash
3. Mapear tipos de post para collections
4. Importar conteúdo e mídia

Posts, páginas, taxonomias, menus e mídia transferem-se. Blocos Gutenberg convertem-se em Portable Text. Campos personalizados são analisados e mapeados.

Consulte o guia de migração WordPress para instruções completas.

Próximos passos

• Getting Started — Configure o seu primeiro site EmDash
• Querying Content — Aprofunde as Content APIs
• Taxonomies — Categorias, etiquetas e taxonomias personalizadas
• Menus — Menus de navegação
• Migrate from WordPress — Importar conteúdo existente