Como criar um tema de bloco do WordPress (em 3 etapas)

Como iniciante no WordPress, você pode ter evitado criar temas personalizados no passado recente, pensando que exigia um processo de codificação complicado. Agora você pode personalizar todo o seu site com o Full Site Editing (FSE), mas ainda há o problema de exportar seus designs personalizados.

Felizmente, você pode criar facilmente um tema de bloco com o plugin Create Block Theme. Depois de personalizar seu tema com o Editor do Site, você pode exportá-lo como um tema de bloco personalizado. Então, você pode instalá-lo em outros sites em vez de ter que reconstruir seu design do zero.

Neste post, explicaremos o que é um tema de bloco e como você pode usar a ferramenta Criar tema de bloco para criar um. Em seguida, mostraremos como fazer isso em três etapas simples. Vamos começar!

O que é um tema de bloco do WordPress?

Quando o Gutenberg foi lançado como parte do WordPress 5.0, ele transformou completamente a experiência de criação de conteúdo. Isso porque seu novo Editor de Blocos permite personalizar posts e páginas adicionando diferentes blocos de conteúdo:

Em 2021, o WordPress estendeu ainda mais esse recurso. A atualização 5.8 lançou o Full Site Editing, permitindo que você construa todo o seu site usando um sistema baseado em blocos. Com o Editor do Site, você pode adicionar blocos temáticos ao seu site, criar modelos de blocos e muito mais:

Para começar a usar o Full Site Editing, no entanto, você precisará instalar um tema de bloco. Simplificando, estes são temas que são construídos com blocos Gutenberg.

Aqui estão algumas das funcionalidades que você ganhará ao instalar um tema de bloco do WordPress:

• Edite qualquer parte do seu site sem código
• Personalize cores e tipografia com estilos globais
• Melhore a velocidade do site carregando apenas estilos para blocos renderizados na página
• Adicione recursos de acessibilidade como um botão Pular para conteúdo e navegação pelo teclado

Usando um tema de bloco, você pode ter controle total sobre o design do seu site. Anteriormente, seria difícil editar arquivos de tema sem habilidades de codificação. No entanto, agora qualquer pessoa pode personalizar um site simplesmente criando e editando layouts de blocos.

Uma introdução ao plugin Create Block Theme

Em muitos casos, proprietários e desenvolvedores de sites criam temas filhos personalizados para ajudá-los a personalizar um site. Um tema filho é simplesmente um tema que herda a aparência e a funcionalidade de seu tema pai. Usando um tema filho, você pode editar com segurança um tema de bloco sem perder as alterações com novas atualizações de software.

Você pode construir um tema filho criando uma nova pasta de tema e folha de estilo com a codificação do tema pai. Parece bastante simples, mas geralmente envolve o uso de técnicas complicadas que podem ser difíceis para iniciantes.

Felizmente, os desenvolvedores do WordPress criaram o plugin Create Block Theme para resolver esse problema. Graças a esta nova ferramenta, você pode exportar facilmente seu tema de bloco editado:

Isso significa que você pode criar temas de blocos personalizados e usá-los em outros sites. Depois de fazer alterações com o Editor do Site, você pode baixar seu novo design como um tema filho, clone ou variação de estilo do tema pai. Isso pode simplificar o design do site e torná-lo mais acessível para usuários de todos os níveis.

Como criar um tema de bloco do WordPress (em 3 etapas)

Agora que você conhece os temas de bloco e suas vantagens, vamos discutir como criar um no WordPress. Dessa forma, você não precisará editar arquivos de tema toda vez que precisar criar um novo tema de bloco.

Etapa 1: instale um tema de bloco do WordPress

Para criar seu primeiro tema de bloco, você precisará começar com um tema de bloco pai. Usando o diretório de temas do WordPress, você pode escolher entre mais de cem opções diferentes. Aqui, basta clicar na guia Block Themes para adicionar um filtro Full Site Editing :

Depois de encontrar um tema de bloco que você gosta, você pode baixá-lo. Em seguida, vá para Aparência > Temas no painel do WordPress para instalar e ativar o novo tema. Para este tutorial, usaremos Twenty Twenty-Two:

Agora você precisará selecionar Plugins> Adicionar novo e procurar por 'Criar tema de bloco'. Em seguida, instale e ative o plugin:

Antes de começar a editar seu tema, você também precisará ter a versão mais recente do plugin Gutenberg. Se ainda não o fez, certifique-se de que esta ferramenta também esteja instalada, ativada e atualizada.

Etapa 2: personalize seu tema com o editor do site

Em seguida, você pode abrir o Editor do Site e modificar o tema do bloco. Para fazer isso, navegue até Aparência > Editor (beta) :

Isso abrirá o Editor de Site Completo. Aqui, você pode clicar em elementos específicos como o cabeçalho ou rodapé para alterar as configurações do bloco:

Ao clicar no ícone do círculo duotônico no canto superior direito, você pode atualizar a tipografia, as cores e o layout. Você pode até escolher uma das combinações de estilo de tema padrão:

Se você precisar adicionar novos blocos, você pode selecionar o botão +. A partir desta lista de opções, você pode simplesmente arrastar e soltar elementos na página:

Para visualizar seus modelos de tema, clique no logotipo do WordPress no canto superior esquerdo. Aqui, você pode selecionar modelos ou peças de modelo:

Dependendo de seus objetivos de design, você pode querer adicionar novos modelos. Como alternativa, você pode editar as opções padrão disponíveis:

Depois de selecionar um modelo, você abrirá o editor de modelos. Você pode editar esta página adicionando novos blocos, padrões de bloco ou peças de modelo:

Em última análise, existem maneiras quase infinitas de criar seu tema de bloco. Depois de fazer todas as edições necessárias, salve suas alterações.

Etapa 3: exporte seu tema de bloco

Para reutilizar este tema de bloco em outros sites, navegue até Aparência > Criar tema de bloco . Isso permitirá que você exporte seu novo tema de bloco de algumas maneiras diferentes:

Se você deseja exportar o tema com as alterações que acabou de fazer, selecione Exportar . No entanto, aqui estão as opções alternativas de exportação disponíveis com o plugin Create Block Theme:

• Criar um tema filho : baixa um novo tema filho usando o tema ativado como pai.
• Clonar o tema atual : clona o tema ativado, incluindo todos os seus ativos e alterações do usuário.
• Substituir arquivos de tema : salva as edições conforme o tema é alterado e, em seguida, exclui as alterações do usuário.
• Gerar tema em branco : cria um tema padrão no diretório de temas do seu site.
• Criar uma variação de estilo : Salva as alterações como uma variação de Estilos Globais do tema ativado.

Se você selecionar Exportar ou Substituir , você pode simplesmente baixar seus arquivos de tema. Para qualquer outra opção, você precisará fornecer um nome de tema, descrição, URI de tema, autor e URI de autor:

A única exceção é a variação de estilo. Isso requer apenas um nome de variação :

Depois de selecionar uma dessas opções, clique em Criar tema . Isso fará o download do seu tema de bloco personalizado como um arquivo .zip, que contém todos os arquivos de tema editados. Você pode então instalar este tema em outros sites para acelerar o processo de desenvolvimento.

Conclusão

Antes da edição completa do site e bloqueio de temas, criar seu próprio design de site exclusivo era um processo complicado. Se você é um iniciante no WordPress, pode não ter as habilidades de codificação necessárias para o trabalho. No entanto, agora, o Editor do Site e o plugin Create Block Theme podem trabalhar juntos para simplificar radicalmente essa tarefa anteriormente complicada.

Para recapitular, veja como você pode criar um tema de bloco do WordPress:

1. Instale um tema de bloco do WordPress.
2. Personalize seu tema com o Editor do Site.
3. Exporte seu tema de bloco com Criar tema de bloco.

Você tem alguma dúvida sobre como criar seu primeiro tema de bloco no WordPress? Deixe-nos saber na seção de comentários abaixo!