#escola612 - Como usar o Gutenberg, o novo editor de texto do WordPress - Aula 1

A princípio só queria explicar como Gutenberg, o novo editor de texto do WordPress, funciona. Mas por causa das tantas funcionalidades que o novo editor trouxe, mesmo que na fase de testes, criei uma nova série no site da 612, a #escola612, para explicar melhor como funciona esse novo editor.

No momento, o novo editor de texto está disponível para teste através de um plugin, que você pode obter aqui. O WordPress recomenda que você o use num site de testes e desenvolvimento, ou seja, não ainda no site que você tá mantendo no ar.

Então, vamos começar a nossa primeira aula, alunos? Começa agora a nossa primeira aula da #escola612, e vamos explicar a você, blogueiro, editor de texto ou redator de jornal ou site de notícias que usa WordPress, como é que vai funcionar esse negócio.

Então prontos? Boa aula!

Começando a escrever

Antes de mais nada, vamos explicar Gutenberg pelo seu organograma: primeiro vamos saber onde tá cada coisa:

Na barra de cima, estão quatro ícones: no +, você pode adicionar novos blocos, que podem ser de texto, HTML, embeds, entre outras opções que podem ajudar na apresentação do seu conteúdo. Os outros, são de desfazer, refazer e informações, este último conta respectivamente quantas palavras, cabeçalhos, parágrafos e blocos você usou para compor a página.

Nas barras laterais, estão dois menus: “documento” e “bloco”. No de “documento” ficam as seguintes informações:

Status & Visibilidade: Basicamente é o bloco de “publicar” do antigo editor, só que sem o botão de publicar (que como você pode ver, está na barra superior). É nesse menu que você vai determinar a data, hora, se vai ser rascunho ou não, formato do post, bem como fixar o conteúdo na página inicial e revisões pendentes.
Categorias e tags: Nele ficam, como bem diz o próprio menu, as categorias e tags que você criou no site para o seu post.
Imagem destacada: Local onde você vai adicionar a imagem destacada do seu post (por exemplo, a imagem destacada é essa arte que você vê acima do título do post).
Resumo: Onde você inclui uma frase ou algumas palavras que ajudem a identificar o assunto do seu post. No antigo editor existe esse campo, porém ele fica oculto, e se selecionado, fica abaixo do campo de texto.
Discussão: Onde você determina se o conteúdo do seu post pode receber comentários ou pingbacks e trackbacks. Também existente no antigo editor, porém abaixo da caixa de texto.

A roda dentada ao lado do botão de “Publicar” serve para você ocultar o menu lateral, caso você queira escrever sem distrações.

Você vai começar a escrever tal como vai escrever o seu texto. O espaço de título está garantido. Mas a brincadeira vai começar exatamente quando você começar a escrever o seu texto, parágrafo a parágrafo.

Repare que abaixo do menu de “Status e Visibilidade” aparece o número de revisões que você fez no texto. Caso você queira voltar atrás em alguma coisa que você fez, você clica ali, que direciona para o banco de revisões do texto.

Ok, parece só um editor qualquer. É aí que começa a brincadeira. Você deve ter percebido que a barra de tarefas não aparece. Como vou fazer isso? É só passar o cursor do mouse no texto, clicar e pronto! Apareceu essa barrinha simplificada aqui embaixo:

A barra simplificada mostra os comandos de:

Parágrafo (selecionável e explicamos logo mais);
Orientação do texto (à esquerda, centralizado e à direita);
As teclas B (Negrito) e I (Itálico);
A tecla ~~abc~~ (“~~Striketrough~~” = ~~Tachado~~);
E a tecla de link, para adição de links do seu e de outros sites.

Clicando na tecla de parágrafo, temos as seguintes funcionalidades:

Heading: É onde estão os cabeçalhos do editor de texto (que vai de H1 até H4).
Quote: Nele você transforma o parágrafo do texto em citação. A novidade é que agora há um espaço para você adicionar a autoria ou circunstância da citação:

List: Transforma parágrafos em listas, tal como esta que você lê, com pontos ou números antes de cada enumeração.
Preformatted: Transforma parágrafos em textos pré-formatados, com fonte idêntica as empregadas em HTML, ou seja, um texto “pelado” tipo isso aí:

Verse: Opção que elimina todas as quebras de linha do parágrafo, transformando o mesmo numa frase de uma linha só, que só pode ser lida se o leitor selecionar um menu suspenso na horizontal e ir arrastando da esquerda para a direita.