12 coisas que eu amo e odeio no WordPress Block Editor

Publicados: 2020-05-20

Em 2017 foi lançada a primeira versão do Gutenberg, e a diversão e os testes começaram. Gutenberg foi o nome do projeto escolhido para um processo de quatro fases que tocará cada parte do WordPress: edição, personalização, colaboração e multilíngue (fonte). E parte da primeira fase foi se afastar do antigo Editor Clássico e adotar um novo editor baseado em blocos .

A partir do WordPress 5.0, o Block Editor foi mesclado ao núcleo e é o editor padrão quando você faz uma nova instalação do WordPress. Existe um nome oficial para isso? Tipo de. Estou escolhendo chamá-lo de “Editor de Blocos” porque Gutenberg deveria ser todo o projeto em torno de mudanças futuras. Mas há algumas discussões interessantes sobre qual deveria ser o nome: #4681 e #20407.

Achei que seria divertido compartilhar meus pensamentos sobre o Block Editor, agora que o uso intermitentemente há mais de três anos. Alguns meses atrás, eu finalmente abandonei completamente o Editor Clássico. E aqui está o porquê.

  • Coisas que eu amo no WordPress Block Editor
  • Coisas que eu odeio no WordPress Block Editor

8 coisas que eu amo no editor de blocos do WordPress

Seria impossível listar todas as diferenças entre o Editor Clássico e o Editor de Blocos. Essas são coisas que impactaram pessoalmente meu fluxo de trabalho como escritor e construtor de sites. E agora não quero viver sem eles!

O suporte a Markdown é melhor

Por fim, o editor do WordPress suporta a capacidade de colar em Markdown . Como escritor e desenvolvedor casual, todas as outras ferramentas que uso diariamente suportam o Markdown há anos. Isso inclui coisas como o aplicativo Bear, Trello, Github, etc. Portanto, era realmente frustrante usar o Markdown em qualquer outro lugar e não poder copiá-lo/colar no WordPress sem ter que reformatá-lo.

Agora, com o WordPress Block Editor, posso usar muito da mesma sintaxe em todos os aspectos. Isso quase mudou a vida, para ser honesto. É como o editor deveria ter sido anos atrás.

O editor ainda não suporta a capacidade de escrever apenas no Markdown pronto para uso, mas está chegando lá. É pelo menos até o ponto em que não está mais me atrasando. Você também pode usar um plugin como o Iceberg para adicionar todos os seus atalhos favoritos do Markdown. Também consegui combinar meu tema favorito do Ayu Mirage Bear em segundos. Na verdade, eu escrevi este post inteiro usando o Iceberg.

Suporte Markdown melhor no WordPress Block Editor
Suporte Markdown melhor no WordPress Block Editor

Outros plugins do WordPress, como EditorsKit e JetPack, também têm a capacidade de adicionar suporte ao Markdown.

Não há mais recargas

Eu sou o tipo de pessoa que olha para a prévia do meu post com bastante frequência para ter uma ideia do fluxo e de como ele se parece. Provavelmente muitas vezes para ser honesto. No Editor Clássico, você precisava salvar seu rascunho e a página inteira seria recarregada. Isso era apenas irritante e perturbador.

No WordPress Block Editor, você não precisa mais fazer uma recarga completa ao salvar um rascunho ou atualizar uma postagem. Sim para AJAX. E bem-vindo ao século 21.

Chega de atualizar o Editor do WordPress
Chega de atualizar o Editor do WordPress

Blocos são incríveis

Eu amo blocos agora. Eu posso ver totalmente a visão para onde isso está indo. Demorei um pouco, pois no começo eu não queria gostar de blocos, mas finalmente estou lá.

Recentemente, reconstruí nosso site Perfmatters inteiramente fora de blocos e consegui remover 83 linhas de código personalizado. Isso tudo graças ao GeneratePress, GenerateBlocks e, claro, ao WordPress Block Editor.

Blocos no Editor de Blocos do WordPress
Blocos no Editor de Blocos do WordPress

Até criamos um prático bloco de clique para Tweet em nosso novo plugin de compartilhamento social, Novashare. Tudo o que você precisa fazer é digitar /nova... e boom, você tem seu bloco de tweets.

Ei, olha, eu sou uma caixa de tweet cinza. Por favor, tweet-me. Clique para Tweetar

Outras pequenas coisas como ser capaz de digitar /image ou /code ou /quote são muito úteis!

Destacar é como sempre deveria ter sido

Destacar no WordPress Block Editor agora é como sempre deveria ter sido. Por exemplo, digamos que você tenha algumas palavras em negrito. No Editor Clássico, se eu quisesse desatá-las, tinha que destacar todas as palavras.

Agora, no WordPress Block Editor, posso simplesmente clicar em qualquer lugar na área em negrito e desmarcar as palavras. Ele se comporta da mesma forma com coisas como sublinhado. Pequenas coisas como essa realmente começam a se somar com o tempo.

Destacando no Editor de Blocos do WordPress
Destacando no Editor de Blocos do WordPress

O esboço do documento é inteligente e útil

O recurso de estrutura de tópicos do documento no WordPress Block Editor é realmente muito bom! Você pode clicar facilmente em um título para levá-lo imediatamente a essa seção na postagem. Não só isso, mas também tem alguma lógica por trás disso . Neste exemplo abaixo, você pode ver que ele me informa sobre um nível de título incorreto (pulando de um cabeçalho H2 para um H4). Em termos de estrutura, eu deveria usar um H3 primeiro.

Esboço do Documento do Editor de Blocos
Esboço do Documento do Editor de Blocos

Adicionar legendas em imagens é tão fácil

Eu sou um defensor quando se trata de legendas de imagens. Não apenas para fins de SEO, mas também são uma maneira prática e sutil de atribuir uma imagem externa quando ela é originada.

Antes, no Editor Clássico, você tinha que fazer upload de sua imagem, clicar na imagem para abrir uma nova janela e inserir sua legenda. Agora no WordPress Block Editor, você pode simplesmente carregar a imagem e digitar a legenda logo abaixo dela . Não consigo nem imaginar quantas imagens carreguei em sites WordPress ao longo dos anos; tem que ser dezenas de milhares. Então, novamente, pequenas coisas se somam!

Escrevendo melhor
Escrevendo melhor (Fonte da imagem: Pinterest)

Melhores vistas para escolher

Com o WordPress Block Editor vem mais algumas visualizações para escolher em relação à escrita. Afinal, esse era um grande foco do novo editor, era melhorar a experiência geral de escrita.

Você tem concorrentes como o Medium que, na minha opinião, derrubam o antigo Editor Clássico. Felizmente, agora o WordPress Block Editor se comporta muito mais como algumas dessas outras plataformas de escrita de terceiros.

As três visões diferentes incluem:

  • Barra de ferramentas superior: acesse todas as ferramentas de bloco e documento em um único lugar.
  • Modo Spotlight: Concentre-se em um bloco de cada vez.
  • Modo de tela cheia: trabalhe sem distração.

Abaixo está o que parece se você tiver todos os três selecionados.

Todas as três visualizações do WordPress Block Editor
Todas as três visualizações do WordPress Block Editor

Na verdade, sou um grande fã do modo Spotlight e do modo Fullscreen sem a barra de ferramentas superior.

Minha visualização favorita do WordPress Block Editor
Minha visualização favorita do WordPress Block Editor

Finalmente, alguém pensou em IDs

Adicionar links de âncora HTML no Editor Clássico era absolutamente irritante, pois você precisava alternar para a visualização de código para adicionar o ID. E você tinha que fazer isso com HTML. Isso tornou super complicado, e essa é uma grande razão pela qual as pessoas que desejam adicionar links de âncora simplesmente instalam um plug-in do WordPress para facilitar isso.

No WordPress Block Editor, você pode finalmente adicionar um ID na mesma visualização ! Nenhum plug-in necessário. Viva.

Adicionando IDs de âncora HTML
Adicionando IDs de âncora HTML

4 coisas que eu odeio no WordPress Block Editor

Obviamente, você já pode dizer que agora sou um fã do WordPress Block Editor. No entanto, há algumas coisas que eu não gosto. Espero que isso seja corrigido em futuras versões do Block Editor.

Meu cursor está aqui, e agora está lá

Este é difícil de descrever, mas quem trabalha com o WordPress Block Editor há algum tempo deve saber do que estou falando.

Quando você está clicando em blocos diferentes, o cursor nem sempre segue você corretamente . Às vezes, ele pula para frente e para trás, e você precisa tentar novamente duas ou três vezes, tomando muito cuidado com o posicionamento do cursor. Caso contrário, você pode facilmente começar a digitar no bloco errado. Ou pior, às vezes ele apenas rolará você instantaneamente de volta ao topo.

Confirmei esse comportamento estranho com dezenas de pessoas, então sei que não sou só eu.

Frustração
Frustração (Fonte da imagem: Memedroid)

Permitir que os temas substituam o editor pode não agradar a todos

Se você permitir que seu tema substitua os estilos do editor, ele nem sempre terá a mesma aparência. Sua preferência pode variar dependendo do que você está usando o editor de blocos para fazer e se você está alternando entre muitos sites diferentes.

Eu gerencio muitos sites diferentes do WordPress e prefiro remover os estilos de tema e voltar aos estilos nativos do editor de blocos. Dessa forma, tenho uma sensação semelhante em todos os meus sites, mesmo quando estou construindo e projetando com blocos.

Por exemplo, eu uso o tema GeneratePress em todos os meus sites. Então, adicionei o seguinte filtro ao padrão de volta aos estilos originais do editor de blocos.

 add_filter( 'generate_show_block_editor_styles', '__return_false' );

Abaixo está um antes e depois do que parece.

Editor de bloco antes (estilos de substituição de tema)

Tema WordPress substituindo estilos de editor
Tema WordPress substituindo estilos de editor

Editor de blocos depois (retirando estilos de tema)

Estilos padrão do Editor de bloco
Estilos padrão do Editor de bloco

Grammarly não funciona direito, provavelmente nunca funcionará

Sou um ávido usuário do Grammarly. No entanto, desde que o novo WordPress Block Editor foi lançado, o Grammarly não funcionou corretamente . Às vezes encontrará coisas e outras vezes não.

Já vi reclamações semelhantes de usuários no Twitter também. Pelo que posso dizer, acho que tem a ver com a forma como cada bloco é completamente separado. Portanto, o Grammarly nem sempre pode ver o contexto completo. Eu também acho que ele só tem problemas para escanear o editor baseado em React.js.

Não tenho muita esperança de que eles consertem isso, para ser honesto. Eu tentei levantar essa questão com o apoio deles agora e também no Twitter. A equipe do WordPress diz que é algo do lado da Grammarly.

Fiquei surpreso ao saber de Jakab, que comentou neste post, que outras soluções, como a extensão do ProWritingAid, funcionam bem no editor de blocos.

Não é mais possível ver comentários em uma postagem individual

Talvez isso não seja tanto uma mudança com o editor em si, mas uma mudança que aconteceu com o WordPress 5.0 e o lançamento do WordPress Block Editor. Anteriormente, você podia rolar até o final da postagem em que está trabalhando e ver os comentários pendentes. Essa foi uma ótima maneira de acompanhar os comentários enquanto se concentra no tópico em questão. Isso não existe mais.

Agora você precisa responder aos comentários na janela principal do painel ou clicando no ícone de comentários na tela “Todas as postagens”. O problema com isso é que você também pode ler o conteúdo do artigo. Então, simplesmente comecei a abrir a postagem em outra janela para fazer referência enquanto respondo a um comentário.

Comentários pendentes no WordPress Block Editor
Comentários pendentes no WordPress Block Editor

A razão de eu trazer isso à tona neste post é que muitas vezes eu corrijo coisas ou atualizo coisas no editor com base no feedback de um comentário. Alguém ao longo da linha decidiu que esse fluxo de trabalho precisava mudar , eu acho, e não estar mais na mesma janela.

Resumo

Estou realmente interessado em ouvir o feedback de todos vocês. Você gosta de onde o novo WordPress Block Editor está indo? Quais são algumas coisas que você ama e odeia sobre isso? Deixe seus pensamentos abaixo nos comentários.