Want to Add a Menu to Your Elementor Site?
This guide will show you how to create, set up, and customize a navigation menu in Elementor using the ElementsKit Nav Menu Widget.
Navigation menus are key for any website, helping visitors quickly find what they need. Most site owners place menus in the header for easy access across all pages.
With the tips in this guide, you’ll have a functional, stylish menu ready in no time. Let’s get started!
What is an Elementor Mega Menu in WordPress?
Mega menus have become a popular way to improve website navigation, helping users easily browse your content and find what they need.
In WordPress, the default navigation menu allows you to include pages, posts, categories, and URLs, with the design typically controlled by your theme. However, upgrading to a mega menu offers more flexibility and customization to provide better site’s experience to users.
Why Use the ElementsKit Nav Menu Widget?
- You can create custom and advanced menus in the drag and drop style
- ElementsKit offers all-in-one solution along with the navigation menu
With the ElementsKit add-on for Elementor, you can build a feature-rich mega menu that enhances your website’s functionality and design effortlessly.
🔔 Did you know?
Using a WordPress theme or page builder often limits your control over the header and footer design.
What about getting full control in customization? Check this out to learn more Como criar e personalizar o rodapé do cabeçalho – Elementor Page Builder
O que o Mega Menu da Elementor da ElementsKit tem a oferecer:
Como o mega menu for ElementorO ElementsKit também abre uma série de possibilidades para "hackear" seu menu normal do WordPress.
Para ser mais específico, o plugin irá ajudá-lo nos seguintes aspectos:
- Customize menus with tags, colors, hover effects, and icons
- Style top-level and submenu appearances
- Create vertical or horizontal menus
- Choose header layouts from the ElementsKit library
- Add animations for submenu displays
- Drag-and-drop the nav menu widget with one click
- Compatible with eCommerce platforms like WooCommerce
- Build content using Elementor widgets
- Fully responsive with off-canvas menus for tablets
- Display builder content or simple lists as submenus on tablets
E claro, o melhor é que o O menu ElementsKit Nav está disponível gratuitamente e premium versões. Portanto, mesmo que você não compre as assinaturas pagas, você ainda experimentará esse incrível recurso de menu Elementor em seu site.
Como criar itens de menu no Elementor
Vamos dar uma olhada em alguns casos do mundo real e revisar nossa grande lição do menu WordPress. Agora você está prestes a viajar para o exterior para criar seu mega menu WordPress, cabeçalho e adicionar seu conteúdo.
Crie um cardápio
Para criar um menu Elementor, você precisa fazer é Ligar a opção de mega menu da inicialização do ElementsKit Módulos página e depois de ligá-lo, clique no botão Salvar alterações botão.
Creating a menu in Elementor requires a few simple steps. Go to your Painel WordPress e depois clique em Cardápios. Depois disso, você verá uma seção chamada Estrutura do menu. Então insira seu Nome do cardápio ou cabeçalho do menu e clique em Criar cardápio.
Agora expanda Links personalizados e coloque o seu URL assim como Texto do link, then click on Adicionar ao cardápio.
📝Nota rápida
Você pode adicionar, remover ou editar quantos itens de mega menu desejar, repetindo o mesmo método.
É hora de adicionar seus itens de menu no Elementor através do ElementsKit. Mas antes disso, você precisa marcar ✅ o habilite o menu para o conteúdo do mega menu section as shown in the image, underneath the Menu Name section.
Então você verá uma tag Mega Menu em seu Texto do link. Depois de clicar no Mega Cardápio tag um pop-up será aberto.
Para ativar a opção Mega Menu você precisa clicar no botão ativar EDITAR CONTEÚDO DO MEGA MENU botão e salve. Está tudo pronto!
🧐 Mais informações no menu Elementor
Não se esqueça de visitar nossa documentação em ElementsKit Mega Menu Builder para Elementor
Importar um menu (Mega Menu Vertical)
Para criar um menu vertical, primeiro você precisa ligar o cardápio vertical ferramenta. Então clique em salvar alterações.
Então clique em Modelos no lado esquerdo do seu painel. Depois de apenas clicar Importar modelos.
Agora você tem que selecionar escolher arquivo do seu dispositivo. Depois é só clicar Importar agora. E você verá todos os seus dados importados de uma só vez.
Além disso, para criar um menu vertical com seus dados você precisa ir para Aparência então clique em Cardápios. Você também pode criar um menu acima. Para mais detalhes, você pode visitar nosso site de documentação no menu vertical.
Personalizando o Menu
É hora de customizar seu conteúdo e para isso você precisa clicar no botão EDITAR CONTEÚDO DO MEGA MENU botão. Logo após clicar no botão, você verá que uma tela estilo menu Elementor apareceu.
Tudo que você precisa fazer é clicar no Ícone do ElementsKit e selecione qual cabeçalho predefinido você deseja inserir em seu site.
Logo após clicar no Botão do widget ElementsKit, ele o levará à sua biblioteca de widgets. Nele, você obterá toneladas de páginas, modelos e seções pré-fabricadas. Mas para criar uma seção de mega menu você precisa clicar no botão Seções
Para criar e personalizar seus itens de menu no Elementor. Você precisa selecionar o layout dos itens do Mega Menu e começar a personalizar como quiser!
Aqui você encontrará 3 partes (Layout, estilo e avançado) de personalizar seu menu Elementor através do ElementsKit:
Disposição:
Nesta seção, você verá múltiplas opções para editar o layout e a estrutura de um menu Elementor. Você tem total controle sobre como seu mega menu deve ser apresentado.
Agora, com o widget de mega menu ElementsKit, você pode personalizar seu Largura do conteúdo, você pode criar um menu em tela cheia ou personalizar o tamanho que preferir deslizando para a direita ou para a esquerda. Lacunas de coluna entre o seu mega menu também pode ser personalizado do jeito que você quiser.
Com o menu ElementsKit Elementor, você pode editar a altura dos itens do menu. Ele também tem várias opções para editar o Alinhamento vertical, Transbordar, Etiquetas HTML que pode ser alterado de acordo com sua demanda.
Estilo:
Com as opções de estilo de mega menu do ElementsKit, você pode alterar a aparência inteira do menu. Para ser mais específico, você pode alterar ou editar o Fundo, Sobreposição de fundo, Fronteira, Divisor de formas, e claro Tipografia.
O widget de mega menu Elementor da ElementsKit é um salva-vidas. Possui uma variedade de elementos de estilo de menu que o ajudarão a aproveitar ao máximo seus itens de menu.
Avançado:
Nossas opções avançadas de estilo de menu para o seu menu WordPress são algo que você sempre procurou. Sim, as opções do mega menu ElementsKit Elementor também ajudarão você a acessar e editar todas as seções avançadas.
No qual você pode criar um novo layout de menu. ElementsKit tem alternativas mais avançadas como somar efeitos, pegajoso, efeitos de movimento, flutuar customização e muito mais que irão melhorar ainda mais sua experiência editorial e tornar seu mega menu mais inteligente.
A última e mais importante parte é sincronizar um mega menu que você precisa para criar um cabeçalho em seu site Elementor.
Agora mostraremos como criar um modelo de cabeçalho personalizado Elementor. Bem, há outra boa notícia para você com o widget de menu de navegação ElementsKit. Você pode criar o layout do menu de navegação apenas clicando em nossas opções de layout de menu WordPress pré-construídas.
Vamos começar!
Primeiro de tudo, você precisa ir para Kit de Elementos no painel do WordPress e clique no botão cabeçalho rodapé, para ativar o widget do menu de navegação em seu site.
Então clique em adicionar novo mencionado logo após os modelos.
Depois de clicar no adicionar novo botão um Configurações do modelo aparecerá, que é a parte final da integração de um mega menu em seu site.
Aqui nesta seção, você precisa dar ao seu menu de navegação um nome chamado título do cabeçalho. Você também pode alterar o condições do cabeçalho e clique em ativação (se você estiver pronto e satisfeito com seus itens do mega menu).
Na parte final, não esqueça de clicar no botão editar com elementor botão logo antes do salvar alterações botão.
Agora mostraremos 2 maneiras de adicionar seu mega menu através do widget de menu de navegação do ElementsKit.
Método um:
Para adicionar um widget de menu de navegação ao seu site, o primeiro método que você pode seguir depois de clicar nele editar com elementor botão, tudo que você precisa fazer é clicar no ElementsKit ícone do widget então vá para Seções e selecione um estilo de cabeçalho o que você preferir.
Depois disso, você verá seu Cabeçalho o título que você adicionou do painel do WordPress aparecerá na seleção seção do menu. E apenas clicando no título do cabeçalho, você verá que todos os itens do seu mega menu estão visíveis.
Método dois:
Você também pode incorporar o widget do menu de navegação por meio do opção arrastar e soltar e também adicionar diferentes elementos ao seu redor (por exemplo, imagens, vídeos, outras seções, etc.)
Tudo que você precisa fazer é selecionar qualquer tipo de seção (selecionei três seções para este exemplo). A pesquisa quais widgets você prefere adicionar no painel do Elementor.
Aqui neste exemplo, arrastamos uma imagem, um menu de navegação e um vídeo. Você pode adicionar quantas seções e widgets desejar.
Então, novamente, o mesmo método pode ser usado para ativar seu menu de navegação: no Selecione o menu seção, você verá o título do cabeçalho que você adicionou no painel do WordPress. E apenas clicando no título do cabeçalho, você verá que todos os itens do seu mega menu foram inseridos.
Agora você sabe que usar o widget do menu de navegação é super simples e está pronto para o rock 'n roll! Lembre-se de que você também pode criar um menu fora da tela no ElementsKit.
🛠 Informação adicional
Para saber mais sobre menu fora da tela no ElementsKit, não se esqueça de conferir nosso vídeo mais recente sobre construindo um menu fora da tela usando ElementsKit
Pensamentos finais
Mega menus são ferramentas maravilhosas para melhorar a navegação no site. Eles permitem que você organizar um grande número de categorias e produtos para facilitar aos usuários para navegar pelo seu conteúdo.
A criação do Mega Menu com o complemento ElementsKit para Elementor está sempre disponível para oferecer o melhor suporte sem nenhum preço. Se você estiver adicionando sozinho, a opção Nav Mega Menu integrada do complemento ElementsKit pode ser um começo para você.
O ElementsKit é simples, leva pouco tempo para configurar e ajustar e também é simples de usar. No entanto, esperamos que este artigo tenha sido útil o suficiente para fornecer uma visão geral de todo o aspecto do mega menu.
Deixe um comentário abaixo se você tiver alguma dúvida sobre o Mega Menu, Menu de Navegação ou suas funcionalidades.
Se você gostou deste artigo, certamente encontrará mais dicas e blogs úteis juntando-se ao nosso Comunidade WPmet Siga-nos no Facebook Twitter. Por fim, não se esqueça de se inscrever em nosso canal no YouTube para tutoriais úteis.
Deixe um comentário