Full Site Editing no WordPress 6.x: Block Themes, Patterns e Site Editor

O Full Site Editing (FSE) — hoje simplesmente chamado de Site Editor no WordPress — chegou à maturidade em 2026. Com o WordPress 6.7 e 6.8 já lançados e o 7.0 em maio de 2026, o FSE deixou de ser uma funcionalidade experimental para se tornar o método de desenvolvimento de temas recomendado pelo WordPress.org. Mas o que é exatamente, o que permite fazer, e quando faz sentido adotar? Este guia explica.

O que é o Full Site Editing

No WordPress clássico, editavas o conteúdo de uma página no editor, mas o cabeçalho, rodapé, barra lateral e templates das páginas estavam “fechados” — só se alteravam editando ficheiros PHP do tema ou usando o Customizer. Com o FSE, tudo o que é visível no site pode ser editado visualmente, incluindo header, footer, templates de posts e páginas de arquivo — usando o mesmo editor de blocos.

O FSE assenta em três pilares:

• Block Themes: temas construídos com ficheiros HTML de blocos em vez de PHP
• Site Editor: interface visual para editar templates, template parts, patterns e estilos globais
• theme.json: ficheiro de configuração JSON que define as opções de design (paletas de cor, fontes, espaçamentos) disponíveis no editor

Block themes vs temas clássicos vs temas híbridos

Para projetos novos em 2026, o WordPress.org recomenda block themes. Os temas clássicos continuarão a funcionar, mas não recebem novas funcionalidades da plataforma.

O Site Editor: o que podes fazer em cada secção

Acedes ao Site Editor em Aspeto → Editor. Está dividido em quatro áreas:

Templates

Os templates definem a estrutura visual para diferentes tipos de páginas. Podes ver e editar:

• Index: template de fallback para tudo o resto
• Single Post / Page: estrutura de artigos e páginas individuais
• Archive: listagem de posts em categorias, tags, datas
• Search: resultados de pesquisa
• 404: página de erro “não encontrado”
• Templates customizados: podes criar para landing pages, páginas sem rodapé, etc.

Quando editas um template no Site Editor, o WordPress guarda as alterações na base de dados (como um post do tipo wp_template), mantendo os ficheiros do tema como fallback. Para “repor” um template ao estado original do tema, simplesmente apaga a versão personalizada.

Patterns (Padrões)

Os patterns são composições de blocos reutilizáveis. Existem dois tipos:

• Padrões sincronizados: editares num lugar atualiza em todo o site — ideal para header, footer, banners de promoção. Antes chamados “Reusable Blocks”
• Padrões não sincronizados: cada instância é independente — funciona como template que podes personalizar em cada uso, ideal para hero sections ou cards

Styles (Estilos)

A secção Estilos é onde defines a aparência global do site: cores, tipografia, espaçamentos. As alterações aqui afetam todos os blocos em todo o site. Também é onde aparece a galeria de variações de estilo — alternativas visuais pré-configuradas (modo escuro, tipografia diferente) que o utilizador pode aplicar com um clique.

Block Themes populares em 2026

theme.json: o coração do block theme

O theme.json é o ficheiro de configuração que define o que os editores podem (e não podem) personalizar. Substitui muitos add_theme_support() do functions.php clássico e centraliza todas as opções de design.

Estrutura principal:

{
  "$schema": "https://schemas.wp.org/wp/6.8/theme.json",
  "version": 3,
  "settings": {
    "color": {
      "palette": [
        { "name": "Primária",   "slug": "primary",    "color": "#1a56db" },
        { "name": "Secundária", "slug": "secondary",  "color": "#374151" },
        { "name": "Destaque",   "slug": "accent",     "color": "#e3a008" }
      ]
    },
    "typography": {
      "fontFamilies": [
        { "name": "Sistema", "slug": "system",
          "fontFamily": "-apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif" }
      ],
      "fontSizes": [
        { "name": "Normal", "slug": "normal", "size": "1rem" },
        { "name": "Grande", "slug": "large",  "size": "1.5rem" }
      ]
    },
    "layout": {
      "contentSize": "680px",
      "wideSize": "1200px"
    }
  },
  "styles": {
    "color": {
      "background": "#ffffff",
      "text": "#111827"
    },
    "typography": {
      "fontFamily": "var(--wp--preset--font-family--system)",
      "lineHeight": "1.7"
    }
  },
  "templateParts": [
    { "name": "header", "title": "Cabeçalho", "area": "header" },
    { "name": "footer", "title": "Rodapé",    "area": "footer" }
  ]
}

Com "custom": false dentro de settings.color, podes desativar a possibilidade de o editor usar cores fora da paleta definida — útil para manter coerência visual em projetos de cliente.

Hierarquia de templates no FSE

O FSE segue a mesma hierarquia de templates do WordPress clássico, mas com ficheiros .html em vez de .php:

• single-post.html → single.html → index.html (para artigos)
• category-tecnologia.html → category.html → archive.html → index.html (para categorias)
• page-contacto.html → page.html → index.html (para páginas)

Os ficheiros ficam em themes/nome-do-tema/templates/. As personalizações feitas no Site Editor ficam na base de dados e têm prioridade sobre os ficheiros do tema.

Style Variations: múltiplas paletas com um clique

As variações de estilo permitem empacotar diferentes aparências visuais (modo escuro, tipografia serif, alto contraste) como ficheiros JSON em themes/nome-do-tema/styles/. O utilizador vê estas opções no Site Editor → Estilos → Navegar variações e aplica-as sem código.

Exemplo de styles/modo-escuro.json:

{
  "version": 3,
  "title": "Modo Escuro",
  "styles": {
    "color": {
      "background": "#111827",
      "text": "#f9fafb"
    },
    "elements": {
      "link": {
        "color": { "text": "#60a5fa" }
      }
    }
  }
}

Limitações do FSE em 2026

O FSE é maduro, mas tem limitações reais que deves conhecer antes de adotar:

• Tecto de controlo de design: o theme.json expõe apenas um subconjunto de CSS. Designs muito complexos requerem CSS customizado à parte
• Compatibilidade de plugins: alguns plugins de membership, LMS ou e-commerce dependem de APIs do Customizer ou de widget areas clássicas — verifica sempre a compatibilidade antes de migrar
• Preview para editores: editores que usam muito o Gutenberg perdem o preview em tempo real do frontend — especialmente relevante se o tema tem estilos customizados complexos
• Curva de aprendizagem: mesmo developers experientes em WordPress têm de reaprender a forma como os templates funcionam e onde está a configuração
• WooCommerce: a compatibilidade com block themes melhorou muito, mas ainda existem extensões WooCommerce que não são totalmente compatíveis — testa sempre num ambiente de staging

Migrar de tema clássico para block theme: o processo

Uma migração de tema clássico para block theme não é uma simples troca de tema — requer planeamento:

1. Auditoria de plugins: verifica compatibilidade de cada plugin crítico com block themes
2. Staging: nunca migra diretamente em produção
3. Mapeamento de templates: identifica todos os templates customizados do tema atual e planeia equivalentes em HTML de blocos
4. theme.json: define a paleta de cores, fontes e espaçamentos antes de qualquer template
5. Templates por prioridade: começa por index, single, page — só depois archives e páginas especiais
6. Conteúdo: o conteúdo existente fica como “Classic Block” — converte gradualmente usando “Converter para blocos”
7. Testes: verifica todos os tipos de página (single, archive, search, 404, WooCommerce)

A ferramenta mais útil para este processo é o plugin Create Block Theme (wordpress.org/plugins/create-block-theme) — permite editar um tema existente no Site Editor e exportar as alterações como ficheiros do tema, acelerando significativamente o desenvolvimento.

Conclusão

O Full Site Editing em 2026 não é uma moda — é a direção do WordPress. Para novos projetos, block themes com Site Editor e theme.json são o caminho certo: mais rápidos para o utilizador, mais flexíveis para o editor, e melhor desempenho de Core Web Vitals. Para sites existentes, a migração vale a pena para projetos com perspetiva a médio prazo, mas requer planeamento cuidadoso.

Na OnePixel, desenvolvemos block themes WordPress customizados e acompanhamos a migração de temas clássicos para FSE. Fala connosco sobre o teu projeto.