Como criar um Menu em Janela

Menus são como “guias turísticos” dentro de um website, são eles que orientam os visitantes sobre quais páginas devem ter prioridade de navegação. Um menu bem feito e com visual atrativo é sempre algo positivo para o site, pois é o que melhora a experiência do usuário.

Basicamente há duas modalidades de menus: o menu na horizontal e o menu vertical.

O menu horizontal está quase sempre localizado no cabeçalho do site, o que facilita sua visualização. Ele pode estar à esquerda ou à direita da página. Alguns podem ser fixados ao cabeçalho, fazendo com que, ao rolar a página, o menu fique preso no topo.

Os menus verticais caíram em desuso nos últimos tempos (na verdade eles nunca foram muito usados) principalmente quando visualizados em desktops (computadores). Já nos dispositivos móveis seu uso é padrão.

Menu em Janela

Antes de continuarmos precisamos entender o que é uma janela.

Janela é um recurso em que uma pequena área flutuante surge no meio (ou em outras partes) da tela. Essas janelas podem ser ativados por um clique ou ao carregar o site.

Essa funcionalidade foi adicionada ao Wix há pouco tempo atrás. Pode ser usado para capturar emails, inserir um formulário de contato, exibir uma informação útil, etc.

Uma possibilidade que não está presente nas opções da Janela, é inserir ou criar um Menu dentro da janela. O resultado é um “menu” vertical com estilo e formato inovador e diferente.

Veja aqui uma demonstração.

Como fazer

Esse é um menu personalizado, ou seja, não existe esse tipo de menu no editor Wix. Para ter um igual a esse você terá de criá-lo.

Para adicionar um menu que fique semelhante ao exemplo acima, siga os passos:

1. Dentro do editor, clique no botão ‘Adicionar>>Janela‘ e selecione a opção ‘Contato (Barra lateral)’.

2. Agora acesse as ‘Configurações‘ da janela.

3. Neste janela, desmarque a opção ‘Mostrar janela automaticamente‘.

4. Clique agora em ‘Layout‘:

5. Altere a posição da janela para ‘Esquerda‘:

6. Agora exclua todos os elementos que estavam na janela. Você pode deixar aqueles aos quais acha que irá usar.

  • A partir daqui adicione textos que irão compor o seu menu e organize-os verticalmente (um embaixo do outro), dando-lhes os nomes que compõem as páginas do seu site e inserindo links correspondentes. (observe o exemplo acima para entender).
  • Também é possível inserir um menu vertical inteiro (já com as páginas do site) na janela.
  • Para isso, basta ir em “Adicionar>Menu” e escolher um menu vertical. Após isso, basta arrastá-lo para dentro da Janela.

Exemplo:

Animações do Menu

É importante mudar a animação da janela, para que não fique algo exagerado ou sem sentido.

7. Selecione o botão de Animação:

8. Agora escolha uma animação. Em nosso exemplo, escolhi personalizar a animação ‘Surgir‘:

Botão Fechar (X)

Mude a aparência do botão ‘Fechar‘, clicando sobre ele escolhendo o item ‘Trocar design‘:

Escolha entre vários tipos de botões. Mude tamanhos e cores.

Botão de acionamento do Menu

Agora que o menu já foi criado e configurado, iremos adicionar o botão que vai acionar a janela.

Para isso, insira algum ícone no site que indique ser um Menu.

Dica: Para encontrar esse tipo de ícone, vá em ‘Adicionar>Forma‘, desça até a opção ‘ícone’ e escolha ‘mais ícones‘. Depois digite o termo ‘menu’ na caixa de pesquisa e escolha um ícone:

Adicione esse ícone no cabeçalho do site e torne-o ‘visível em todas as páginas‘.

Por fim, atribua um link de Janela a esse ícone. 

Desse modo, toda vez que alguém clicar no ícone, irá surgir um o menu criado sobre a janela.

1 comentário em “Como criar um Menu em Janela”

Deixe um comentário