Ir para o conteúdo principal

Gutenberg e a nova experiência com o Divi Builder

Divi: o tema WordPress mais fácil de usar

Divi: O melhor tema WordPress de todos os tempos!

mais Downloads 600.000Divi é o tema WordPress mais popular do mundo. É completo, fácil de usar e vem com mais de modelos livres 62. [Recomendado]

A estação da mudança está sobre nós. A recente chegada do WordPress 5.0 apresenta um novo editor de blocos (também conhecido como Gutenberg). E o lançamento de nossa nova experiência Divi Builder não apenas ofereceu uma integração suave com Gutenberg, mas ela também atualizou toda a experiência de projetar websites com Divi.

Estas novas mudanças, sem dúvida, levantam preocupações e confusões sobre como Divi e Gutenberg trabalham juntos e como melhor usar Divi com todas essas mudanças. O objetivo deste guia é mitigar os efeitos adversos da mudança explicando as opções disponíveis e as etapas necessárias para que a nova experiência do Divi Builder funcione com êxito no WordPress 5.0.

Para aqueles que não estão preparados para Gutenberg ou para a nova experiência do Divi Builder, não se preocupe. Vamos falar sobre as opções disponíveis para permitir que você continue trabalhando normalmente. E para aqueles que estão prontos para se aventurar no desconhecido, este guia irá ajudá-lo a encontrar o seu caminho.

Veja o que abordaremos neste tutorial:

  • A importância de instalar a versão mais recente do Divi ao atualizar para o WordPress 5.0
  • Como o novo construtor Divi trabalha com Gutenberg padrão
  • Como ativar o novo Divi Builder no backend com o WordPress 5.0 (método preferido)
  • Editando uma nova página com a nova interface de usuário do Divi Backend Builder
  • Usando o Classic Divi Builder com o novo Divi

A importância de instalar a versão mais recente do Divi ao atualizar para o WordPress 5.0

A versão mais recente do Divi é compatível com o WordPress 5.0. Portanto, se você estiver atualizando para o WordPress 5.0, também atualize o Divi para a versão 3.18 +. Esta nova versão resolve muitos problemas de compatibilidade com o novo editor de blocos Gutenberg. Se você mantiver uma versão anterior do Divi, você terá problemas para acessar o Divi Builder e outras configurações de página antes de atualizar.

As versões mais recentes do Extra, Bloom, Monarch e do plug-in Divi Builder também são compatíveis com o WordPress 5.0. Portanto, é melhor atualizá-los também durante a atualização.

Como o novo construtor Divi trabalha com Gutenberg padrão

Depois de ter atualizado o WordPress 5.0 e instalado o Divi 3.18 (versão mais recente), você está pronto para começar a criar seu site. Se você adicionar uma nova página, uma janela pop-up que permite usar o Divi Builder ou o editor padrão do WordPress (agora Gutenberg) estará disponível. Basta clicar em "Use Divi Builder".

use divi builder.jpg

Você notará que será lançado diretamente no Visual Builder.

construtor divi escolha uma opção.png

Se você sair do Visual Builder e editar a página no backend, verá que não há um Classic Divi Builder disponível. Você só poderá iniciar o Divi Builder no modo front-end.

nenhum editor clássico apenas o front editor.jpg

De fato, o WordPress 5.0 excluiu o editor clássico e o substituiu pelo editor de bloco (Gutenberg). Como resultado, todos os aplicativos conectados, incluindo o Classic Divi Builder, foram removidos. Em suma, não há Classic Divi Builder sem o editor clássico do WordPress.

Você está procurando os melhores temas e plugins do WordPress?

Baixe os melhores plugins e temas WordPress no Envato e crie facilmente o seu site. Já mais do que 49.720.000 downloads. [EXCLUSIVO]

Como ativar o novo Divi Builder no backend com o WordPress 5.0 (método preferido)

Alguns cliques são suficientes para acessar o novo Divi Builder no servidor. No seu painel do WordPress, vá para Divi> Opções de Tema. Uma vez lá, clique na guia criador. Sob as opções do construtor, clique na guia Avançado. Aqui você encontrará opções para ativar a última experiência do Divi Builder e ativar o editor clássico do WordPress. Você precisará ativar as duas opções para aproveitar o novo Divi Builder no back-end . Em seguida, clique em Salvar alterações.

interface divi.jpg

Nota: A opção para ativar o editor clássico nas opções do tema Divi sobrescreve o uso do plug-in de edição clássico fornecido por colaboradores do WordPress para pessoas que não estão prontas para usar o Gutenberg.

Depois de ativar a versão mais recente do Divi Builder e o editor clássico das opções de tema, você estará pronto para começar a criar suas páginas com a experiência New Divi Builder.

Editando uma nova página com a nova interface de usuário do Divi Backend Builder

Com o novo Divi Builder habilitado no WordPress Classic Editor, você verá o conhecido botão "Use Divi Builder". Clique neste botão como de costume para implantar o Divi Builder.

editor divi builder.jpg

Em seguida, selecione como você deseja começar a criar sua página a partir das três opções exibidas.

modo de seleção divi builder.png

Agora você está pronto para utilizar plenamente a nova experiência do Divi Builder. Você notará que o novo Divi Backend Builder é semelhante ao Divi Builder clássico, com alguns novos recursos poderosos na ponta dos seus dedos.

Aqui estão alguns recursos notáveis ​​da interface do usuário do editor de páginas que o ajudarão a entender um pouco melhor a nova experiência.

painel de interface do construtor divi wordpress.jpg

O botão "Construir na frente"

<

p style = "text-align: justify">construção divi builder.png
O botão "Construir em primeiro plano" substituiu o tradicional botão "Usar o Visual Builder", mas os recursos são os mesmos. Ele implantará o Divi Builder na frente para uma experiência visual completa do edifício como antes. A principal razão para formular esse botão é que não há mais um construtor visual separado. Existe apenas um Divi Builder que está agora disponível no backend e no front end.

Os modos de exibição agora disponíveis no back-end

<

Crie facilmente seu site com Elementor

Elementor permite criar facilmente qualquer design de site com uma aparência profissional. Pare de pagar caro pelo que você pode fazer por si mesmo. [Grátis]

p style = "text-align: justify">modos disponíveis no backend divi builder.png
O novo editor do Divi Builder apresentou o Visual Builder e todos os seus recursos no backend. Agora você não precisa se mover para editar sua página. Para ativar a experiência do gerador visual no backend, você pode alternar entre os diferentes modos de exibição na parte superior do gerador. Por padrão, o modo de exibição com fio está ativo, o que é lógico, pois corresponde de perto à aparência do construtor de backend clássico que estamos acostumados a ver. No entanto, você pode alternar entre diferentes modos de exibição (desktop, tablet e smartphone) para ver sua página visualmente (como no Visual Builder) no back-end sem ter que sair da página.

editor visual builder dashboard.gif

A nova interface do usuário do Divi Builder

<

p style = "text-align: justify">nova interface divi builder.png
Além da capacidade de alternar entre diferentes modos de exibição no back-end, a interface do usuário do Divi Builder funciona de forma transparente no back-end ao editar sua página.

Por exemplo, ao alterar as configurações de um item no back-end, as configurações modais podem ser movidas para qualquer local na janela do navegador, fornecendo o espaço necessário para modificar o backend enquanto visualizando suas alterações em tempo real.

modificação em tempo real divi builder.gif

Retornar ao Classic Divi Builder

retornar ao editor visual divi builder.png

Se você ainda não está preparado para a nova experiência do Divi Builder, você ainda pode usar o Classic Divi Builder como antes. A versão mais recente do Divi incorporou uma maneira extremamente simples de implantar o Classic Divi Builder, que fica na parte inferior da interface do usuário do Divi Builder no painel ao editar sua página. Você verá um link que lhe permitirá retornar ao Classic Divi Builder com um simples clique.

Nota: Você também pode mudar para o Classic Divi Builder em Opções de Tema. Clique na guia Construtor e, em seguida, clique na guia Opções avançadas. Você pode encontrar a opção para ativar ou desativar a última experiência do Divi Builder. Simplesmente desabilite esta opção para manter o Classic Divi Builder como antes. Mas lembre-se, para ver o Classic Divi Builder no backend, você precisa ter certeza de que a opção Classic Editor também está ativada.

desativar o novo editor divi.jpg

Os novos recursos do Divi Builder

<

p style = "text-align: justify">novo recurso divi builder.jpg
O novo Divi Backend Builder também inclui todos os novos recursos poderosos que estavam disponíveis anteriormente apenas no Visual Builder. E se isso não for suficiente, você também se beneficiará de novas melhorias de desempenho e usabilidade com este novo Divi Builder. Essas atualizações incluem:

Crie facilmente sua loja online

Baixe gratuitamente o WooCommerce, os melhores plugins de e-commerce para vender seus produtos físicos e digitais no WordPress. [FREE]

  • Construa a experiência mais rápido do que nunca com o uso da memória cache
  • Uma representação precisa de 100% da sua página em todos os modos de exibição usando o React Portal
  • A capacidade de copiar e colar entre páginas no Visual Builder exatamente como no Classic Builder.

Usando o Classic Divi Builder com o novo Divi

Como mencionado acima, você pode usar o Classic Divi Builder usando o link fornecido no novo editor de página do Divi Backend Builder ou desabilitando a versão mais recente do Divi Builder nas opções de tema.

Depois de fazer a alteração, o editor da página de plano de fundo ficará quase exatamente igual ao anterior, com alguns pequenos ajustes. Você notará que o antigo botão "Use Visual Builder" agora diz Build on Server, mas a função ainda é a mesma de antes. Você também poderá mudar para o novo Divi Builder clicando em um link na parte inferior do Divi Builder no backend.

editor clássico divi builder.jpg

Tenha em mente que o Classic Divi Builder sempre perderá todos os novos recursos disponíveis no backend no New Divi Builder.

Últimos pensamentos

O lançamento de Gutenberg sozinho é um pouco esmagador para a maior parte. O editor de páginas do WordPress que todos conhecemos é completamente diferente! Mas, felizmente, o lançamento do novo Divi Builder integra-se perfeitamente com o Gutenberg, permitindo que você mantenha a interface de usuário familiar que você gosta agora. E com todos os recursos poderosos agora disponíveis no backend, o Divi Builder é mais rápido e confiável do que nunca.

Deixe um comentário

Seu endereço de email não será publicado. Campos obrigatórios estão marcados com *

Este site usa Akismet para reduzir indesejados. Saiba mais sobre como seus dados de comentários são usados.

Cool WordPress temas que eu encontrei em
E há mais temas e modelos 50 000 para você escolher!

De volta ao topo
6 ações
ação6
chilrear
Enregistrer
Whatsapp