WordPress Gutenberg: Seu Guia definitivo do novo editor do WordPress

What is WordPress Gutenberg?

Gutenberg é o nome do projeto para o novo editor WordPress previsto para lançamento no WordPress 5.0. O Gutenberg WordPress Editor substituirá o editor clássico do WordPress, por isso será uma mudança muito significativa na maneira de editar posts e páginas no WordPress. O WordPress Gutenberg Editor é projetado para ser mais como um construtor de páginas dinâmicas para o WordPress, permitindo que você tenha mais controle sobre o layout do conteúdo de suas postagens e páginas. Com o novo editor Gutenberg, você pode adicionar vários tipos de mídia durante a edição de um post ou página do WordPress e, em seguida, reorganizar o layout diretamente no editor usando o Gutenberg Blocks.

Quando Will Gutenberg será lançado?

O Gutenberg está disponível há algum tempo como um plugin separado, e você pode baixar o plugin do Gutenberg aqui para experimentá-lo. A partir do WordPress versão 5.0, o Gutenberg será incluído no WordPress por padrão. De acordo com o cronograma de lançamento do WordPress 5.0, o WordPress 5.0 será lançado em 27 de novembro de 2018. No entanto, quaisquer problemas significativos com o WordPress 5.0 podem atrasar o lançamento até 22 de janeiro de 2019.

O que acontece com o editor clássico do WordPress?

Você pode estar se perguntando: “O que acontece com o editor clássico do WordPress? Está indo embora? ”A resposta curta é não, não completamente. A equipe do WordPress teve previsão suficiente para saber que alguns de vocês podem não estar completamente prontos para o novo Editor de Gutenberg e decidiram não deixá-lo pendurado. Depois que o WordPress versão 5.0 for lançado, você ainda poderá instalar o Editor Clássico do WordPress se não quiser usar o Editor do Gutenberg. O plugin Classic Editor só será oficialmente suportado até 31 de dezembro de 2021.

Por que o WordPress Gutenberg?

O editor WordPress Gutenberg é projetado para tornar a construção de um blog ou site WordPress ainda mais acessível aos não-programadores. Do post Focus Tech e Design Leads, que previa Gutenberg:

O editor se esforçará para criar uma nova página e postar experiência de construção que torne a escrita de posts avançados sem esforço, e tenha “blocos” para facilitar o que hoje pode levar os códigos de acesso, HTML personalizado ou “carne misteriosa” a incorporar a descoberta.

Com o uso dos blocos de Gutenberg, a equipe de Gutenberg tem como objetivo permitir que você faça postagens e páginas modernas sem a necessidade de instalar um monte de plugins extras. Os Gutenberg Blocks adicionam recursos já existentes ao editor, para que mais pessoas realmente saibam que estão lá.

O que são os blocos de Gutenberg?

O Editor de Gutenberg é construído sobre o conceito de Blocos. Os blocos de Gutenberg permitem que você adicione todas as coisas a uma página ou postagem. Do texto de parágrafos, imagens, vídeo, botões, widgets e até pullquotes, se você puder pensar sobre isso, os blocos de Gutenberg podem adicioná-lo ao seu conteúdo. Como você pode ver abaixo, Gutenberg ainda permite arrastar imagens da sua área de trabalho e soltá-las diretamente em um bloco para adicionar uma galeria à sua publicação. To show off Gutenberg’s Blocks, we choose several pictures of blocks (you’re welcome). Nota: Vamos aprofundar mais sobre como usar os blocos de Gutenberg mais tarde. Cobriremos apenas uma visão geral ampla nesta postagem.

Conhecendo o WordPress Gutenberg Editor Menu

Fist up, let’s dive into the Gutenberg Editor by starting with the options in the top menu.

As 11 principais opções da barra de menus

Localizado na parte superior da tela, você verá uma barra de menus com 11 opções:

1. De volta
2. Adicionar bloco
3. Desfazer
4. Refazer
5. Estrutura de conteúdo
6. Bloquear Navegação
7. Salvar rascunho
8. Visualizar
9. Publicar
10. Definições
11. Mais opções

1. Voltar Pressionar o botão Voltar levará você de volta para a página editar todos os posts ou páginas, dependendo do que você está editando no momento.2. Adicionar bloco A opção Adicionar bloco é onde você encontrará a variedade de blocos e incorporações de Gutenberg que você pode adicionar à sua postagem e página. Você pode usar a barra de pesquisa ou percorrer as opções disponíveis na tela. As opções do Bloco “Mais Usado” do Editor de Gutenberg incluem:

• Parágrafo
• Título
• Lista
• Galeria
• Imagem
• Citar
• Espaçador
• Vídeo
• Capa

Existem dúzias de mais blocos de Gutenberg, por isso vamos abordar todos eles com mais detalhes mais tarde. 3. Desfazer Anule a última alteração que você fez. 4. Refazer Obviamente, refaça seu último desfazer 5. Estrutura de Conteúdo A opção Estrutura de Conteúdo oferece uma visão geral rápida do conteúdo em sua postagem ou página atual do WordPress, incluindo a contagem de palavras, o número de títulos, parágrafos e o número de Blocos. Você também pode ver um esboço do documento, que é útil para ver a maneira como sua postagem ou página do WordPress é estruturada com títulos. Usar cabeçalhos (h1, h2, h3, h4, h5, h6) é uma ótima maneira de dividir seu conteúdo em seções, oferecendo aos leitores uma maneira melhor de verificar as informações. Cabeçalhos também são importantes para SEO. Os mecanismos de pesquisa também usam cabeçalhos para indexar melhor seu conteúdo, portanto, use-os com sabedoria. Ao clicar no cabeçalho, você pode pular rapidamente para a seção correspondente na página. 6. Bloquear Navegação Bloquear Navegação permite que você pule rapidamente entre os Blocos Gutenberg em sua postagem ou página do WordPress. 7. Salvar rascunho Este Save Draft Link é como você pode salvar a versão atual do seu rascunho. Observe que o WordPress Gutenberg salvará seu trabalho constantemente, portanto, você não poderá usar o botão Salvar rascunho com muita frequência. 8. Visualizar O botão Visualizar mostrará a aparência de sua postagem ou página no front-end de seu site depois de publicado. 9. Publicar Clicar no botão Publicar tornará sua postagem ou página do WordPress disponível ao público. 10. Configurações A roda Configurações ativa e desativa o menu de configurações correto. 11. Mais ferramentas e opções Use o ícone com os três pontos verticais para exibir o menu Mais ferramentas e opções. Neste menu, você verá algumas opções adicionais para o editor do Gutenberg, incluindo as opções Visualizar, Editor e mais Ferramentas. As visualizações incluem a barra de ferramentas unificada, o modo Spotlight e o modo de tela cheia. A barra de ferramentas unificada permite que você acesse todas as ferramentas de bloco e documento em um único lugar. O modo Spotlight permite que você se concentre em um bloco por vez. O modo de tela cheia permite que você trabalhe sem distração, removendo itens de menu desnecessários. Você também pode alternar entre o Visual e o Editor de Código a partir daqui. Alternar entre essas visualizações pode ser útil para usuários mais avançados se você quiser ver o código atual gerado pelo conteúdo. Na seção Ferramentas, você pode gerenciar todos os blocos reutilizáveis, configurar atalhos de teclado e copiar todo o conteúdo.

Conhecendo as opções do menu do documento

Em seguida, percorremos as opções do menu Documento. Você verá 10 opções diferentes para formatar seu “documento” ou o conteúdo em sua postagem ou página do WordPress. 1. Documento Essa guia alterna o menu direito para exibir as configurações do documento. 2. Bloco Alterne a guia direita para exibir as configurações de bloqueio. 3. Status e visibilidade A seção Status e visibilidade oferece uma visão geral do status atual de sua postagem ou página. Visibilidade – A opção Visibilidade de postagens permite que você escolha quem pode ver uma postagem ou página do WordPress depois de publicada. Você pode selecionar entre Público, Protegido por senha ou Privado. Publicar – Você pode usar a opção Publicar para agendar sua postagem para publicação automática. Para agendar uma postagem, selecione a data e a hora exata em que você deseja que sua nova postagem ou página seja publicada. Post Format – O link Post Format permite que você selecione o formato da postagem, incluindo Aside, Link, Image, Quote, Standard ou Video. Stick to Front Page – Marque esta caixa para adicionar um link à sua postagem na primeira página do seu site. Revisão pendente – selecione essa opção e salve a postagem para alterar o status da postagem para pendente. 4. Revisões Ao clicar no link Revisões, você será direcionado para as diferentes versões de sua postagem. Você poderá comparar duas versões lado a lado para ver as alterações feitas e quem as fez. Você pode reverter sua postagem para uma versão mais antiga na página Revisões. 5. Categorias Selecione uma categoria atual ou crie uma nova para sua postagem. 6. Tags Selecione uma tag atual ou crie uma nova para sua postagem. 7. Imagem em destaque Adicione uma imagem em destaque à sua postagem. 8. Trecho Crie um resumo ou uma descrição para sua postagem. O Excerto do WordPress é um resumo opcional ou uma descrição da sua postagem. Trechos têm dois usos: Fornece resumos em feeds RSS: Trechos substituem o conteúdo completo em feeds RSS quando a opção para exibir resumos é selecionada no Painel ›Configurações› Leitura. Em pré-visualizações: dependendo do tema WordPress, trechos podem ser exibidos em locais onde os resumos rápidos são preferíveis ao conteúdo completo, como resultados de pesquisa ou arquivos para categorias, tags, meses e autores. 9. Discussão Controle se você deseja permitir que os usuários comentem em sua postagem ou página do WordPress. Você também pode selecionar se deseja permitir pingbacks e trackbacks. Os trackbacks e os pingbacks são métodos para alertar os blogs que você vinculou a eles, para que eles forneçam um tipo de sistema de comentários “remotos”. Um pingback é um tipo de comentário criado quando você vincula a outra postagem do blog em que os pingbacks estão ativados. Os pingbacks são automatizados e não enviam nenhum conteúdo. Os trackbacks são uma forma de notificar os sistemas de blog legados que você vinculou a eles. Os trackbacks devem ser criados manualmente e enviar um trecho do conteúdo.

Conhecendo as opções de menu do Bloco Gutenberg

A Bloco de discussão, no lado direito da tela, oferece várias opções para a formatação dos blocos que você usa. Você deve primeiro escolher o Bloco do Gutenberg que deseja formatar. As Configurações de Bloqueio permitem que você personalize cada bloco individualmente. Como você pode escolher um bloco de Gutenberg, como opções neste painel são alteradas. A maioria das músicas do Bloco Gutenberg tem a ver com formatação e estilo. Como as opções de consulta podem variar de acordo com o tipo de bloco, mas você pode ver as opções para adicionar estilos e outras questões ao bloco. Configurações Avançadas do Bloco Gutenberg A configuração Avançada permite adicionar uma classe CSS adicional ao bloco selecionado. As classes CSS podem ser usadas pelo seu tema para adicionar estilos adicionais ao Bloco. Alterar o tipo de bloco Cada bloco tem uma opção para alterar o tipo. Ao clicar em um bloco que você adicionou e, em seguida, passar o mouse sobre o ícone à esquerda, você pode alterar o tipo de bloco atual para um dos blocos pré-selecionados fornecidos a você. Editar bloco atual Como você pode ver abaixo, eu pude usar a opção Change Block Type para mudar meu bloco atual de um bloco de paragrafo para um bloco Heading. Então eu pude usar as opções do Edit Current Block para mudar o tamanho do cabeçalho. Você terá diferentes opções de edição rápida, dependendo do tipo de bloco selecionado.

Mais opções de bloco de Gutenberg

Cada bloco Gutenberg contém opções adicionais que podem ser reveladas clicando no ícone no lado direito do menu do bloco. Essas configurações adicionais incluem:

• Ocultar configurações de bloqueio
• Duplicado
• Inserir antes
• Inserir depois
• Editar no HTML
• Adicionar aos Blocos Reutilizáveis Remover blocos
• Ocultar e mostrar configurações de bloqueio Esta opção permite alternar entre ocultar e mostrar as configurações do bloco lateral direito. Isso é útil se você quiser limpar rapidamente sua tela de edição.

Antecedentes É um livro que você pode inserir um novo bloco acima do bloco selecionado. Inserir depois Use este botão para inserir um novo bloco abaixo do tipo de cor selecionada selecionado. Editar como HTML / Editar Visualmente Esta opção permite alternar entre as opções de edição, em HTML ou Visualmente. A edição HTML pode ser útil para obter as devidas alterações no código HTML do bloco, como as classes div e os estilos embutidos. Mudar de volta para o instantâneo. Adicionar bloco reutilizável Com esta opção, você pode salvar o seu atual para usar mais tarde. Esta opção pode ser incrivelmente útil com o uso do mesmo texto, imagens e até mesmo botões com a função. Remover bloco Use isso para excluir o bloco atual da sua página ou postar. Dê a Gutenberg um giro em seu site WordPress Agora que você conhece o editor do WordPress Gutenberg, é a sua vez de se divertir. Você pode jogar com o novo editor antes do lançamento do WordPress 5.0, baixando o plugin do Gutenberg e instalando-o no seu site WordPress.]]>