Se você usa o WordPress 5.0 e superior, a menos que esteja vivendo sob uma rocha, sem dúvida já ouviu falar da atualização do Gutenberg que foi incorporada ao WordPress em dezembro de 2018^{(December 2018)} .

Portanto, se você estiver usando a versão mais recente do WP, já está usando o Gutenberg ou continuou usando o editor clássico instalando o plugin WordPress Classic Editor^{( WordPress Classic Editor plugin)} .

Por que Gutemberg?^{(Why Gutenberg?)}

Muitos usuários do WP não estão prontos para entrar no vagão de Gutenberg^{(on the Gutenberg wagon)} , mas alguns estão, incluindo este site.

Algumas das razões pelas quais você pode querer usar o Gutenberg são porque:

• É o futuro para desenvolvedores WP.
• Proporciona uma melhor experiência ao usuário.
• É mais flexível que o editor original do WP ( TinyMCE ).
• Fornecerá um novo mercado para desenvolvedores.

Quais são as diferenças entre WordPress e Gutenberg?^{(What Are The Differences Between WordPress & Gutenberg?)}

O Editor Clássico^{(Classic Editor)} do WP é um editor de texto e se parece muito com o Microsoft Word^{(Microsoft Word)} . Ele tem um único campo de edição, como visto na captura de tela abaixo.

Gutenberg é um editor baseado em blocos que se parece com isso:

Existem vários blocos para diferentes tipos de conteúdo que incluem suas próprias opções de formatação. Blocos como:

• Botão
• Imagem
• Tabela
• Incorporações
• Lista
• Galeria
• Áudio
• Citações
• Cabeçalho
• Código
• Versículo
• HTML personalizado

Além disso, temas e plugins oferecem mais blocos e widgets para você usar em suas postagens e páginas do WP.

Como as páginas ou postagens existentes são afetadas?^{(How Are Existing Pages Or Posts Affected?)}

Após atualizar e usar o Gutenberg , suas páginas e postagens existentes devem continuar sendo exibidas corretamente. 

No entanto, você deve verificar seus códigos de acesso e certificar-se de que os plug-ins que você está usando estão funcionando.

Quando você edita uma página ou postagem existente, ela será aberta automaticamente em um único novo bloco clássico do editor Gutenberg .

Você está pronto para fazer a troca?

Use um site de teste^{(Use a Staging Site)}

A última coisa que você quer fazer é quebrar seu site existente. A maneira de evitar isso é ativar o Gutenberg em um site de teste^{(a staging site)} . Esta é uma réplica exata do seu site, onde você pode testar as coisas sem causar nenhum dano ao seu site ativo.

Os sites de teste incluem seu tema, plugins , opções e conteúdo. Sua empresa de hospedagem pode oferecer sites de teste. Se não, você pode usar o plugin WordPress Staging^{( WordPress Staging plugin)} .

Depois que seu site de teste estiver funcionando, instale e ative o plug-in Gutenberg^{( Gutenberg plugin)} e comece a testar. Ou instale uma nova instância do WordPress em seu computador e teste lá.

Verifique seus plug-ins^{(Check Your Plugins)}

Os usuários do WordPress estão familiarizados com o que acontece quando os plugins não funcionam bem juntos. Às vezes, é devido à funcionalidade ou código conflitante. Este é um excelente momento para ver se você está usando todos os plugins que instalou. Se não estiver, remova-os.

Você também quer ver quais plugins estão sendo usados ​​ao editar conteúdo no WordPress . Plugins específicos como Akismet , Contact Form 7 , Google Sitemap Generator e WP Super Cache não têm nada a ver com o editor e não serão afetados pelo uso do Gutenberg .

Por outro lado, qualquer plug-in que adicione funcionalidade ou altere a aparência do editor clássico do WP pode não ser compatível com o Gutenberg . Em particular, os plugins que geraram códigos de acesso, adicionaram estilos personalizados ou não foram atualizados recentemente, geralmente entram em conflito e causam problemas.

Gutenberg costumava ter um banco de dados de compatibilidade de plug^{(Plugin Compatibility)} -ins ativo . No entanto, ele foi encerrado porque não é mais mantido ativamente.

Você pode revisar os dados finais e baixar o banco^{( download the database)} de dados como um arquivo CSV . Sem acesso a um banco de dados de compatibilidade de plug-ins ativo, você terá que testar manualmente cada plug-in que usar.

Tente criar uma nova postagem em seu site de teste. Você verá que está no editor Gutenberg e parecerá diferente para você. Quando você começa a digitar, está criando automaticamente um bloco de parágrafo. Você não precisa adicionar um novo bloco ao adicionar um novo parágrafo. Basta^(Just) pressionar enter ou a tecla de retorno.

Como você está tentando ver se seus plugins atuais funcionarão, tente recriar como você usou cada um e veja se ainda funciona.

Se isso não acontecer, procure a mesma funcionalidade no bloco padrão do Gutenberg , adicione esse bloco e adicione seu conteúdo.

Certifique-se de manter uma lista dos plugins que não funcionam corretamente para que você possa removê-los quando estiver ativo com o Gutenberg .

E se não houver um bloco padrão para a funcionalidade que você precisa?^{(What If There Is No Default Block For The Functionality You Need?)}

Verifique todos os blocos para ver se a funcionalidade que você precisa está dentro de outro bloco. Se você não conseguir encontrar algo que funcione, você pode entrar em contato com os autores do plug-in e perguntar se eles planejam atualizá-lo para ser compatível com o Gutenberg .

Se tudo mais falhar, tente encontrar um plug-in do Gutenberg^{( Gutenberg plugin)} que faça o que você precisa. Exclua os plug-ins que não funcionam do seu site de teste.

Ao vivo^{(Going Live)}

Antes de fazer QUALQUER COISA em seu site ao vivo, faça um backup completo de todo o seu site, caso você tenha perdido algo ao verificar a compatibilidade ou ocorra outro erro.

É possível fazer todas as alterações necessárias em seu site de teste e enviá-las para seu site ativo. No entanto, isso requer algum conhecimento técnico. Portanto, a menos que você seja um desenvolvedor ou tenha um que funcione para você, é melhor fazer as alterações manualmente.  

Comece excluindo os plugins que não funcionaram e adicionando os novos que você encontrou para substituí-los. Se os plugins antigos estiverem processando dados de posts e páginas existentes e não quebrarem os novos, você pode deixá-los instalados.

Deseja converter suas postagens e páginas antigas em blocos Gutenberg?^{(Do You Want To Convert Your Old Posts & Pages To Gutenberg Blocks?)}

Abra cada página e poste no Classic Block Menu . Clique^(Click) nos três pontos para ver as opções^{(view options)} . Selecione no menu suspenso Converter em blocos^{(Convert to Blocks)} .

Depois que o WP converter seu conteúdo para o sistema de blocos Gutenberg , você deve revisar cada bloco. Use Block Navigation (de ícones) para ver todas as partes de sua postagem ou página.

Como você pode ver na captura de tela acima, cada parágrafo, imagem, lista e título agora está em seu próprio bloco. Converter páginas e postagens existentes para o novo sistema Gutenberg é rápido e fácil.

Pode levar várias horas para testar seus plugins e encontrar novos, mas você só precisa fazer isso uma vez. Certifique-se de seguir as etapas sugeridas acima para tornar sua mudança para o Gutenberg indolor e sem erros.

How To Transition From The Classic WordPress Editor To Gutenberg

If you use WordPrеss 5.0 and higher, unless you have beеn living under a rock, you will have undoubtedly heard of the Gutenberg update which was merged into WordPress in December 2018.

So if you are using the latest version of WP, you are either already using Gutenberg or have continued using the classic editor by installing the WordPress Classic Editor plugin.

Why Gutenberg?

Many WP users are not ready to jump on the Gutenberg wagon, but some are, including this website.

A few of the reasons why you might want to use Gutenberg are because it:

• Is the future for WP developers.
• Provides a better user experience.
• Is more flexible that WP’s original editor (TinyMCE).
• Will provide a new market for developers.

What Are The Differences Between WordPress & Gutenberg?

WP’s Classic Editor is a text editor and looks very much like Microsoft Word. It has a single editing field as seen in the screenshot below.

Gutenberg is a block-based editor that looks like this:

There are multiple blocks for different types of content that include their own formatting options. Blocks such as:

• Button
• Image
• Table
• Embeds
• List
• Gallery
• Audio
• Quotes
• Heading
• Code
• Verse
• Custom HTML

Also, themes and plugins offer more blocks and widgets for you to use in your WP posts and pages.

How Are Existing Pages Or Posts Affected?

After upgrading and using Gutenberg, your existing pages and posts should continue to display correctly. 

However, you should check your shortcodes and make sure that the plugins you might be using are working.

When you edit an existing page or post, it will automatically open in a single new Gutenberg editor classic block.

Are you ready to make the switch?

Use a Staging Site

The last thing you want to do is break your existing site. The way to avoid this is to activate Gutenberg on a staging site. This is an exact replica of your website where you can test things out without doing any damage to your live site.

Test sites include your theme, plugins, options, and content. Your hosting company might offer staging sites. If they don’t, you can use the WordPress Staging plugin.

After your staging site is up and running, install and activate the Gutenberg plugin and start testing. Or install a brand new instance of WordPress on your computer and test on there.

Check Your Plugins

WordPress users are familiar with what happens when plugins don’t play nice together. Sometimes it’s due to the functionality or conflicting code. This is an excellent time to see if you are using all the plugins you have installed. If you aren’t, remove them.

You also want to see which plugins are being used when you are editing content in WordPress. Specific plugins such as Akismet, Contact Form 7, Google Sitemap Generator, and WP Super Cache have nothing to do with the editor and will not be affected by using Gutenberg.

On the other hand, any plugin that adds functionality or changes the way the WP classic editor looks might not be compatible with Gutenberg. In particular, plugins that generated shortcodes, adds custom styles, or haven’t been updated recently, usually conflict and cause problems.

Gutenberg used to have an active Plugin Compatibility database. However, it has been shut down because it is no longer actively maintained.

You can review the final data and download the database as a CSV file. Without access to an active plugin compatibility database, you are going to have to manually test each plugin you use.

Try creating a new post on your test site. You will see that you are in the Gutenberg editor and it will look different to you. When you start typing, you are automatically creating a paragraph block. You don’t have to add a new block when you add a new paragraph. Just hit enter or the return key.

Since you are trying to see if your current plugins will work, try to recreate how you used each one and see if it still works.

If it doesn’t, look for the same functionality in the default Gutenberg block, add that block, and add your content.

Be sure to keep a list of the plugins that don’t work correctly so you can remove them when going live with Gutenberg.

What If There Is No Default Block For The Functionality You Need?

Check all the blocks to see if the functionality you need lives inside another block. If you can’t find something that will work, you can contact the plugin authors and ask them if they are planning to update it to be compatible with Gutenberg.

If all else fails, try to find a Gutenberg plugin that does what you need. Delete the plugins that don’t work from your staging site.

Going Live

Before you do ANYTHING to your live site, make a complete backup of your entire site in case you missed something when checking for compatibility or another error occurs.

It is possible to make all the necessary changes on your test site and push them to your live site. However, this requires some technical knowledge. So, unless you are a developer or have one that works for you, it is better to make the changes manually.  

Start by deleting the plugins that didn’t work and adding the new ones you found to replace them. If old plugins are processing data for existing posts and pages and do not break new ones, you can leave them installed.

Do You Want To Convert Your Old Posts & Pages To Gutenberg Blocks?

Open each page and post from the Classic Block Menu. Click the three dots to view options. Select from the drop-down menu Convert to Blocks.

After WP converts your content to the Gutenberg block system, you should review each block. Use Block Navigation (from icons) to see all the parts of your post or page.

As you can see in the above screenshot, every paragraph, image, list, and heading is now in its own block. Converting existing pages and posts to the new Gutenberg system is quick and easy.

It might take several hours to test your plugins and find new ones, but you only have to do this once. Make sure to follow the steps suggested above to make your move to Gutenberg painless and error-free.

Related posts

• Tutorial WordPress Gutenberg: Como usar o novo editor

• Como mover WordPress site de um host para outro

• Como instalar e WordPress configuração no Microsoft Azure

• Como correr blazingly rápido WordPress em Microsoft Azure

• Como configurar Privacy em WordPress e por que é importante

• Como verificar se um site é banido de AdSense

• Criando Child Theme em WordPress

• Como construir um blog Wix tão bom quanto o WordPress

• 10 plugins essenciais do WordPress para um site de pequenas empresas

• WordPress mostra HTTP Error ao enviar imagens

• Como instalar um tema no WordPress

• usuários de redirecionamento de página 404 no WordPress

• Squarespace vs WordPress: qual é a melhor plataforma de site?

• Como rastrear Broken Links com Google Webmaster Tool

• Como instalar um site de teste do WordPress no seu computador

• Como criar seu próprio pop-up de cupom no WordPress

• 9 Plugins obrigatórios para novas instalações do WordPress

• Protect e WordPress website seguras contra hackers

• O que é AMP para WordPress e como instalá-lo

• Como atualizar o PHP no WordPress