Os mega menus permitem que os usuários vejam mais links de uma só vez, sem precisar rolar, passar o mouse e lembrar o conteúdo do seu cardápio. A melhor maneira de pensar em mega menus é que eles são menus suspensos dentro de menus suspensos.

Portanto, em vez de seu menu suspenso normal, que mostra um submenu quando você passa o mouse sobre os links principais principais na barra de navegação, um mega menu permite que você tenha links e submenus principais adicionais no menu suspenso.

Como adicionar um mega menu à sua barra de navegação

Faça login no painel do WordPress e navegue até Aparências> Menus .

wordpress menu divi.png

Crie um menu com quatro links pai com cada um dos links pai tendo seus próprios links de submenu. No exemplo abaixo, adiciono três itens de submenu em cada um dos quatro links de menu pai.

menu divi.png

Crie um link adicional para servir como um link de mega-menu. Para o exemplo abaixo, chamo este link de "Principal". Em seguida, arraste os dois links de menu pai (cada um com seus links de submenu) sob o link Principal.

Agora, para criar seu Megamenu, você precisa adicionar uma classe CSS especial ao link principal de nível superior chamada "Principal". Você pode fazer isso clicando no link de opções de tela na parte superior da página e verificando se a opção de classe CSS está marcada.

classes css divi.png

Finalmente, você precisa adicionar uma classe CSS ao link “Principal” que acabou de criar. Clique na seta à direita do item de menu "Principal" para alternar as opções de configuração adicionais. Encontre a caixa de texto intitulada Classes CSS e entre na classe "Mega-menu".

mega menu divi.png

Agora, quando você recarrega sua página, pode ver que todos os menus anteriores foram colocados no menu gigante sob esse link, o Mega Menu.

mega menu divi example.png

Isso é tudo para este tutorial, espero que ele permita que você crie um mega menu em Divi com toda a simplicidade.