O editor de blocos do WordPress pode parecer confuso à primeira vista. O layout é diferente, tudo funciona em blocos e encontrar as opções básicas pode levar mais tempo do que o esperado para iniciantes.
No entanto, o editor de blocos está incluído por padrão em todas as instalações do WordPress , tornando-se uma ferramenta gratuita para os usuários.
Assim, depois de entender como os blocos funcionam, você pode criar páginas mais rapidamente, formatar conteúdo com facilidade e controlar seus layouts melhor do que jamais conseguiu no editor clássico.
O editor de blocos foi projetado para ser intuitivo e flexível, permitindo que os usuários arrastem e soltem blocos no lugar desejado. Com um pouco de prática, você poderá criar e personalizar páginas em poucos minutos.
Resumindo:
- O editor do WordPress, também conhecido como Gutenberg, substituiu o editor clássico no WordPress 5.0 e permite criar conteúdo usando blocos individuais.
- Cada elemento da sua página, incluindo texto, imagens, botões e layouts, fica em seu próprio bloco com configurações dedicadas.
- Você pode personalizar cores, espaçamento, tipografia e alinhamento diretamente no painel de configurações do bloco, sem precisar escrever nenhum código.
- Os padrões de blocos oferecem layouts prontos para começar, enquanto os blocos reutilizáveis permitem que você salve e reutilize seus próprios elementos em todo o seu site.
O que é o Editor de Blocos do WordPress?
O editor de blocos, também conhecido como Gutenberg, é o editor de conteúdo padrão do WordPress. Ele substituiu o editor clássico no WordPress 5.0, em dezembro de 2018.
Em vez de uma única área de texto, você cria conteúdo usando blocos individuais. Cada parágrafo, imagem, título, botão e vídeo recebe seu próprio bloco, que você pode mover, formatar e personalizar independentemente.
O WordPress adotou um sistema baseado em blocos, o que lhe dá mais controle sobre o layout das suas páginas sem a necessidade de um construtor de páginas separado ou código personalizado.
Editor de blocos do WordPress vs. Editor clássico
O editor clássico oferecia uma área de texto básica com opções de formatação limitadas. Criar algo além de texto e imagens padrão exigia a instalação de plugins adicionais ou conhecimento técnico.
Com o editor de blocos, cada elemento tem seu próprio bloco com configurações dedicadas. Você pode mover o conteúdo, criar layouts de coluna, adicionar botões, incorporar mídia e ajustar o espaçamento sem escrever uma única linha de código.
O WordPress não desenvolve mais ativamente o editor clássico. A mudança para o editor de blocos dá acesso a tudo o que o WordPress oferece atualmente, incluindo edição completa do site, padrões de blocos e blocos reutilizáveis.
Como navegar na interface do editor de blocos?
Ao abrir o editor de blocos pela primeira vez, pode parecer que muita coisa está acontecendo na tela. No entanto, existem três áreas principais que você precisa conhecer. Depois de entender cada uma delas, navegar pelo editor se torna muito mais fácil.
- Barra de ferramentas superior: A barra de ferramentas superior fica na parte superior da tela. Use-a para adicionar blocos, desfazer erros, visualizar seu conteúdo e acessar as configurações de publicação.
- Painel de Configurações: O painel de configurações está localizado no lado direito da tela. Ele exibe as configurações do bloco quando você clica em um bloco e alterna para as configurações da sua publicação, como categorias, tags e imagem destacada, quando nada está selecionado. Você pode acessar a aba do bloco aqui para configurar as opções do bloco selecionado.
- Inseridor de Blocos: O inseridor de blocos é o botão azul com o sinal de mais no canto superior esquerdo. Clique nele para usar a barra de pesquisa e encontrar e inserir blocos rapidamente, navegar por categoria ou localizar blocos reutilizáveis que você tenha salvo.
Você também pode usar a Visualização em Lista para gerenciar e organizar seus layouts de forma mais eficaz.
Tipos de blocos disponíveis
O editor de blocos organiza tudo em cinco categorias. Cada categoria agrupa os blocos por sua função, facilitando a busca pelo que você precisa ao criar suas páginas e posts.
Os blocos padrão abrangem uma ampla variedade de tipos de conteúdo, permitindo que os usuários criem páginas ricas em mídia com imagens, vídeos, galerias e muito mais.
Eis o que cada um deles abrange:
- Blocos de texto: Parágrafos, títulos, listas, citações, trechos de código e tabelas. Tudo o que você escreve na sua página fica nesta categoria.
- Blocos de mídia: imagens, vídeos, arquivos de áudio, galerias de imagens e arquivos para download. Você pode usar diversos blocos, incluindo galerias de imagens, para criar conteúdo visualmente atraente e páginas ricas em mídia.
- Blocos de design: colunas, botões, grupos, separadores e espaçadores. Você pode combinar vários blocos com outros blocos para criar layouts complexos e controlar a forma como o conteúdo é apresentado.
- Blocos de widgets: barras de pesquisa, listas de arquivos, listas de categorias, publicações recentes e calendários. Esses são os elementos funcionais que agregam valor às suas páginas.
- Incorporação de blocos: YouTube, Vimeo, Spotify, Twitter e dezenas de outras plataformas. O editor de blocos permite que os usuários incorporem facilmente conteúdo de fontes de terceiros, como YouTube e Vimeo, diretamente em suas páginas, sem precisar escrever código.
Blocos comuns do WordPress mais usados por iniciantes
Quando você está começando, não precisa aprender todos os blocos de uma vez. Estes são os blocos que você usará em quase todas as páginas e postagens.
Blocos de parágrafo e título
O bloco de parágrafo é o bloco mais básico do editor. Sempre que você começa a digitar, está usando um. Você pode alterar o tamanho da fonte, a cor do texto e o alinhamento diretamente da barra de ferramentas do bloco, sem precisar mexer em nenhum código.
Os blocos de título funcionam em conjunto com os blocos de parágrafo para dar estrutura ao seu conteúdo. Você pode escolher entre H1 e H6, dependendo de como deseja organizar sua página.
Usar os níveis de título corretamente também ajuda os mecanismos de busca a entenderem seu conteúdo, o que é importante para o SEO.
Blocos de imagem e mídia
O bloco de imagem permite que você carregue imagens diretamente da sua biblioteca de mídia ou de um URL. Depois que a imagem estiver no lugar, você pode alinhá-la à esquerda, à direita ou ao centro, ajustar o tamanho e adicionar texto alternativo para SEO e acessibilidade.
Para várias imagens, o bloco da galeria as exibe em um layout de grade organizado. Você controla o número de colunas, os tamanhos das imagens e se as legendas aparecem abaixo de cada imagem.
Blocos de botão e link
O bloco de botão permite adicionar uma chamada para ação em qualquer lugar da sua página, sem precisar de conhecimentos de design. Você pode alterar o texto do botão, o link, a cor de fundo, o raio da borda e a cor do texto, tudo no painel de configurações do bloco.
Para adicionar links embutidos, basta selecionar o texto em um bloco de parágrafo e clicar no ícone de link na barra de ferramentas. Sem código, sem plugins, apenas um hiperlink simples adicionado em segundos.
Blocos de lista e citação
O bloco de lista cria listas com marcadores ou numeradas com um único clique. Você pode alternar entre estilos de lista, recuar itens para criar listas aninhadas e formatar o texto dentro de cada item da lista, assim como em um bloco de parágrafo.
O bloco de citação destaca afirmações ou citações importantes no seu conteúdo. Ele adiciona ênfase visual a um trecho de texto, fazendo com que ele se destaque do restante da página.
Use-o para depoimentos, pontos-chave ou qualquer coisa que você queira que os leitores notem.
Como adicionar, mover e excluir blocos?
Cada ação que você realiza no editor Gutenberg se resume a três coisas: adicionar blocos, movê-los e removê-los. Veja como cada uma funciona.
Adicionando blocos no editor do WordPress
Você pode adicionar um bloco à sua página ou postagem de três maneiras. Você pode adicionar um novo bloco clicando no botão "Adicionar novo bloco" ou usando o comando de barra (digite / seguido pelo nome do bloco):
- Inseridor de Blocos: Clique no botão azul de mais no canto superior esquerdo para abrir o inseridor de blocos. Aqui, você pode pesquisar ou navegar por qualquer bloco que precisar e também explorar a biblioteca de padrões de blocos para encontrar padrões e layouts predefinidos que você pode inserir e personalizar.
- Inserir em linha: Passe o cursor entre os blocos existentes na sua página e clique no pequeno botão de mais que aparece entre eles.
- Comando de barra: Clique em qualquer bloco de parágrafo vazio e digite uma barra (/) seguida do nome do bloco. Esta é uma maneira rápida de adicionar um novo bloco instantaneamente.
Movendo e reorganizando blocos no Gutenberg
Existem três maneiras de mover um bloco para uma nova posição na sua página:
- Botões de seta: Cada bloco possui dois botões de seta em sua barra de ferramentas. Use-os para mover o bloco para cima ou para baixo, uma posição por vez.
- Alça de arrastar: Clique na alça de arrastar com seis pontos no lado esquerdo do bloco e arraste-a para qualquer lugar da página.
- Visão geral do documento: Abra o painel de visão geral do documento na barra de ferramentas superior para ver todos os seus blocos listados em ordem e arraste-os para o local desejado.
Excluindo e removendo blocos no WordPress
Remover um bloco leva apenas alguns segundos:
- Menu de três pontos: Selecione o bloco, clique no menu de três pontos na barra de ferramentas do bloco e selecione Excluir.
- Atalho de teclado: Selecione o bloco e pressione Backspace ou Delete no seu teclado para removê-lo instantaneamente.
- Desfazer um erro: Pressione Control Z no Windows ou Command Z no Mac para recuperar um bloco que você excluiu acidentalmente.
Personalizando blocos sem programação
Você não precisa saber nada de programação para personalizar a aparência dos seus blocos. Cada bloco no editor do WordPress vem com seu próprio painel de configurações no lado direito da tela.
Selecione qualquer bloco e a barra lateral será atualizada instantaneamente para mostrar exatamente o que você pode alterar nesse bloco.
Aqui está o que você pode controlar diretamente no painel de configurações do bloco:
- Configurações de texto: Altere o tamanho da fonte, a espessura da fonte, a altura da linha e o espaçamento entre letras para combinar com o estilo do seu conteúdo.
- Opções de cores: Atualize a cor do texto e a cor de fundo de qualquer bloco usando o seletor de cores ou inserindo um código hexadecimal.
- Controles de espaçamento: ajuste o preenchimento e a margem ao redor do seu bloco para controlar quanto espaço fica acima, abaixo e ao redor do seu conteúdo.
- Configurações de alinhamento: Alinhe seu bloco à esquerda, ao centro, à direita ou defina-o para ocupar toda a largura, dependendo das suas necessidades de layout.
- Padrões reutilizáveis: Salve qualquer bloco ou grupo de blocos como um padrão reutilizável. Use-o em várias páginas e posts sem precisar recriá-lo todas as vezes.
Utilizando padrões de blocos e blocos reutilizáveis
Tanto os padrões de blocos quanto os blocos reutilizáveis economizam tempo na criação de páginas, mas funcionam de maneiras diferentes. Veja a seguir o que cada um faz.
Os padrões de bloco são layouts prontos que vêm integrados ao editor do WordPress. Você os encontra no inseridor de blocos, na aba "Padrões", e também pode acessar a biblioteca oficial de padrões de bloco para uma ampla seleção de layouts predefinidos no WordPress.org.
Escolha um que você goste, arraste-o para sua página, substitua o conteúdo pelo seu e pronto. Sem precisar construir tudo do zero.
Os blocos reutilizáveis agora são chamados de Padrões Sincronizados. Eles permitem que você crie e salve seu próprio conteúdo, que pode ser reutilizado em todos os blocos do seu site.
Depois de salvo, você pode inserir um Padrão Sincronizado em qualquer página ou postagem e, se editá-lo, a alteração será aplicada automaticamente em todos os locais onde ele aparecer.
Ideal para seções como chamadas à ação, informações de contato ou avisos legais que você usa repetidamente.
Erros comuns que iniciantes cometem ao usar o editor de blocos
A maioria dos iniciantes se depara com os mesmos problemas ao começar a usar o editor de blocos. Veja a seguir o que você deve observar:
- Uso excessivo de blocos: Nem tudo precisa de um bloco próprio. Adicionar muitos blocos separados para pequenos trechos de conteúdo torna sua página mais difícil de gerenciar e atrasa seu fluxo de trabalho de edição.
- Ignorando a estrutura dos títulos: Muitos iniciantes escolhem o tamanho dos títulos com base na aparência, em vez do significado. Os níveis dos títulos informam aos mecanismos de busca como seu conteúdo está organizado. Pular de H2 para H4 ou usar H1 várias vezes prejudica seu SEO.
- Não usar as configurações da barra lateral: o painel de configurações do bloco é onde a maior parte da personalização acontece. Ignorá-lo significa perder os controles de tipografia, opções de cores e configurações de espaçamento que já estão integrados.
- Quebrando layouts acidentalmente: Mover blocos com a alça de arrastar é fácil, mas soltar um bloco no lugar errado pode desestabilizar seu layout. Pressione Control Z no Windows ou Command Z no Mac para desfazer e recuperar rapidamente.
Conclusão
O editor Gutenberg parece intimidante à primeira vista. Cada elemento é um bloco, a interface é nova e encontrar as opções básicas exige um pouco de prática.
Depois de entender como os blocos funcionam, criar páginas e escrever conteúdo se torna mais rápido e flexível. Você controla seus layouts, personaliza seu conteúdo e gerencia todo o seu site sem precisar escrever uma única linha de código.
Comece com os blocos que você mais usa. Aprenda a usar o painel de configurações. Economize tempo com padrões e blocos reutilizáveis. Quanto mais você usar o editor, mais natural ele parecerá.
Perguntas frequentes sobre o editor de blocos do WordPress
O que é o editor de blocos do WordPress?
O Gutenberg é o editor de conteúdo padrão do WordPress. Ele substituiu o editor clássico no WordPress 5.0 e permite criar páginas e posts usando blocos de conteúdo individuais em vez de uma única área de texto.
O editor Gutenberg é bom para iniciantes?
Sim. Depois de entender como os blocos funcionam, é muito fácil de usar. Você pode criar páginas, formatar conteúdo e personalizar layouts sem nenhum conhecimento de programação ou experiência em design.
Posso voltar a usar o editor clássico do WordPress?
Sim. Você pode instalar o plugin Classic Editor a partir do diretório de plugins do WordPress para restaurar o editor antigo. No entanto, o WordPress não desenvolve mais ativamente o editor clássico, portanto, a migração para o editor de blocos é recomendada para uso a longo prazo.
Qual a diferença entre um bloco e um widget no WordPress?
Um bloco é um elemento de conteúdo que você adiciona dentro do editor de páginas ou posts. Um widget é um elemento de conteúdo que você adiciona a áreas fora do conteúdo principal, como barras laterais e rodapés. O editor de blocos agora suporta ambos, com blocos de widget disponíveis diretamente no editor.
Como adiciono blocos personalizados ao editor do WordPress?
Você pode adicionar blocos personalizados instalando um plugin do WordPress que os inclua. Muitos plugins de construtores de páginas e bibliotecas de blocos adicionam novos blocos diretamente ao seu inseridor de blocos. Você também pode encontrar e instalar blocos individuais no diretório de blocos dentro do editor.
