WordPress

Gutenberg: Um guia do editor do WordPress

Gutenberg: Um guia do editor do WordPress

Gutenberg é o novo editor do WordPress que proporciona facilidade e uma experiência fácil de edição para os sites WordPress. Você irá aprender com este artigo alguns truques práticos para criar postagens e páginas ricas em mídia, especialmente se estiver experimentando Gutenberg pela primeira vez.

Veja também: Gutenberg: conheça o novo editor do WordPress

O WordPress é o principal sistema de gerenciamento de conteúdo (CMS) do mundo, e substituiu seu tradicional editor TinyMCE pelo editor Gutenberg. O CMS alimenta mais de 31% de toda a web e esta mudança impactou uma enorme comunidade no WordPress.

Mas o que é o Gutenberg?

Bom, apenas para relembrar (pois já fizemos um artigo aqui explicando melhor sobre), o Gutenberg é um editor do WordPress que vem com a atualização do “WordPress 5.0”. É uma nova maneira usá-lo criando posts e páginas com pequenas unidades de arrastar e soltar, mais conhecidas como blocos.

Veja também: WordPress 5: Tudo o que você precisa saber

1. Blocos são substituídos

No Gutenberg toda a experiência foi reconstruída para criar posts e páginas ricos em mídia com a ajuda de blocos, como já dito. O conceito de blocos dá mais flexibilidade para criar páginas e posts, e o editor substitui a configuração do TinyMCE por blocos. Então, você pode adicionar facilmente um bloco a uma postagem ou página e focar no conteúdo sem usar nenhum código personalizado.

Há um bloco para tudo, como parágrafo, cabeçalho, subcabeçalho, coluna, lista, imagem, galeria, imagem de capa, citação, vídeo, áudio, arquivo, código, botão, incorporações e muito mais. Esses blocos ajudarão você a criar postagens e páginas ricas em mídia, sem a necessidade de possuir conhecimento técnico.

Com isso, você tem mais opções para decorar e publicar conteúdo em diferentes layouts, estilos, fontes com muitos outros recursos para adicionar recursos multimídia.

2. Bloco de Cabeçalho

Permite dividir um post ou página em seções diferentes, onde cada cabeçalho (de H1 a H6) deve indicar o início de um novo tópico.

Você pode alinhar o texto do cabeçalho à esquerda, ao centro ou ao lado direito com as opções de configuração negrito, itálico e rasurado no bloco de título. Você pode adicionar links e âncoras HTML aos seus cabeçalhos junto com a opção de inserir classes CSS adicionais. Importante: visualize o texto do título antes de torná-lo ativo.

3. Bloco de Imagem

Ajuda a inserir uma única imagem em qualquer lugar de uma postagem ou página com a opção de fornecer uma legenda ou um link, por exemplo, você pode alinhar sua imagem à esquerda, à direita ou ao centro com uma legenda, um link e um texto alternativo. No Gutenberg, você pode arrastar e soltar uma imagem do seu computador para a tela de edição.

Além disso, você pode redimensionar uma imagem, pegando qualquer um dos círculos azuis no canto da sua imagem quando colocado no editor Gutenberg.

4. Bloco de colunas de texto

Pode ajudar você a criar um layout de várias colunas (até seis colunas) para conteúdos somente em texto. Além disso, você pode modificar o bloco inteiro usando as configurações de parágrafo avançadas, que são divididas em seções, podendo encontrá-lo no painel Block Setting, no lado direito da tela de edição.

5. Bloco de categorias e citações

O bloco de categorias oferece opções de configuração para exibir categorias como uma lista suspensa de contagens e hierarquia, onde pode ser encontrado na seção Widget.

Já o bloco de citações, ajuda você a exibir as citações com dois estilos diferentes. O texto em um layout aparecerá maior do que o outro e você precisa verificar com a compatibilidade do tema para selecionar a opção mais adequada.

6. Código, separador e botões de bloqueio

O bloco de código é utilizado principalmente para criar partes técnicas no código. É ótimo para mostrar trechos de onde você pode escrever HTML, CSS, PHP, JavaScript e outros códigos técnicos.

Já o bloco de separador, é útil para exibir uma mudança temática no conteúdo como uma regra horizontal (<hr>). No entanto, o separador é projetado pelo seu tema, já o estilo dependerá inteiramente do tema escolhido. Além disso, há também o bloco de botões, onde o mesmo é útil para exibir botões com seu próprio fundo e cor de texto. Você pode personalizar o texto do botão e o URL no editor, juntamente com os estilos negrito, itálico e tachado.

Mudança é inevitável e acreditamos que o Gutenberg veio para facilitar, inovar e melhorar a vida do web design. Portanto, você pode manter o seu tema, plugins e cores atualizadas e fazer um backup do seu site antes de começar a instalar o Gutenberg.

Fonte