Criar Menu Personalizado com Módulos do Divi Builder

Curso DIVI | Criar Menu Personalizado com Módulos do Divi Builder

O Divi oferece a opção de criar Menu utilizando os módulos, com isso você ganha mais flexibilidade na criação e não depende mais do menu padrão do tema.

Vou mostrar como criar o menu de uma forma diferente, onde podemos ter mais de um menu e com isso aplicar o menu em uma página especifica.


O que é menu para o site?

O menu é a navegação rápida pelo site para informar e orientar para onde ir.

Por padrão todos os temas tem seu menu para o site e o DIVI tem o menu padrão dele que pode ser editado na opção personalizar do painel admin.

Mas para tornar o trabalho mais flexível é possível criar o seu próprio menu pelo construtor de tema do DIVI.


Criar Menu Personalizado com Módulos do Divi Builder

O Divi Theme Builder é uma interface dentro do Divi que permite usar o Divi Builder para construir modelos de tema e atribuir esses modelos personalizados a páginas.

Resumindo, o Divi Theme Builder pega o poder do Divi Builder e o estende a todas as áreas do Divi Theme, permitindo que você crie cabeçalhos, rodapés, páginas de categoria, modelos de produto, modelos de postagem de blog, 404 páginas e muito mais.

 

Onde criar menu personalizado no DIVI

O Divi Theme Builder pode ser acessado no back-end do painel do WordPress na categoria Divi de itens de menu.

No painel do WordPress, navegue até Divi > Theme Builder.

Isso o levará à interface principal do Divi Theme Builder, onde você gerenciará todos os seus modelos.

 

Divi Theme Builder


Áreas globais para criar o modelo no site

O modelo de site padrão é composto de três áreas: Cabeçalho global “menu”, Corpo global “conteúdo” e Rodapé global “informações”.

Para criar o cabeçalho global “menu” para o seu site, clique na área “Adicionar Cabeçalho Global” e selecione a opção “Criar Cabeçalho Global”.


Cabeçalho global

Assim como construir uma página no Divi, você vai construir o layout do menu. Por exemplo, você pode iniciar o design do zero ou um layout de cabeçalho que você projetou anteriormente, selecionando a opção “Escolha um layout predefinido”.


CÓDIGO CSS para criar efeito de rolagem e menu fixo.

https://www.elegantthemes.com/blog/divi-resources/how-to-add-a-custom-fixed-header-for-mobile-using-divi


Menu FIXO de uma forma mais simples.

Uma forma fácil de colocar qualquer objeto, linha ou seção como fixo na tela. 

Aperte na engrenagem da seção AZUL, depois abre um POPUP.

Depois ir em AVANÇADO, role para baixo e aperte em CARGO.

Em cargo vai mudar de Padrão para FIXED e um pouco abaixo centralize.


Se estiver fazendo um menu no Theme Builder lembre de fazer um CSS para compensar o tamanho do MENU


.page.et_pb_pagebuilder_layout #main-content { margin-top: 190px; }

@media (max-width: 707px){

.page.et_pb_pagebuilder_layout #main-content { margin-top: 0px;}

}


Criando na prática o menu no DIVI

Confira no vídeo abaixo o tutorial completo de criação de modelo global para menu.



https://www.youtube.com/watch?v=nTlCqcjiOUc

 

DIVI Builder melhor Tema para Sites em WordPress

 ADQUIRIR O TEMA DIVI 

🏆DIVI Builder melhor Tema para Sites em WordPress🏆

  1. Acesso completo.
  2. Sites ilimitados.
  3. Usuários ilimitados.

Descubra o poder do Tema Divi e experimente a construção de um site com visual verdadeiro no link abaixo.

👉 https://www.elegantthemes.com/affiliates/idevaffiliate.php?id=67441

Comentários