Antes de entrarmos em detalhes sobre como usar o editor WordPress, aqui está uma rápida explicação de por que você pode ver diferentes editores em artigos WordPress online e o que é o editor “Gutenberg".

O que é Gutenberg?

Por mais de uma década, o WordPress usou um editor de texto parecido com este agora considerado o “editor clássico”:

Em seguida, WordPress versão 5.0 saiu em 06 de dezembro de 2018, e mudou todos os sites para o novo editor, que deram o nome de ” Gutenberg ” famosa após a primeira prensa de impressão.

Agora que já se passaram quase dois anos, o nome Gutenberg é usado com menos frequência, pois as pessoas simplesmente se referem a ele como o editor ou o editor de bloco.

Então, se você vir alguém online falando sobre o editor “Gutenberg”, eles estão se referindo apenas ao editor que agora é usado em todos os sites WordPress (ao contrário do editor clássico).

Como faço para obter o editor Gutenberg?

Você deve tê-lo por padrão. Você não precisa “mudar” para o editor Gutenberg para habilitá-lo.

Se você visitar uma postagem ou página no painel de administração, deve ser semelhante a:

Caso contrário, certifique-se de usar pelo menos a versão 5.0 do WordPress. Você pode verificar sua versão do WordPress no canto inferior direito do painel.

Além disso, verifique o menu Plug-ins para ver se o plug-in do Editor Clássico foi instalado, o que reverteria o seu site para o editor antigo. Se estiver instalado, você pode desativá-lo e excluí-lo.

Você não precisa instalar o plugin do editor Gutenberg. Este é um plugin beta para usuários que desejam experimentar novos recursos antes de serem incluídos no núcleo do WordPress.

Agora que você entende de onde veio o nome “Gutenberg” e como obter acesso ao editor, vamos falar sobre blocos.

É um editor de blocos, não um editor de texto

Você pode pensar no editor de blocos como um tipo especial de editor de texto.

A principal diferença é que em vez de todo o texto ser armazenado em uma única área de texto, cada bloco é como sua própria área de texto.

Isso pode parecer estranho no início, mas é muito melhor adaptado para conteúdo multimídia, como este post de blog, que está cheio de imagens e GIFs. Em vez de colocar imagens desajeitadamente em seu texto, você tem blocos separando imagens e parágrafos de maneira ordenada.

Para avaliar totalmente essas diferenças, você precisa saber exatamente o que é um bloco.

O que são blocos?

Um bloco WordPress é uma unidade única de conteúdo. Essa unidade de conteúdo pode ser um parágrafo, um título, uma imagem ou uma variedade de outros tipos de conteúdo.

Por exemplo, este parágrafo que você está lendo neste momento é um bloco de parágrafo, e o título acima dele foi adicionado com um bloco de título.

Cada conteúdo que você adiciona a uma página do WordPress está contido em um bloco.

Portanto, um bloco não é um elemento visual – você não vê blocos retangulares na página – um bloco é apenas um termo que significa uma unidade de conteúdo. É um contêiner.

Tudo no editor é um bloco

Embora eu ache extremamente útil entender essa terminologia, sei que não é esse o verdadeiro motivo de você estar aqui.

O que você realmente precisa saber é como adaptar suas técnicas normais de escrita ao editor de blocos. Pode ser frustrante lutar com coisas simples como copiar e colar quando você fez isso perfeitamente durante toda a sua vida.

A seguir estão todas as dicas e truques de fluxo de trabalho de que você precisa para ser eficaz com o editor do WordPress.

Como usar o editor de blocos do WordPress de forma eficaz

Existem algumas coisas que fazem o editor de bloco parecer diferente de um editor de texto normal. Vamos abordar cada um deles um por um.

A primeira coisa que você precisa saber é como adicionar blocos.

Como adicionar novos blocos

Cada conteúdo que você adiciona está contido em um bloco e existem quatro maneiras diferentes de adicionar novos blocos às suas postagens.

Use a tecla Enter

A experiência de digitar no editor de blocos é virtualmente a mesma de um editor de texto normal.

Você pode digitar facilmente usando a tecla Enter para criar novos parágrafos, mas aqui está o insight principal:

Quando você pressiona Enter, cria um novo bloco, não um novo parágrafo. O novo bloco pode se tornar qualquer tipo de bloco (como uma imagem ou vídeo). Ele só se torna um parágrafo quando você digita palavras nele.

Usar a tecla Enter é definitivamente a maneira mais rápida de criar um novo bloco, mas os outros métodos também têm algum mérito.

Use o botão Adicionar bloqueio

A partir de agora, o botão Adicionar bloco é bastante confuso. Espero que eles mudem logo, pois já mudaram muito nos últimos dois anos.

Se você pressionar a tecla Enter para criar um bloco vazio, verá este botão de adição preto no lado direito do editor:

Clicar em irá revelar o pop-up do seletor de bloco, permitindo a você inserir qualquer tipo de conteúdo que desejar.

Acho essa opção confusa porque nem sempre aparece, mesmo quando você passa o mouse entre os blocos. Por esse motivo, recomendo usar principalmente o outro botão que está sempre disponível na parte superior da tela:

Ele oferece uma janela muito maior e mais fácil de navegar para selecionar o tipo de bloco.

Se você é novo no editor de blocos, reserve um tempo para navegar pelo menu e se familiarizar com os diferentes tipos de blocos disponíveis.

Depois de saber quais blocos você tem ao seu alcance, você pode atualizar para o método de inserção rápida superior …

O método de inserção rápida

É assim que adiciono blocos às minhas postagens.

Depois de pressionar a tecla Enter para criar um novo bloco vazio, digite uma barra “/” para abrir o menu de seleção rápida. Em seguida, comece a digitar o nome do bloco que deseja adicionar. Ele aparecerá imediatamente no menu.

Embora você possa usar o mouse para selecionar um bloco, é mais rápido simplesmente usar as setas para cima / para baixo na lista e pressionar Enter novamente. Este método de adicionar imagens e outros elementos é muito mais rápido do que qualquer coisa que você possa fazer com um editor de texto tradicional. Para adicionar uma imagem, basta digitar “/ ima” e clicar em Enter. É minha parte favorita do editor de blocos.

Agora que você sabe como adicionar blocos, vamos falar sobre como selecioná-los e copiá-los.

Como selecionar e copiar conteúdo

Selecionar texto no editor de bloco é muito diferente de um editor de texto normal, mas funciona muito bem quando você conhece a melhor abordagem.

Aqui estão as três maneiras de selecionar texto no editor de bloco.

Clique e arraste o cursor

A forma mais comum de as pessoas selecionarem texto é clicar e arrastar pelas palavras.

Isso funciona bem dentro de blocos, mas você descobrirá que se quiser selecionar palavras específicas entre parágrafos, o editor destaca automaticamente os blocos completos depois que você solta o mouse.

Infelizmente, não há maneira de contornar isso, então você precisará selecionar os blocos completos e excluir as palavras indesejadas após colar.

Se você estiver selecionando um texto para reordená-lo, aguarde, pois falaremos sobre o reordenamento em breve.

O atalho de teclado “selecionar tudo”

A forma como “selecionar tudo” funciona com o editor de bloco é na verdade muito mais agradável do que um editor de texto normal.

Normalmente, em um editor de texto, você pressionaria cmd + a (ctrl + a no Windows) para selecionar todo o texto em todo o artigo. Se você tentar isso no editor de bloco, ele selecionará apenas todo o texto do bloco atual.

No entanto, você pode pressionar cmd + a novamente para selecionar todos os blocos na postagem.

Pessoalmente, acho que isso é muito melhor porque permite que você selecione rapidamente parágrafos inteiros e, opcionalmente, selecione o texto completo quando necessário.

Como selecionar vários blocos

Existem duas maneiras de selecionar vários blocos no editor.

Primeiro, você pode clicar e arrastar o cursor pelos blocos, assim:

Isso funciona bem se você puder ver todos os blocos na tela, mas se estiver selecionando uma grande variedade de blocos, arrastar o cursor contra a borda da tela para rolar ainda mais pode ser confuso e frustrante.

A melhor maneira é clicar no primeiro bloco que deseja selecionar, rolar até o bloco mais distante que deseja selecionar e, em seguida, manter pressionada a tecla SHIFT e clicar nele, assim:

Esta técnica selecionará ambos os blocos em que você clicou e todos os blocos entre eles.

Como copiar sua postagem inteira

Se você precisar copiar todo o conteúdo de uma postagem, você pode usar o duplo cmd + um atalho, ou você pode usar a opção Copiar todo o conteúdo encontrada no menu de configurações.

Essa é uma ótima maneira de mover rapidamente uma postagem de um site WordPress para outro.

Com tudo isso dito, sei que isso ainda não resolve uma de suas principais preocupações: como reorganizar o conteúdo. Vamos mergulhar nisso agora.

Como mover e reorganizar os blocos

Como você acabou de aprender, copiar e colar não é a melhor maneira de reorganizar seus parágrafos. O editor de blocos oferece duas maneiras de mover blocos pela página.

Mova os blocos com as setas

Se precisar mover um bloco um pouco para cima ou para baixo na postagem, você pode usar os botões de seta adicionados à barra de ferramentas:

A barra de ferramentas fica visível sempre que você clica em um bloco

É uma maneira rápida e limpa de reordenar blocos sem a confusão de copiar e colar. Essa técnica funciona para todos os tipos de blocos, incluindo imagens.

Mova blocos com arrastar e soltar

Se você precisar mover um bloco muito mais longe, pode achar mais fácil arrastá-lo e soltá-lo do que clicar na seta “para cima” uma dúzia de vezes.

Se você clicar e segurar nos ícones de seta, a interface é atualizada para que você possa arrastar e soltar o bloco em uma nova posição.

Você verá uma linha azul onde quer que o bloco seja inserido.

Pessoalmente, acho que às vezes é difícil colocar blocos no lugar certo, então uso os botões de seta na maioria das vezes.

Mova vários blocos de uma vez

Se você leu as dicas acima, já sabe que pode manter pressionada a tecla SHIFT para selecionar um intervalo de blocos. Depois de selecionar vários blocos, você verá a barra de ferramentas exibida acima apenas do primeiro bloco. Você pode usar os botões de seta ou arrastar e soltar todo o grupo de uma vez.

A partir de agora, não há como selecionar vários blocos que não sejam consecutivos.

Você ainda pode copiar e colar

Os botões de seta são a maneira mais fácil de mover parágrafos e imagens em sua postagem, mas você ainda pode usar copiar e colar se quiser.

Para fazer isso, você usaria o atalho cmd + a para copiar o conteúdo do bloco, então usaria cmd + x para cortar o conteúdo, e então criaria um novo bloco com a tecla Enter e pressione cmd + v para colar o conteúdo copiado.

Criar, copiar e reorganizar o conteúdo cobre a maioria dos fundamentos. A última técnica importante que você precisa aprender é como remover blocos.

Como deletar blocos

Excluir conteúdo faz parte da criação de conteúdo, então você precisa saber como remover seus bloqueios.

Existem três maneiras de excluir qualquer bloco no editor.

O atalho de teclado para exclusão

Sempre prefiro atalhos de teclado, então é o que recomendo primeiro.

Clique em qualquer bloco e pressione as seguintes teclas.

Mac: ctrl + opção + z
Windows: alt + shift + z

Isso removerá o bloqueio imediatamente.

Exclua selecionando o conteúdo

Se você não quiser aprender o atalho de exclusão extravagante, aqui está outro método rápido para excluir parágrafos e outros blocos:

Clique em algum lugar do bloco
Pressione cmd + a (ctrl + a) para selecionar o conteúdo completo
Pressione Delete / Backspace para excluir o conteúdo
Pressione Delete / Backspace novamente para deletar o bloco

Para um bloco de imagem, você pode simplesmente clicar na imagem e pressionar Delete / Backspace para removê-la.

Use o botão Remover Bloco

Embora mais lento, às vezes você pode querer usar o botão da barra de ferramentas para remover um bloco.

Para excluir um bloco desta forma:

Clique no bloco
Clique no ícone Mais opções
Clique em Remover Bloco

Este método funciona para todos os tipos de bloco.

Às vezes, em vez de excluir totalmente um bloco, você deseja alterá-lo para outro tipo. O editor inclui uma opção de transformação para isso.

Como transformar tipos de bloco

Um benefício do editor de blocos é que a maioria dos blocos pode ser rapidamente transformada de um tipo para outro.

Digamos que você esteja blogando furiosamente. Há faíscas voando do seu teclado e você não tem tempo para se preocupar em escolher os tipos de bloco, então você digita seus títulos como parágrafos normais e continua em frente. Não tem problema.

Você pode clicar em qualquer bloco de parágrafo e, em seguida, clicar no ícone de parágrafo na barra de ferramentas para revelar os tipos de bloco em que ele pode ser transformado.

Isso também funciona para blocos baseados em imagem. Por exemplo, você pode transformar uma imagem em uma galeria ou bloco de “mídia e texto”.

Uma nota rápida sobre os marcadores de posição

Algo que comecei a fazer para manter minha velocidade de escrita é simplesmente inserir blocos de imagem vazios onde irei adicionar minhas imagens posteriormente.

Usando a dica de inserção rápida anterior, digite “/ ima” e pressione Enter para inserir um bloco de imagem, depois pressione a tecla Enter novamente para continuar escrevendo seu próximo parágrafo. Ele deixa para trás um bom espaço reservado onde você mais tarde fará o upload de sua imagem.

Como personalizar as aparências do bloco

Ao contrário do antigo editor de texto, o editor de blocos pode fornecer muitas ferramentas de personalização específicas para blocos.

Por exemplo, se você clicar em um bloco de parágrafo, verá opções para alterar o tamanho da fonte, a cor e muito mais na barra lateral.

Clique no ícone de engrenagem no canto superior direito se você não vir a barra lateral

Sempre que você clicar em um bloco, as opções da barra lateral serão atualizadas para corresponder ao bloco que você selecionou.

As imagens contêm resultados totalmente diferentes, como o texto alternativo e os controles de tamanho.

Se quiser voltar às configurações principais, você pode clicar em qualquer lugar fora dos blocos ou clicar na guia Documento na barra lateral.

Como colocar blocos lado a lado

Uma frustração comum com o editor clássico era como colocar texto e / ou imagens lado a lado. O novo editor torna isso muito mais fácil.

Se você quiser colocar uma imagem ao lado do texto, o melhor método é usar o bloco Mídia e Texto.

Se você quiser colocar imagens próximas umas das outras, uma opção é inserir um bloco de galeria.

Isso é especialmente útil para colocar três ou quatro imagens em uma fileira.

Por último, se quiser colocar várias colunas de texto lado a lado, você pode usar o bloco de colunas. Ao inseri-lo, você pode decidir a largura das colunas, assim:

Gerenciar os blocos sem o bloqueio de coluna pode ser confuso, mas certamente é melhor do que tentar o mesmo layout no editor antigo.

Neste ponto, você aprendeu todos os fundamentos de como usar o editor do WordPress. A seguir, você aprenderá algumas técnicas mais importantes para obter o máximo do editor Gutenberg em seu site.

Como obter ainda mais blocos

O WordPress inclui dezenas de blocos, mas provavelmente você precisará de mais para executar seu site.

Por exemplo, você deseja criar uma página de contato, e isso requer a inserção de um formulário de contato em uma página. Não há bloqueio de formulário de contato, então você precisará adicionar um ao seu site.

Existem duas maneiras de obter mais bloqueios para o seu site.

Instale novos plugins

O método mais comum para obter mais blocos é adicionar novos plug-ins ao seu site.

Por exemplo, WPForms é um excelente plugin de formulário que inclui um construtor de formulário de arrastar e soltar. Inclui um bloco que permite inserir facilmente seus formulários em postagens e páginas.

Hoje em dia, a maioria dos plug-ins que adicionam um novo tipo de conteúdo ao seu site (formulários / controles deslizantes / depoimentos) incluem um bloco.

Existem também muitos “plug-ins de bloqueio” que irão carregar seu site com dezenas de novos tipos de blocos legais. Algumas das opções mais populares são:

Eu recomendo se acostumar com os blocos padrão primeiro, mas quando você estiver pronto para avançar, esses plug-ins são fantásticos.

Adicionar blocos do diretório de blocos

WordPress 5.5 adicionou um novo “diretório de blocos”. Eu o incluo aqui para ser abrangente e porque provavelmente será repetido e se tornará mais popular no futuro.

No entanto, a partir de agora, eu NÃO recomendo que você use porque:

Ainda não há muitos blocos disponíveis, embora existam toneladas de plug-ins que adicionam novos blocos
Os blocos têm muito poucas avaliações de usuários
Você pode apenas instalar um plugin com dezenas de blocos ao invés
É mais difícil navegar por novos blocos do que por plug-ins
Não há como remover blocos depois de adicioná-los (!)

E a única maneira de encontrá-los em primeiro lugar é se você pesquisar um bloco e ele não retornar resultados:

Isso significa que você não pode encontrar novos blocos para palavras-chave como “imagem” ou “embed”, pois eles produzem blocos já instalados.

No geral, é uma experiência muito estranha e incompleta, então é melhor esperar até que o WordPress forneça esse recurso de forma completa antes de usá-lo em seu site. Por enquanto, instale novos plug-ins para adicionar blocos ao seu site.

Como personalizar o editor de bloco

O próprio editor possui algumas opções de personalização para que você possa alterar sua aparência.

O padrão do WordPress é a exibição em tela inteira após cada atualização, mas você pode retornar à exibição padrão desmarcando o modo Tela inteira no menu de opções para desativá-lo.

A outra mudança que você pode gostar é clicar no botão de engrenagem no canto superior direito para ocultar a barra lateral direita.

Se você habilitar o modo de tela cheia e ocultar a barra lateral direita, cria um espaço de escrita limpo e sem distrações.

E se eu quiser o editor clássico de volta?

Após esta postagem, espero que você tenha entendido bem como usar o editor de blocos.

Dito isso, você não pode ser convencido disso. Nesse caso, existem algumas opções se você deseja desativar o editor de Gutenberg ou evitar usá-lo.

Em primeiro lugar, você não precisa usar o editor de blocos. Você pode instalar o plugin do Editor Clássico.

Este plugin é gratuito e a equipe do WordPress se comprometeu a apoiá-lo até 2022. Com base nas análises, você pensaria que é incrível, mas é avaliado principalmente por despeito (Gutenberg não foi bem recebido inicialmente). Na verdade, é um editor de texto medíocre, sem nada de especial a oferecer.

E aqui está outra coisa em que pensar …

Você não precisa escrever seus posts no WordPress.

Você pode escrever suas postagens no Google Docs ou em qualquer outro editor que desejar e, em seguida, importá-las para o WordPress. Para editores como o Google Docs, existem soluções dedicadas para importar enquanto mantém sua formatação, mas com outros editores baseados em bloco, como o Notion, você pode simplesmente copiar e colar suas postagens no WordPress com toda a formatação retida.

No final do dia, o WordPress é onde você publica seu conteúdo, mas não precisa ser o lugar onde você cria seu conteúdo.

Agora que você aprendeu muito sobre o editor de blocos, tenho certeza de que está pronto para usá-lo, mas pensei em compartilhar algumas perspectivas adicionais, já que é um assunto importante.

Você é um especialista em editor de blocos!

Neste guia extenso, você aprendeu todos os fundamentos do editor de bloco, incluindo a terminologia básica, além de um pouco de história do WordPress.

Você aprendeu como:

Adicionar blocos
Copiar e selecionar blocos
Excluir blocos
Mover blocos
Blocos de transformação
Obtenha novos tipos de blocos
E personalize seus blocos

Demora um pouco para se acostumar com o editor de blocos, mas espero que este post tenha esclarecido qualquer confusão que você tenha até agora.

Se você está se divertindo aprendendo mais sobre o WordPress e acha que está pronto para levar a sério a construção de um site incrível, acho que você vai adorar meu curso grátis:

Faça o curso de e-mail WordPress Mastery de 7 dias

Ele vai além do básico para que você possa aprender sobre personalização, desempenho e como ganhar dinheiro com o WordPress.

Se você gostou deste post e ajudou a entender como usar o editor do WordPress, por favor, considere compartilhá-lo com outra pessoa antes de ir.

Obrigado por ler!

Fonte de gravação: www.competethemes.com