Blocos Gutenberg, padrões e full site editing: o guia completo de WordPress (2026)

#Porque e qué os blocos mudaram tudo no WordPress

O WordPress serviu a web através dé uma única caixa de texto enriquecido durante mais de quinzé anos. Isso mudou em dezembro de 2018 quando a versão 5.0 foi lancada com o editor de blocos Gutenberg. Em vez de colar HTML em bruto ou lutar com shortcodes, cada elemento de conteúdo tornou-sé um bloco independente: um paragrafo, uma imagem, uma galeria, um botao, uma tabela. Os blocos podem ser movidos, duplicados, agrupados e estilizados de forma independente.

Em 2026, o editor de blocos já não é opcional. Controla a edicao de publicações, a construcao de páginas e, com o full site editing, toda a camada de tema. Quer seja um proprietario de site que pública artigos ou um programador que entrega projetos para clientes, compreender blocos, padrões é o Site Editor é uma competencia essencial.

Este guia percorre cada camada do ecossistema de blocos, desdé o painel de inserção até a construcao dé um tema de blocos personalizado de raiz.

#Compreender o painel de inserção de blocos

O painel de inserção de blocos é a porta de entrada para cada elemento que pode colocar numa página. Abra-o clicando no botao azul + na barra de ferramentas superior esquerda ou escrevendo / num paragrafo vazio.

O painel de inserção agrupa blocos em categorias:

• Texto - paragrafo, título, lista, citacao, código, pre-formatado, pullquote, verso
• Media - imagem, galeria, audio, video, cover, ficheiro
• Design - botoes, colunas, grupo, linha, pilha, separador, espacador
• Widgets - shortcode, arquivos, categorias, publicações recentes, pesquisa, icones sociais
• Tema - navegação, logotipo do site, título do site, query loop, parte de template, título da públicação, conteúdo da públicação
• Incorporacoes - YouTube, Twitter, Spotify, Vimeo e dezenas mais via oEmbed

Cada bloco disponibiliza a sua propria barra de ferramentas (formatacao inline, alinhamento, ligacao) é um painel lateral com definições avançadas (ancora HTML, classes CSS adicionais, cor, tipografia). Dominar o painel de inserção significa que raramente precisa dé um plugin de page builder para layouts padrão.

#Atalhos de teclado que poupam tempo

A edicao produtiva de blocos depende dé atalhos:

• / seguido do nome dé um bloco insere-o instantaneamente
• Ctrl+Shift+D (Cmd no macOS) duplica o bloco selecionado
• Ctrl+Alt+T inseré um bloco antes do atual
• Ctrl+Alt+Y inseré um bloco apos o atual
• Shift+Alt+Z remové o bloco selecionado
• Ctrl+Shift+K remové uma ligacao do texto selecionado

Combine estes com a pega dé arrasto em cada bloco e pode reorganizar layouts complexos sem tocar no rato.

#Criar e gerir padrões sincronizados (blocos reútilizáveis)

O WordPress 6.3 renomeou “blocos reútilizáveis” para “padrões sincronizados”, mas o conceito permanecé o mesmo: guardé um bloco ou grupo de blocos uma vez e insira-o em qualquer lugar do seu site. Quando edita uma instancia, todas as colocacoes são atualizadas.

#Como criar um padrão sincronizado

1. Selecioné um ou mais blocos no editor.
2. Abra a barra de ferramentas do bloco e clique no menu de três pontos.
3. Escolha Criar padrão.
4. Dé um nome é uma categoria ao padrão.
5. Ative Sincronizado. (Deixar desativado cria um padrão normal, não sincronizado.)
6. Clique em Criar.

O padrão aparecé agora no painel de inserção no separador Padrões e dentro da categoria Sincronizado.

#Casos de uso práticos

• Banners de call-to-action - um único grupo de blocos CTA útilizado em cada página de destino, atualizado uma vez quando a campanha muda.
• Seccoes de testemunhos - um bloco de colunas com citacoes de clientes que permanece consistente nas páginas de serviços.
• Avisos legais - texto juridico que deve permanecer identico em todo o site.
• Formularios de inscricao na newsletter - um bloco de formulario sincronizado entré a barra lateral do blogue é o rodape.

#Gerir padrões a partir da administração

Navegué até Aparencia > Editor > Padrões (ou o ecrã independente de Padrões em /wp-admin/edit.php?post_type=wp_block) para ver, editar, duplicar, exportar ou eliminar os seus padrões. Também pode converter um padrão sincronizado num padrão regular (não sincronizado), abrindo-o e desativando o estado de sincronização.

#Padrões de blocos é o diretorio de padrões

Enquanto os padrões sincronizados são os seus proprios componentes reutilizáveis, os padrões de blocos são layouts pre-concebidos que insere e personaliza livremente. O WordPress inclui padrões integrados (seccoes hero, grelhas de testemunhos, tabelas de preços, listas de funcionalidades), e milhares mais estao disponiveis no diretorio oficial de padrões em wordpress.org/patterns.

#Utilizar padrões do diretorio

1. Abra o painel de inserção e clique no separador Padrões.
2. Navegue pelas categorias ou pesquise por palavra-chave.
3. Clique num padrão para o inserir no editor.
4. Modifique texto, imagens, cores e espacamento para corresponder a sua marca.

Como os padrões se tornam copias independentes apos a inserção, podé alterar cada detalhe sem afetar o original.

#Registar um padrão de bloco personalizado em PHP

Temas e plugins podem registar padrões programaticamente. Aqui está um exemplo mínimo em functions.php:

<?php
declare(strict_types=1);

add_action('init', function (): void {
    register_block_pattern(
        'wppoland/hero-with-cta',
        [
            'title'       => __('Hero com CTA', 'wppoland'),
            'description' => __('Uma secção hero de largura total com titulo, paragrafo e botao.', 'wppoland'),
            'categories'  => ['featured', 'banner'],
            'keywords'    => ['hero', 'cta', 'banner'],
            'content'     => '
                <!-- wp:cover {"overlayColor":"contrast","isUserOverlayColor":true,"minHeight":500,"align":"full"} -->
                <div class="wp-block-cover alignfull" style="min-height:500px">
                    <span class="wp-block-cover__background has-contrast-background-color"></span>
                    <div class="wp-block-cover__inner-container">
                        <!-- wp:heading {"textAlign":"center","level":1} -->
                        <h1 class="wp-block-heading has-text-align-center">O seu titulo aqui</h1>
                        <!-- /wp:heading -->
                        <!-- wp:paragraph {"align":"center"} -->
                        <p class="has-text-align-center">Texto dé apoio que explica a proposta de valor.</p>
                        <!-- /wp:paragraph -->
                        <!-- wp:buttons {"layout":{"type":"flex","justifyContent":"center"}} -->
                        <div class="wp-block-buttons">
                            <!-- wp:button -->
                            <div class="wp-block-button"><a class="wp-block-button__link wp-element-button">Comecar</a></div>
                            <!-- /wp:button -->
                        </div>
                        <!-- /wp:buttons -->
                    </div>
                </div>
                <!-- /wp:cover -->
            ',
        ]
    );
});

A partir do WordPress 6.0 também pode colocar ficheiros de padrões num diretorio patterns/ na raiz do tema. Cada ficheiro útiliza um comentario de cabecalho para metadados e devolve marcação de blocos, permitindo o registo automático sem register_block_pattern().

#Full site editing: como o Site Editor substitui o Customizer

Full site editing (FSE) é o termo geral para a útilização de blocos para controlar todas as partes do seu site - não apenas o conteúdo de publicações, mas também cabecalhos, rodapes, barras laterais, layouts dé arquivo e páginas 404. Foi implementado progressivamente do WordPress 5.9 ao 6.5 e é agora a abordagem padrão para temas de blocos.

#O qué o full site editing substitui

#Aceder ao Site Editor

Com um tema de blocos ativo, va a Aparencia > Editor. A interfacé abre-se numa pre-visualização visual. A partir da barra lateral esquerda pode navegar para:

• Templates - index, single, página, arquivo, 404, pesquisa, inicio e quaisquer templates personalizados
• Partes de template - cabecalho, rodape, barra lateral e partes personalizadas
• Padrões - todos os padrões registados e criados pelo útilizador
• Estilos - tipografia global, cores, espacamento e substituicoes de estilo por bloco
• Navegação - gestão de menus com o bloco de navegação

Cada alteracao e pre-visualizada ao vivo e guardada na base de dados. Para programadores de temas, as alterações podem ser exportadas como ficheiros de tema para controlo de versões.

#Criar templates e partes de template personalizados

Os templates definem a estrutura dé um tipo de página. As partes de template são fragmentos reútilizáveis (cabecalho, rodape) partilhados entre templates.

#Criar um template no Site Editor

1. Abra Aparencia > Editor > Templates.
2. Clique em Adicionar novo template.
3. Selecioné um tipo de template (página, públicação individual, categoria, autor, personalizado).
4. Construa o layout usando blocos: adicioné uma parte de template de cabecalho no topo, um query loop para publicações, uma parte de template de rodape no fundo.
5. Guarde.

#Formato de marcação de templates

Por baixo, cada template é um ficheiro HTML de marcação de blocos. Aqui está um templates/single.html simplificado:

<!-- wp:template-part {"slug":"header","area":"header"} /-->

<!-- wp:group {"tagName":"main","layout":{"type":"constrained"}} -->
<main class="wp-block-group">
    <!-- wp:post-title {"level":1} /-->
    <!-- wp:post-featured-image /-->
    <!-- wp:post-content /-->
    <!-- wp:post-terms {"term":"category"} /-->
    <!-- wp:post-terms {"term":"post_tag"} /-->
</main>
<!-- /wp:group -->

<!-- wp:template-part {"slug":"footer","area":"footer"} /-->

As partes de template ficam no diretorio parts/. Um parts/header.html pode ter esté aspeto:

<!-- wp:group {"tagName":"header","layout":{"type":"flex","justifyContent":"space-between"}} -->
<header class="wp-block-group">
    <!-- wp:site-title /-->
    <!-- wp:navigation /-->
</header>
<!-- /wp:group -->

Está estrutura elimina as tags de template PHP (get_header(), the_title(), the_content()) em favor de marcação de blocos declarativa. O resultado é um tema que designers e editores de conteúdo podem modificar diretamente no Site Editor.

#Fundamentos da configuração theme.json

O theme.json é o único ficheiro de configuração que controla o qué o editor disponibiliza e como o front-end sé apresenta. Fica na raiz do seu tema de blocos.

#Exemplo mínimo de theme.json

{
  "$schema": "https://schemas.wp.org/wp/6.7/theme.json",
  "version": 3,
  "settings": {
    "color": {
      "palette": [
        { "slug": "primary", "color": "#1e40af", "name": "Primary" },
        { "slug": "secondary", "color": "#9333ea", "name": "Secondary" },
        { "slug": "base", "color": "#ffffff", "name": "Base" },
        { "slug": "contrast", "color": "#1a1a1a", "name": "Contrast" }
      ],
      "gradients": [],
      "defaultPalette": false,
      "defaultGradients": false
    },
    "typography": {
      "fontFamilies": [
        {
          "fontFamily": "Inter, sans-serif",
          "slug": "body",
          "name": "Body"
        },
        {
          "fontFamily": "'Space Grotesk', sans-serif",
          "slug": "heading",
          "name": "Heading"
        }
      ],
      "fontSizes": [
        { "slug": "small", "size": "0.875rem", "name": "Small" },
        { "slug": "medium", "size": "1rem", "name": "Medium" },
        { "slug": "large", "size": "1.5rem", "name": "Large" },
        { "slug": "x-large", "size": "2.25rem", "name": "Extra Large" }
      ]
    },
    "spacing": {
      "units": ["rem", "vh", "vw", "%"],
      "spacingSizes": [
        { "slug": "10", "size": "0.5rem", "name": "Tiny" },
        { "slug": "20", "size": "1rem", "name": "Small" },
        { "slug": "30", "size": "1.5rem", "name": "Medium" },
        { "slug": "40", "size": "2.5rem", "name": "Large" },
        { "slug": "50", "size": "4rem", "name": "Extra Large" }
      ]
    },
    "layout": {
      "contentSize": "720px",
      "wideSize": "1200px"
    },
    "appearanceTools": true
  },
  "styles": {
    "color": {
      "background": "var(--wp--preset--color--base)",
      "text": "var(--wp--preset--color--contrast)"
    },
    "typography": {
      "fontFamily": "var(--wp--preset--font-family--body)",
      "fontSize": "var(--wp--preset--font-size--medium)",
      "lineHeight": "1.6"
    },
    "elements": {
      "heading": {
        "typography": {
          "fontFamily": "var(--wp--preset--font-family--heading)",
          "fontWeight": "700"
        }
      },
      "link": {
        "color": {
          "text": "var(--wp--preset--color--primary)"
        }
      }
    },
    "blocks": {
      "core/button": {
        "color": {
          "background": "var(--wp--preset--color--primary)",
          "text": "var(--wp--preset--color--base)"
        },
        "border": {
          "radius": "4px"
        }
      }
    }
  }
}

#Explicação das seccoes principais

• version - útilize sempre 3 para WordPress 6.6 e posterior.
• settings - define que controlos aparecem no editor: paletas de cores, familias de fontes, tamanhos de fonte, predefinições de espacamento, larguras de layout e interruptores de funcionalidades.
• styles - aplica valores CSS predefinidos a raiz, elementos (títulos, ligacoes, botoes, legendas) e blocos individuais.
• appearanceTools - um atalho qué ativa controlos de borda, espacamento, tipografia e dimensões na barra lateral.

O motor converté o theme.json em propriedades CSS personalizadas (como --wp--preset--color--primary) que cascateiam por todo o site. Isto significa qué um ficheiro governa os tokens de design tanto para o editor como para o front-end.

#Os melhores plugins de blocos para WordPress em 2026

O editor base cobré a maioria das necessidades, mas plugins de blocos de terceiros preenchem as lacunas com layouts avancados, controlos de design e blocos especializados.

#Spectra (anteriormente Ultimate Addons for Gutenberg)

Desenvolvido pela Brainstorm Force (a equipa por tras do plugin Starter Templates), o Spectra adiciona mais de 30 blocos: temporizadores de contagem decrescente, classificacoes por estrelas, listas de icones, listas de preços, modais, separadores é um bloco de formularios completo. Inclui um bloco de contentor com modos de layout flex e grid, tornando-o adequado para designs de página complexos sem um page builder tradicional. Os preços são definidos individualmente conformé o nível de funcionalidades.

#GenerateBlocks

Construido pela equipa GeneratePress, o GenerateBlocks adota uma abordagem mínima: quatro blocos principais (contentor, título, botoes, imagem) que dependem de definições flexiveis em vez de dezenas de blocos de proposito único. O resultado é um output leve com CSS mínimo. Os útilizadores avancados apreciam a integração com query loop é o sistema de dados dinamicos que puxa meta de publicações, campos personalizados e dados de taxonomia para layouts de blocos.

#Stackable

O Stackablé oferece mais de 40 blocos com uma biblioteca de design visual de mais de 200 layouts pre-construidos. A sua funcionalidade distintiva é um sistema de design unificado onde tipografia global, paletas de cores e escalas de espacamento se propagam automáticamente para cada bloco Stackable. A versão gratuita cobré a maioria dos casos de uso, enquanto o nível premium adiciona conteúdo dinâmico, exibicao condicional e efeitos de movimento.

#Kadence Blocks

O Kadence Blocks fornecé um sistema de layout de linhas/colunas, bloco de título avançado, caixas de informação, listas de icones, índice de conteúdos é um bloco de formulario. A biblioteca de design inclui padrões de página completa e de secção. O Kadence combina especialmente bem com o tema Kadence, partilhando um sistema de tokens de design. Os preços do nível pro são definidos individualmente e variam com base no número de sites.

#Escolher o plugin certo

Escolha GenerateBlocks para projetos criticos em performance, Spectra ou Stackable para páginas com design exigente e Kadence Blocks quando precisar dé um construtor de formularios robusto ao lado de ferramentas de layout.

#Construir um tema de blocos simples de raiz

Combinando tudo o que foi abordado acima, segue-sé um percurso passo a passo para criar um tema de blocos mínimo.

#Passo 1: estrutura de pastas

my-block-theme/
  style.css
  theme.json
  functions.php
  templates/
    index.html
    single.html
    page.html
    404.html
  parts/
    header.html
    footer.html
  patterns/
    hero-banner.php

#Passo 2: cabecalho style.css

/*
Theme Name: My Block Theme
Theme URI: https://wppoland.com
Author: wppoland.com
Author URI: https://wppoland.com
Description: Um tema de blocos mínimo para aprender full site editing.
Version: 1.0.0
Requires at least: 6.4
Tested up to: 6.7
Requires PHP: 8.0
License: GPL-2.0-or-later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: my-block-theme
*/

Não e necessário CSS adicional aqui. Toda a estilizacao flui através do theme.json e do sistema de estilos globais.

#Passo 3: theme.json

Utilizé o exemplo da secção anterior. Ajusté a paleta de cores é a tipografia para corresponder a sua marca.

#Passo 4: templates

templates/index.html (o template de reserva):

<!-- wp:template-part {"slug":"header","area":"header"} /-->

<!-- wp:group {"tagName":"main","layout":{"type":"constrained"}} -->
<main class="wp-block-group">
    <!-- wp:query {"queryId":1,"query":{"perPage":10,"pages":0,"offset":0,"postType":"post","order":"desc","orderBy":"date","inherit":true}} -->
    <div class="wp-block-query">
        <!-- wp:post-template -->
            <!-- wp:post-title {"isLink":true} /-->
            <!-- wp:post-excerpt /-->
            <!-- wp:post-date /-->
        <!-- /wp:post-template -->
        <!-- wp:query-págination -->
            <!-- wp:query-págination-previous /-->
            <!-- wp:query-págination-numbers /-->
            <!-- wp:query-págination-next /-->
        <!-- /wp:query-págination -->
    </div>
    <!-- /wp:query -->
</main>
<!-- /wp:group -->

<!-- wp:template-part {"slug":"footer","area":"footer"} /-->

templates/404.html:

<!-- wp:template-part {"slug":"header","area":"header"} /-->

<!-- wp:group {"tagName":"main","layout":{"type":"constrained"}} -->
<main class="wp-block-group">
    <!-- wp:heading {"level":1} -->
    <h1 class="wp-block-heading">Página não encontrada</h1>
    <!-- /wp:heading -->
    <!-- wp:paragraph -->
    <p>A página que procura não existe. Tente pesquisar ou volté a página inicial.</p>
    <!-- /wp:paragraph -->
    <!-- wp:search {"label":"Pesquisar","buttonText":"Pesquisar"} /-->
</main>
<!-- /wp:group -->

<!-- wp:template-part {"slug":"footer","area":"footer"} /-->

#Passo 5: partes de template

parts/header.html:

<!-- wp:group {"tagName":"header","style":{"spacing":{"padding":{"top":"var:preset|spacing|20","bottom":"var:preset|spacing|20"}}},"layout":{"type":"constrained"}} -->
<header class="wp-block-group" style="padding-top:var(--wp--preset--spacing--20);padding-bottom:var(--wp--preset--spacing--20)">
    <!-- wp:group {"layout":{"type":"flex","justifyContent":"space-between"}} -->
    <div class="wp-block-group">
        <!-- wp:site-title /-->
        <!-- wp:navigation {"layout":{"type":"flex"}} /-->
    </div>
    <!-- /wp:group -->
</header>
<!-- /wp:group -->

parts/footer.html:

<!-- wp:group {"tagName":"footer","style":{"spacing":{"padding":{"top":"var:preset|spacing|30","bottom":"var:preset|spacing|30"}}},"backgroundColor":"contrast","textColor":"base","layout":{"type":"constrained"}} -->
<footer class="wp-block-group has-base-color has-contrast-background-color has-text-color has-background" style="padding-top:var(--wp--preset--spacing--30);padding-bottom:var(--wp--preset--spacing--30)">
    <!-- wp:paragraph {"align":"center","fontSize":"small"} -->
    <p class="has-text-align-center has-small-font-size">Construido com WordPress e blocos.</p>
    <!-- /wp:paragraph -->
</footer>
<!-- /wp:group -->

#Passo 6: padrão registado automáticamente

patterns/hero-banner.php:

<?php
/**
 * Title: Banner hero
 * Slug: my-block-theme/hero-banner
 * Categories: featured, banner
 * Keywords: hero, cta, landing
 */
?>

<!-- wp:cover {"overlayColor":"primary","isUserOverlayColor":true,"minHeight":480,"align":"full"} -->
<div class="wp-block-cover alignfull" style="min-height:480px">
    <span class="wp-block-cover__background has-primary-background-color"></span>
    <div class="wp-block-cover__inner-container">
        <!-- wp:heading {"textAlign":"center","level":1,"textColor":"base"} -->
        <h1 class="wp-block-heading has-text-align-center has-base-color has-text-color">Bem-vindo ao My Block Theme</h1>
        <!-- /wp:heading -->
        <!-- wp:paragraph {"align":"center","textColor":"base"} -->
        <p class="has-text-align-center has-base-color has-text-color">Um tema WordPress leve, centrado em blocos.</p>
        <!-- /wp:paragraph -->
        <!-- wp:buttons {"layout":{"type":"flex","justifyContent":"center"}} -->
        <div class="wp-block-buttons">
            <!-- wp:button {"backgroundColor":"base","textColor":"primary"} -->
            <div class="wp-block-button"><a class="wp-block-button__link has-primary-color has-base-background-color has-text-color has-background wp-element-button">Saber mais</a></div>
            <!-- /wp:button -->
        </div>
        <!-- /wp:buttons -->
    </div>
</div>
<!-- /wp:cover -->

#Passo 7: functions.php (melhorias opcionais)

<?php
declare(strict_types=1);

add_action('after_setup_theme', function (): void {
    add_theme_support('wp-block-styles');
    add_theme_support('editor-styles');
    add_editor_style('style.css');
});

add_action('wp_enqueue_scripts', function (): void {
    wp_enqueue_style(
        'my-block-theme-style',
        get_stylesheet_uri(),
        [],
        wp_get_theme()->get('Version')
    );
});

Carregué a pasta para wp-content/themes/, ative-o é abra Aparencia > Editor. Tem agora um tema de blocos totalmente funcional onde cada template, padrão e estilo e editavel a partir do navegador.

#Dicas avançadas para desenvolvimento centrado em blocos

#Bloquear blocos para evitar edições acidentais

Ao construir templates para clientes, bloqueie blocos para restringir a movimentacao e remocao:

<!-- wp:group {"lock":{"move":true,"remove":true}} -->
<div class="wp-block-group">
    <!-- wp:paragraph -->
    <p>Este bloco não pode ser movido ou eliminado por editores.</p>
    <!-- /wp:paragraph -->
</div>
<!-- /wp:group -->

O conteúdo dentro de blocos bloqueados permanece editavel, mas a integridade estrutural mantem-se intacta.

#Utilizar variações de blocos para consistencia

Registe variações de blocos para fornecer instancias pre-configuradas de blocos base. Por exemplo, uma variacao “membro da equipa” do bloco media-and-text:

<?php
add_action('enqueue_block_editor_assets', function (): void {
    wp_add_inline_script(
        'wp-blocks',
        "wp.blocks.registerBlockVariation('core/media-text', {
            name: 'team-member',
            title: 'Team Member',
            attributes: {
                mediaPosition: 'left',
                verticalAlignment: 'center',
            },
            scope: ['inserter'],
        });"
    );
});

As variações aparecem como blocos distintos no painel de inserção enquanto partilham o código do bloco pai.

#Tirar partido do pacote create-block

Para blocos personalizados além do que padrões e variações cobrem, útilizé a ferramenta oficial de scaffolding @wordpress/create-block:

npx @wordpress/create-block my-custom-block --variant dynamic

Isto gera um plugin com ferramentas de construcao (webpack, Babel, ESLint), uma função edit baseada em React é um render_callback PHP para renderizacao dinâmica do lado do servidor. E o caminho recomendado para qualquer bloco que precise de buscar dados, executar consultas ou exibir conteúdo dinâmico.

#Erros comuns e como evita-los

Misturar templates classicos e de blocos. Um tema é ou um tema de blocos ou um tema classico. Colocar index.php ao lado de templates/index.html cria comportamento de fallback imprevisivel. Comprometa-se com uma abordagem por tema.

Substituir theme.json com CSS inline. Estilos inline contornam a cascata de estilos globais e quebram os controlos de estilo do Site Editor. Utilize sempre predefinições theme.json e propriedades CSS personalizadas.

Ignorar o diretorio patterns. Muitos programadores ainda registam padrões exclusivamenté através de PHP. O diretorio patterns/ com cabecalhos de ficheiro e mais simples, não requer registo de hooks e mantem a marcação de padrões separada da lógica.

Esquecer de testar com diferentes funções de útilizador. Editores e Autores veem uma versão filtrada do editor de blocos. A edicao de templates, estilos globais e certos blocos podem estar ocultos com base nas permissoes. Verifique sempré a experiência de edicao para cada função qué a útilizara.

Não exportar alterações do Site Editor. As modificacoes feitas no navegador são armazenadas na base de dados. Se reimplementar o tema sem exportar essas alterações para ficheiros, elas desaparecem. Utilizé a função de exportacao do Site Editor ou o comando WP-CLI wp theme export para sincronizar as alterações de volta para o controlo de versões.

#O futuro dos blocos no WordPress

O projeto Gutenberg está organizado em quatro fases: edicao mais fácil (lancada), personalização (atual, FSE), colaboração (em progresso) e multilingue (planeada). A Fase 3, colaboração em tempo real, trara edicao simultanea ao estilo do Google Docs para o editor de blocos. A Fase 4 pretende tornar o WordPress nativamente multilingue sem plugins.

Os temas de blocos já são o padrão para novas instalacoes WordPress. Os temas classicos continuam a ser suportados, mas o desenvolvimento de novas APIs e ferramentas de design foca-se no paradigma de blocos. Investir em competencias centradas em blocos agora posiciona a sua equipa para cada lançamento importante do WordPress até 2028 é além.

#Como a wppoland.com aborda o desenvolvimento de blocos

Na wppoland.com, construimos cada projeto de cliente com arquitetura centrada em blocos. O nosso fluxo de trabalho comeca com tokens de design em theme.json, avanca para padrões de blocos personalizados para seccoes repetitivas e termina com templates bloqueados que dao liberdadé aos editores de conteúdo sem risco estrutural.

Para projetos que necessitam de blocos além do qué o core e plugins existentes oferecem, desenvolvemos blocos personalizados útilizando o conjunto de ferramentas @wordpress/create-block, com renderizacao do lado do servidor para conteúdo dinâmico e integração total com os estilos globais do Site Editor.

Se precisa dé um tema de blocos personalizado, uma migração dé um tema classico para full site editing ou desenvolvimento de blocos a medida para o seu fluxo de trabalho de conteúdo, contacté a equipa wppoland.com. Entregamos soluções de blocos adaptadas aos seus requisitos editoriais e empresariais, com preços definidos individualmente com base no ambito do projeto.