Editor do Wix Studio: adicionar e personalizar um mega menu
4分
Mega menus são contêineres que você pode adicionar a um menu horizontal. Quando os visitantes passam o mouse sobre o item de menu relevante, o contêiner é aberto. Faça o design do contêiner do zero e decida para o que você deseja usá-lo: navegação em vários níveis, exibição de produtos em destaque ou qualquer outro fim.
É importante saber que:
Só é possível adicionar um contêiner do mega menu a um menu horizontal. Os contêineres de mega menu não são suportados em menus verticais, menus âncora e menus hambúrguer.
Neste artigo confira como:
Adicionar e configurar um contêiner do mega menu
Adicione o contêiner do mega menu como um item a um menu existente e dê o nome que você quiser. Recomendamos o uso de um título que reflita o conteúdo mostrado, como "Serviços" ou "Nossa história".
Depois de adicionar e nomear seu contêiner, adicione elementos como botões, formas e texto para criar o conteúdo desejado.
Para adicionar um mega menu:
- Selecione o menu horizontal relevante no seu Editor.
- Clique em Gerenciar menu.
- Clique em + Adicionar item na parte inferior do painel.
- Selecione Mega menu.
- Insira um título para o mega menu.
Dica: esse é o título sobre o qual os visitantes passam o mouse para ver o mega menu. - Clique em OK.
- Adicione conteúdo ao mega menu:
- (No painel Gerenciar menu) Clique em Editar ao lado de Contêiner.
- Adicione todos os elementos necessários ao contêiner.
Ajustar o layout do contêiner do mega menu
Após adicionar os elementos que você deseja ao mega menu, altere o layout para combinar com a estrutura da sua página. Você pode ajustar o espaçamento e decidir até onde o contêiner se estende.
Para alterar o layout:
- Selecione o menu relevante no seu editor.
- クリックしない レイアウト .
- Clique em Mega menu.
- Use as opções para ajustar o layout:
- Esticar contêiner: decida se o contêiner se estende ou não para a largura total da tela do visitante. Quando desativada, você pode definir a largura desejada na tela ou no painel Inspetor.
- Margens: adicione espaço (em px ou %) entre o contêiner do mega menu e as bordas da tela.
- Espaço entre os itens e contêiner: arraste o slider para aumentar ou diminuir o espaço entre o menu e o contêiner do mega menu.
Fazer o design do mega menu
Depois de ajustar o layout do contêiner, faça o design das bordas, background e mais. Para manter uma aparência consistente, as alterações feitas no mega menu também se aplicam a todos os submenus que você adicionou.
Para personalizar o design do contêiner:
- Selecione o menu relevante no seu editor.
- クリックしない Abrir inspetor no canto superior direito do editor.
- Selecione Contêiner do submenu no dropdown O que você deseja criar?.
- Use as opções disponíveis para fazer o design do contêiner:
- Background: defina uma cor, gradiente ou background de imagem para o contêiner. Você pode adicionar várias camadas de background com diferentes níveis de opacidade.
- Bordas: adicione e faça o design das bordas para o contêiner.
- Cantos: deixe os cantos do contêiner mais redondos ou retangulares.
- Sombras: adicione uma sombra atrás do contêiner para um efeito 3D.
この記事は役に立ちましたか?
|