No início, os usuários do WordPress tinham um relacionamento agridoce com o construtor baseado em blocos do WordPress. Então, como descobrimos em nosso guia para Gutenberg , o novo editor vem com recursos incríveis que tornam a criação de conteúdo bonito fácil e divertida. Agora, alguns não se cansam do editor.

O Gutenberg oferece recursos suficientes para criar páginas e postagens notáveis, sem escrever código. Não importa o conteúdo que você deseja adicionar, o Gutenberg tem apenas o bloco.

Deseja modificar e estilizar extensivamente cada bloco de conteúdo? Gutenberg tem suas costas graças a uma bateria de opções de personalização. Quer ainda mais blocos do que está disponível no editor padrão? Há uma tonelada de plugins adicionais do Gutenberg por aí.

É por isso que é triste que muitos usuários não conheçam os Blocos Reutilizáveis , um dos recursos brilhantes do Gutenberg. Se você não tem ideia do que estamos falando, blocos reutilizáveis são simplesmente blocos de conteúdo que você cria, salva e reutiliza à vontade .

Digamos que você queira adicionar uma frase de chamariz, nota de agradecimento, assinatura, formulário ou qualquer outra coisa no final de cada postagem ou página.

No passado, você tinha que salvar o recurso em um arquivo de texto em seu computador. Quando você precisasse, você copiaria e colaria em sua postagem ou página. Gutenberg aliviou esse problema. Agora você não precisa usar arquivos de texto ou criar os mesmos blocos do zero todas as vezes.

Você pode criar um único bloco reutilizável e usá-lo não apenas em seus posts e páginas, mas também em outros sites WordPress.

Se você cria muitos sites ou precisa adicionar conteúdo especial a cada postagem/página, os blocos reutilizáveis do Gutenberg podem ajudá-lo a economizar muito tempo.

E no post de hoje, mostramos exatamente como criar e exportar blocos reutilizáveis do Gutenberg no WordPress. Nosso objetivo é ajudá-lo a mover e reutilizar blocos de conteúdo personalizados em vários posts/páginas/sites WordPress facilmente.

A parte: se você criar um bloco usando um plugin como Getwid , por exemplo, você deve instalar o plugin nos outros sites WordPress que deseja reutilizar o referido bloco. Observe também que seus blocos podem parecer um pouco diferentes de tema para tema, mas tudo bem porque o Gutenberg oferece muito poder de personalização.

Isso fora do caminho, pegue uma caneca de café e boa leitura.

Em primeiro lugar, você precisa de blocos reutilizáveis

Infelizmente, você não pode exportar ou importar blocos regulares . Para exportar e importar blocos do Gutenberg, você deve primeiro criar blocos reutilizáveis .

Para fins de ilustração, criarei uma nota de agradecimento que gostaria de adicionar ao final de cada postagem que publicar. Você sabe, sem reescrever a nota toda vez que preciso adicioná-la a um post

Minha nota de agradecimento não é nada complexa; apenas um bloco de parágrafo simples com links para Twitter e Facebook. Tenha em mente que seu bloco pode ser o que você quiser – um banner, slider de imagem, cotação, lista, posts mais recentes, formulário do MailChimp, etc.

Mais tarde, mostrarei como exportar a nota (ler, bloquear) para um segundo site WordPress. Parece bom? Ótimo, vamos começar.

Como criar um bloco reutilizável

Criar um bloco reutilizável é incrivelmente fácil. Navegue até  Posts > Adicionar novo para iniciar o editor Gutenberg:

Em seguida, clique no ícone Adicionar bloco  (+) e escolha seu bloco de conteúdo. No nosso caso, adicionei o bloco de parágrafo, conforme mostrado na imagem a seguir.

Depois disso, personalize e estilize seu bloco de acordo com suas necessidades. Eu adicionei algum texto, links de mídia social e cor de fundo. Veja como nosso novo bloco, também conhecido como nota de agradecimento,  fica no meu editor Gutenberg:

Muito bom John Doe. Muito agradável. Agora, provavelmente seguirei seu blog nas redes sociais Seguindo em frente rapidamente.

No momento, a nota acima é um  bloco regular . Precisamos convertê-lo em um  bloco reutilizável que possamos exportar e importar. Para fazer isso, clique no ícone  Mais opções e, em seguida, em Adicionar aos blocos reutilizáveis , conforme mostrado abaixo.

Em seguida, nomeie seu bloco reutilizável e pressione o  botão Salvar , como visto abaixo.

E pronto, você acabou de criar seu primeiro bloco reutilizável. Valeu amigo.

Como usar blocos reutilizáveis

Adicionar o bloco reutilizável que acabamos de criar em suas postagens ou páginas é extremamente fácil. Depois de adicionar o conteúdo necessário à sua postagem ou página, clique no  ícone Adicionar bloco (+) , role até a  guia Blocos reutilizáveis e escolha seu bloco (no nosso caso, nota de agradecimento), conforme mostrado abaixo.

Depois de adicionar o bloco reutilizável à sua postagem ou página, clique no  botão Visualizar/ Publicar para visualizar seus resultados no front-end. Aqui está o que eu tenho:

Meu site de teste está executando o tema Twenty Twenty.

A melhor parte é que posso reutilizar meu  bloco de nota de agradecimento a qualquer momento, sem precisar criá-lo do zero. Posso adicioná-lo a todos os tipos de postagem que suportam blocos Gutenberg.

Agora que você sabe como criar e usar blocos reutilizáveis, vamos aprender mais sobre como exportar esses blocos para outro site WordPress. Para evitar confusão, usarei o mesmo bloco que acabamos de criar.

Como exportar blocos Gutenberg no WordPress

Exportar um bloco reutilizável do Gutenberg é o que os alunos da quarta série farão em pouco tempo.

O que fazer?

Dentro do editor Gutenberg, clique no  ícone  Mais ferramentas e opções e, em seguida, Gerenciar todos os blocos reutilizáveis , conforme destacamos abaixo:

Fazer isso leva você à  tela Blocos , onde você pode visualizar e gerenciar todos os seus blocos reutilizáveis:

Temos apenas o  bloco de Nota de agradecimento , mas a tela acima será preenchida à medida que você criar mais. Para exportar, passe o mouse sobre o título e clique no link Exportar como JSON que aparece. Veja a imagem abaixo.

Em seguida, salve o arquivo JSON em seu computador:

Agora que temos o arquivo JSON em seu computador, é hora de importar o bloco para nosso segundo site de teste.

Como importar blocos Gutenberg no WordPress

Importar seus blocos reutilizáveis é tão fácil quanto A, B, C. Em primeiro lugar, abra o editor Gutenberg. Em segundo lugar, clique no  ícone  Mais ferramentas e opções e, em seguida, Gerenciar todos os blocos reutilizáveis , conforme mostrado abaixo.

Na  tela Blocks a seguir, clique em  Import from JSON , escolha o arquivo que você baixou anteriormente e pressione o  botão Import nessa ordem:

E é isso! Assim, você importou com sucesso um bloco Gutenberg reutilizável para o seu segundo site WordPress:

Não foi tão fácil? Depois, você pode usar e reutilizar seu bloco Gutenberg no segundo site quantas vezes desejar.

Existem plugins para exportar blocos do Gutenberg?

Ah, sim, e encontrei um da ThemeIsle, um respeitável desenvolvedor do WordPress. É um plugin gratuito conhecido como Blocks Export Import. Essencialmente, o plugin permite que você pule todo este tutorial. Sim, está certo; você nem precisa criar blocos reutilizáveis.

Instale e ative o plug-in e, em seguida, abra o editor Gutenberg. Projete seu bloco como desejar e clique no  ícone Mais opções . Em seguida, clique em  Export JSON , conforme mostrado abaixo. Aqui está a captura de tela:

Fazê-lo vai baixar o arquivo JSON para o seu computador. Para importar o arquivo JSON usando o plug-in, abra o editor Gutenberg. Em seguida, clique no  ícone  Add Block e, em seguida, import Blocks from JSON na  guia Widgets :

Depois disso, clique em  Escolher arquivo para selecionar o arquivo do seu computador e pressione o  botão Carregar :

O único problema com o método do plugin é que seus blocos não serão salvos no seu site WordPress. Para salvar blocos em seu banco de dados WordPress, você deve usar o método manual. Talvez isso mude no futuro.

Infelizmente, não consegui encontrar outro plugin. Ainda assim, o plug-in pode economizar muito tempo se você não se importar em salvar blocos reutilizáveis em seu site. Você terá os blocos como arquivos JSON em seu computador.

Blocos reutilizáveis de Gutenberg são um salva-vidas. Eles permitem que você replique modelos e recursos rapidamente, já que você não começa do zero. Se você criar muitos posts/páginas e/ou sites, aprender a exportar blocos do Gutenberg será útil.

Tem dúvidas ou sugestões sobre os blocos Gutenberg? Por favor, deixe-nos saber nos comentários abaixo