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 — incluindo a criação de blocos Gutenberg personalizados com register_block_type — prova de que o WordPress está longe de ser ultrapassado. Mas o que é exatamente, o que permite fazer, e quando faz sentido adotar? Este guia explica. Para começar, assegura que as primeiras configurações WordPress estão feitas; se ainda não tens WP instalado, vê o guia de instalação WordPress passo-a-passo.

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. Para um mergulho prático no editor de sites do WordPress — templates, site parts e estilos globais — vê o guia específico.

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 avançada
• 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. Para um guia completo de como instalar, ativar e personalizar um tema WordPress, vê o guia de introdução.

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 — disponível tanto nos melhores temas gratuitos como nos temas premium. 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: Esta hierarquia de templates é independente da estrutura de títulos H1, H2 e H3 no conteúdo — que continua a ser responsabilidade do editor em cada artigo ou página.

• 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. A variação de alto contraste é também relevante para conformidade com a Lei Europeia de Acessibilidade, obrigatória desde junho de 2025 para sites que vendem a consumidores na UE. O guia de acessibilidade web WordPress e WCAG cobre os requisitos técnicos de implementação. O quadro legal de acessibilidade web em vigor desde 2025 explica as penalizações; a implementação em WordPress está em WordPress acessibilidade WCAG e EAA.

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. Se o teu tema clássico usa page builders como Elementor, Divi ou Beaver Builder, o guia de comparação ajuda a perceber o que perdes e o que ganhas na migração.

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. Block themes bem construídos têm impacto direto na velocidade — o serviço de otimização WordPress inclui avaliação técnica de tema e Core Web Vitals, e o nosso plano de manutenção WordPress garante que o tema se mantém atualizado e seguro. Fala connosco sobre o teu projeto.