Passar para o conteúdo principal
Todas as coleçõesConstrutor de Sites/BuilderElementos
Como funciona o elemento Menu na Rockty
Como funciona o elemento Menu na Rockty

Saiba como configurar um Menu na Rockty para aprimorar a navegação e organização do conteúdo em suas páginas

Sylas avatar
Escrito por Sylas
Atualizado há mais de 2 meses

Introdução

Os menus são essenciais para a navegação e organização do conteúdo em suas páginas. Na Rockty, configurar um menu é um processo simples e personalizável, permitindo que você crie menus que se adaptem perfeitamente ao design do seu site. Este tutorial vai guiá-lo por todas as etapas de configuração do elemento Menu, abordando desde ajustes básicos até configurações avançadas.


1. Como Adicionar Menus

Para adicionar um menu à sua página na Rockty, siga estes passos:

  1. Adicione um novo elemento em sua página.

  2. Selecione o elemento 'Menu' na lista de opções disponíveis no menu lateral esquerdo.

💡 Dica: Caso precise de mais detalhes sobre como adicionar elementos, confira nosso tutorial Gerenciando Elementos na Rockty: Adicionar, Excluir e Personalizar para orientações iniciais.


2. Como Acessar as Configurações do Elemento

Para acessar as configurações de um menu, clique no ícone de engrenagem do elemento ou clique com o botão direito do mouse sobre ele para abrir o menu de opções. Isso disponibilizará todas as possibilidades de configuração que veremos neste tutorial.


3. Configurações do Menu

Ajustes

  • Visibilidade: Controle a visibilidade do menu em dispositivos Desktop, Tablet ou Mobile clicando nos ícones correspondentes. Para reexibir um menu oculto, clique novamente no ícone do dispositivo desejado.

  • Inserir e Gerenciar Itens do Menu:

    1. Para editar o texto de um item, clique em "Item 01", "Item 02", "Item 03" ou “New item” e personalize conforme desejado.

    2. Para configurar ações dos itens, clique no ícone de link ao lado de cada item e escolha uma das opções conforme necessário.

    3. Para excluir um item, clique no ícone de lixeira.

    4. Para adicionar um novo item, clique no botão "+".

    5. Ative ou desative o estilo de menu hambúrguer "" para a versão mobile conforme necessário.


Posição

Ao configurar o menu no seu construtor de páginas, você pode ajustar a posição e a direção para atender melhor ao layout desejado.

Configurações Principais

  • Posição: Defina o alinhamento do menu para a esquerda, centro ou direita, de acordo com o design da página.

  • Direção: Escolha entre uma disposição horizontal ou vertical para o menu.

  • Margens e Espaçamentos Internos: Ajuste as margens e espaçamentos internos manualmente ou utilizando as barras deslizantes para obter o posicionamento ideal.

  • Evite margens negativas para prevenir conflitos com outros elementos da página.

💡 Dica para Mobile: Caso você opte por não usar o menu do tipo hambúrguer "" no mobile, considere configurar a "Direção" do menu como "Vertical". Essa configuração geralmente proporciona uma navegação mais intuitiva e responsiva em dispositivos móveis, aproveitando melhor o formato da tela.


Estilo e Tipografia

  • Estilo: Ative ou desative bordas de contorno nos itens do menu.

  • Cor do Texto: Escolha a cor da fonte através da paleta de cores ou insira o código HEX. Para excluir uma cor, clique no ícone de lixeira.

  • Fontes: Selecione entre centenas de tipos de fontes disponíveis para personalizar o menu.

  • Tamanho da Fonte: Ajuste o tamanho manualmente ou use a barra deslizante.


Avançado

  • Efeitos de Movimento – Animação: Adicione animações ao menu selecionando um efeito da lista. como efeitos de entrada ou ao passar o mouse. Configure o comportamento (uma vez ou infinito), ativação e duração (normal, devagar, rápido).

  • CSS Classes: Personalize o estilo do menu usando CSS. Insira um nome para o CSS e utilize o elemento de Script para aplicar o código correspondente. Para mais detalhes, consulte nosso tutorial sobre CSS Classes.



Conclusão

Configurar menus na Rockty é uma tarefa que permite grande flexibilidade e personalização para melhorar a navegação do seu site. Utilize as opções de ajustes, estilo e configurações avançadas para criar menus que atendam às suas necessidades específicas. Em caso de dúvidas, consulte nossos tutoriais adicionais para obter suporte detalhado.


Dicas Adicionais

  • Organize os Itens do Menu de Forma Clara: Certifique-se de que os itens do menu estão organizados de forma lógica e intuitiva. Agrupe itens relacionados e mantenha a estrutura do menu simples para facilitar a navegação.

  • Use Links Relevantes e Atualizados: Verifique se todos os links do menu estão corretos e levam os usuários às páginas ou seções apropriadas. Links quebrados ou desatualizados podem frustrar os visitantes e prejudicar a navegação.

  • Considere a Navegação Responsiva: Garanta que o menu seja responsivo e funcione bem em dispositivos móveis.

  • Personalize o Estilo do Menu: Aproveite as opções de personalização para ajustar a aparência do menu, como cores, fontes e espaçamento. Isso ajudará a garantir que o menu se integre bem com o design geral da sua página.

  • Utilize Animações e Efeitos com Moderação: Animações e efeitos visuais podem melhorar a experiência do usuário, mas evite exagerar. Mantenha as animações sutis para não distrair ou sobrecarregar os visitantes.

  • Inclua um Indicador de Navegação Ativa: Adicione um indicador visual para destacar o item do menu que está atualmente selecionado ou ativo. Isso ajuda os usuários a entenderem sua posição na navegação e facilita a orientação dentro do site.

  • Teste a Navegação do Menu: Sempre teste o menu em diferentes navegadores e dispositivos para garantir que ele funcione corretamente em todos os ambientes. Verifique a funcionalidade dos links e a usabilidade geral do menu.


Precisa de Ajuda?

Se tiver dúvidas ou precisar de suporte adicional, entre em contato com nossa equipe de Suporte!

Respondeu à sua pergunta?