O editor de blocos do WordPress é como qualquer outro construtor de páginas que permite criar e projetar conteúdo e páginas da Web incríveis para o seu site. Ele está integrado ao WordPress, portanto, qualquer pessoa pode criar um site do zero.
O Gutenberg Block Editor, também conhecido como editor de blocos, é o novo editor que substituiu o antigo editor clássico. O editor de blocos funciona de forma diferente do editor clássico.
Editor de blocos do WordPress! O que é isso?
O WordPress Block Editor é o novo editor padrão baseado em blocos. Os blocos são como os elementos de conteúdo necessários para criar um site ou conteúdo.
Ele oferece uma abordagem moderna e baseada em blocos para a criação de conteúdo, facilitando o design e a formatação de páginas e posts sem a necessidade de codificação extensiva ou ferramentas de terceiros.
Interface do Block Editor
Vamos dar uma olhada na interface do Gutenberg Block Editor e em sua funcionalidade.
Aqui está um resumo rápido dos elementos da interface do editor Gutenberg:
- Adicionar bloco
- Botão Refazer/desfazer
- Visão geral do documento
- Ver
- Configurações (Blocos e Postes)
- Opções para o Editor
Há ainda mais. Dê uma olhada na imagem abaixo.
- Opção de barra de pesquisa
- Adicionar título do post ou da página
- Adicionar blocos na área de conteúdo
- Blocos instalados e principais do WordPress
- Botão Adicionar bloco
- Opções para posts e páginas
- Opções de bloco
- Estilos e configurações de blocos
- Blocos, padrões e mídia
Agora que você está familiarizado com a interface do editor de blocos, vamos dar uma olhada nos blocos que vêm com o Gutenberg.
Blocos principais do WordPress
Como o Gutenberg Block Editor é baseado em blocos, vamos aprender quais blocos vêm com o Block Editor e o que eles fazem exatamente.
Blocos de conteúdo
Esses blocos são a base para a criação de conteúdo baseado em texto:
- Parágrafo: Isso serve para adicionar texto normal com opções de formatação.
- Título: Para criar títulos com seis níveis (H1 a H6).
- Lista: Adiciona listas ordenadas (numeradas) ou não ordenadas (com marcadores).
- Citação: Formate o texto como uma citação em bloco com citação opcional.
- Código: Exibe trechos de código bruto em um bloco formatado.
- Pré-formatados: Adiciona texto com espaçamento e alinhamento preservados.
- Tabela: Cria tabelas simples para apresentação de dados.
- Verso: Para poemas ou outros textos pré-formatados com espaçamento especial.
Criar mesas bonitas
Com o Block Editor
Blocos de mídia
Esses blocos permitem incorporar e exibir vários tipos de mídia:
- Imagem: Adiciona imagens individuais com legendas e opções de alinhamento.
- Galeria: Cria galerias de imagens com layouts personalizáveis.
- Vídeo: Incorpora vídeos carregados na Biblioteca de mídia.
- Áudio: Adiciona arquivos de áudio reproduzíveis diretamente à página.
- Arquivo: Uploads e links para arquivos para download.
- Mídia e texto: Combina texto e mídia lado a lado em um único bloco.
- Capa: Adiciona uma imagem ou um vídeo com texto sobreposto, perfeito para cabeçalhos ou seções.
Blocos de design
Esses blocos ajudam na estrutura da página e no design visual:
- Colunas: Cria layouts de várias colunas.
- Grupo: Agrupa vários blocos para melhor organização e estilo.
- Linha: Alinha os blocos horizontalmente em uma linha.
- Botões: Adiciona botões personalizáveis com links.
- Espaçador: Adiciona espaço entre os blocos para ajustes de layout.
- Separador: Insere linhas horizontais para dividir seções.
Incorporar blocos
O WordPress suporta a incorporação de conteúdo de várias plataformas com esses blocos:
- YouTube: Incorpora vídeos do YouTube.
- Twitter: Incorpora tweets diretamente na página.
- Instagram: Incorpora publicações do Instagram.
- Spotify: Incorpora listas de reprodução, álbuns ou faixas do Spotify.
- Outras incorporações: Suporte para Vimeo, Facebook, TikTok, SoundCloud e muito mais.
Blocos temáticos
Esses blocos são usados para adicionar conteúdo relacionado ao tema:
- Título da postagem: Exibe o título do post ou da página atual.
- Publicar conteúdo: Emite o conteúdo do post ou da página atual.
- Postar Imagem em destaque: Exibe a imagem em destaque de uma publicação.
- Loop de consulta: Exibe dinamicamente uma lista de postagens com base em critérios específicos.
- Navegação: Adiciona menus de navegação.
Blocos de widgets
Permite adicionar conteúdo de widget tradicional a designs baseados em blocos:
- Pesquisa: Adiciona uma barra de pesquisa.
- Publicações mais recentes: Exibe uma lista de publicações recentes.
- Categorias: Mostra uma lista de categorias de posts.
- Nuvem de tags: Exibe as tags em um formato visualmente atraente.
Blocos reutilizáveis e personalizados
Blocos reutilizáveis: Salvar qualquer bloco ou grupo de blocos para reutilização em todo o site.
- HTML personalizado: Adicione HTML personalizado para personalização avançada.
Esses blocos centrais fornecem a base para a criação de vários layouts de página e tipos de conteúdo sem ferramentas adicionais, tornando o WordPress versátil e acessível para usuários de todos os níveis de habilidade.
Como usar o editor de blocos do WordPress?
O editor de blocos é uma brincadeira de criança, pois é muito fácil de usar. O Block Editor do WordPress é avançado e flexível, permitindo que você crie páginas e posts com facilidade. Ao se familiarizar com seus recursos, você poderá criar rapidamente um conteúdo visualmente atraente e envolvente!
Inserção de blocos
Esse novo editor suporta o recurso de arrastar e soltar, o que significa que você pode arrastar e soltar os blocos para criar novos layouts e seções de uma página da Web. Para arrastar e soltar blocos, clique em "Adicionar novo bloco" na parte superior e arraste e solte o
Você pode adicionar ou inserir blocos simplesmente clicando no ícone "adicionar bloco" no editor, digitando o nome do bloco e inserindo-o no editor.
Há outro método que você pode usar para adicionar blocos ao editor. Basta digitar "/Nome do banco." A demonstração está abaixo. Não deixe de dar uma olhada.
Duplicar um bloco
Duplicação de blocos é um processo simples. Você pode duplicar um bloco selecionando-o e usando a tecla de atalho Ctrl+Shift+D.
Ou você pode fazer isso manualmente. Selecione um bloco e clique nos três pontos verticais no menu de configurações do bloco (1) para duplicá-lo. A partir daí, escolha a opção "Duplicate" (Duplicar) (2). Uma vez clicado, o bloco será duplicado instantaneamente.
Você pode duplicar blocos selecionando o bloco e usando a tecla de atalho Ctrl+Shift+D.
Mover um bloco
Você pode facilmente mover blocos usando o recurso de arrastar e soltar ou os botões para cima e para baixo.
Selecione o bloco e você verá duas setas (para cima e para baixo). Clique na seta para cima ou para baixo para mover o bloco verticalmente.
Como alternativa, use a alça de arrastar para reposicionar o bloco em qualquer lugar que desejar.
Excluir ou remover um bloco
Excluir ou remover um bloco é muito fácil. Selecione o bloco e pressione a tecla de atalho Shift+Alt+Z de seu teclado.
Você pode fazer isso manualmente clicando nas configurações de bloqueio e selecionando a opção remover bloqueio.
Criar padrão
Um recurso de destaque do editor de blocos é Criar padrão. Esses blocos podem ser salvos e reutilizados em vários posts ou páginas. Esse recurso é incrivelmente útil, pois permite que você economize tempo reutilizando blocos personalizados.
Para criar um padrão, abra as configurações de bloco dos blocos selecionados ou de um bloco clicando nos três pontos e selecione 'Criar padrão'.
Em seguida, atribua um nome (1) e categorias (2) para seu bloco ou blocos e clique no botão Adicionar botão (3).
Isso salva seu bloco na biblioteca de blocos do Gutenberg, tornando-o acessível para uso futuro. Sempre que você precisar dele, basta inserir o bloco reutilizável como qualquer outro bloco.
Atalhos do teclado
Você pode aproveitar as vantagens de usar o editor de blocos do Gutenberg por meio de atalhos de teclado. Esses atalhos podem ajudar os usuários a navegar rapidamente, formatar texto e gerenciar blocos sem depender do mouse.
Esses atalhos funcionam em toda a interface do editor:
- Ctrl + S (Windows) / Cmd + S (Mac): Salvar o rascunho.
- Ctrl + Z (Windows) / Cmd + Z (Mac): Desfazer a última ação.
- Ctrl + Y: Refazer a última ação.
- Ctrl + Shift + Alt + M (Windows) / Cmd + Shift + Option + M (Mac): Alternar entre os modos de editor Visual e de Código.
- Ctrl + Shift + D: Duplicar um bloco selecionado
- Ctrl + Shift + , : Ocultar ou exibir o painel de configurações
Se quiser, você pode Veja os atalhos de teclado do editor do WordPress.org.
Adicione mais blocos usando o Ultimate Blocks!
Os blocos padrão do editor de blocos são fantásticos para criar posts e páginas visualmente atraentes. Mas e se você precisar de mais flexibilidade?
Felizmente, o editor de blocos oferece suporte ao desenvolvimento de blocos personalizados, permitindo que os desenvolvedores criem seus próprios blocos exclusivos. Isso resultou em uma ampla gama de impressionantes plug-ins de blocos do Gutenberg criados pela comunidade. Um desses plug-ins é o Blocos definitivos.
Blocos definitivos é um poderoso plug-in projetado para turbinar o editor de blocos do WordPress com 25+ blocos personalizáveis. Perfeito para blogueiros e profissionais de marketing, ele inclui recursos como blocos de revisão, filtros de conteúdo e blocos de chamada para ação para aumentar o envolvimento e a funcionalidade.
Considerações finais!
O domínio do Gutenberg Block Editor abre infinitas possibilidades para a criação de conteúdo envolvente e visualmente impressionante em seu site do WordPress.
Espero que o tutorial tenha sido útil e fácil de seguir. Diga-me o que achou na seção de comentários abaixo. Além disso, informe seus amigos sobre essa diretriz fácil por meio de suas mídias sociais.
Leia mais!
- Análise do Ultimate Blocks: Recursos, prós, contras e muito mais
- Como criar Flip Boxes no WordPress em 4 etapas fáceis
- Como adicionar uma caixa de avaliação às postagens/páginas do WordPress de duas maneiras fáceis
- Como tornar o cabeçalho de uma tabela fixo no WordPress (3 etapas fáceis)
- Como alterar a cor do hover do botão no WordPress em 3 etapas fáceis
