Como usar?

Slide Menu—também conhecido como Hamburger Menu, Sidebar Menu ou Drawer Menu—é comumente usado em sites Shopify ao adaptar o menu de desktop para mobile. Tipicamente, este menu padrão é simples, sem imagens ou layouts avançados. Navi+ oferece uma substituição completa para esse menu básico padrão.

Principais Benefícios:

  • Substitui completamente o menu simples padrão do Shopify
  • Oferece múltiplos estilos de apresentação com imagens, grades e layouts multinível para uma experiência rica e profissional
  • Funciona perfeitamente tanto em mobile quanto em desktop para uma experiência consistente

FAQ:

1. Eu ainda não decidi se vou usar a versão gratuita ou paga. Posso experimentar os templates de menu profissional?

Absolutamente! Os grupos de menu são principalmente para ajudar iniciantes a evitar se sentir sobrecarregados por recursos avançados no Navi+ 😄. A melhor maneira é experimentar os menus profissionais para explorar todos os recursos e opções de layout. Mais tarde, você pode simplesmente excluir qualquer menu que não precise ou que considere inadequado.

2. Criar um menu aqui faz com que ele apareça no meu site imediatamente?

Ainda não. Você precisará publicar o menu correto para que ele apareça no seu site. Não se preocupe — é fácil!

3. E se eu escolher o template errado ou cometer um erro?

Sem problemas. Você pode excluí-lo e criar um novo a qualquer momento. Se você estiver testando um menu e quiser experimentar outro template, pode salvar o atual como um arquivo de backup e reabri-lo mais tarde. Você pode até copiar e colar partes entre menus (abrindo duas abas do navegador) para manter seu trabalho anterior. Sinta-se à vontade para experimentar!

4. Devo criar apenas um menu ou vários?

Você deve criar vários menus. Apenas o menu ativo será exibido no seu site, mas você pode preparar muitas versões — selecionando diferentes templates ou clonando menus. Menus podem ser configurados para mostrar/ocultar com base no tipo de página (início, produto, coleção...), dispositivo (mobile ou desktop) ou palavras-chave de URL. Então, vá em frente e construa menus que se encaixem em cada situação!

Passo 1: Edite a árvore do menu

1.1. Entendendo a Árvore do Menu

A árvore do menu é a parte mais importante de qualquer menu — ela define a estrutura.

Aqui está um exemplo de uma árvore de menu do Slide menu:

Slide banner  
Deal of the Day
Catalog 
All Mountain  
   - Cruise Flex  
   - Balance Ride
   - Other all-mountain
        - Level 3 menu item
Freestyle  
   - Park Board  
   - Jib Board  
Other products  
Blogs  
More...  

Esta é uma árvore de menu de 3 níveis. O nível 1 inclui Slide banner, Deal of the Day, [Catalog + All-Mountain + Freestyle + Other products], Blogs e More... Catalog atuará como um nome de grupo. All-Mountain também é um item de menu de nível 1, com três submenus de nível 2: Cruise Flex, Balance Ride e Other all-mountain.

Você passará a maior parte do seu tempo construindo esta árvore de menu para o seu site, ajudando os clientes a encontrar o conteúdo que estão procurando.

Catalog: A level 1 menu item, displayed as a tab on the tab bar. All-Mountain: Level 2 menu item that appears when you tap on Catalog.
Cruise Flex, Balance Ride: Level 3 menu item that appears when you tap on All-Mountain.

1.2. Interações Básicas com a Árvore do Menu

Você pode arrastar e soltar itens de menu para cima e para baixo ou para a esquerda e para a direita para mudar sua posição e relacionamentos pai-filho na árvore do menu.

Quando você passar o mouse sobre qualquer item de menu, verá opções adicionais: editar os detalhes do item, excluí-lo da árvore do menu ou copiá-lo e colá-lo em outro lugar.

Dica: Você pode copiar um item de menu de um menu para outro abrindo o aplicativo Navi+ em duas abas do navegador.

1.3. IMPORTANTE! Exclua os itens de menu de exemplo e mantenha apenas a estrutura que você deseja.

Esta é uma situação comum ao criar um menu com o Navi+. Quando você cria um novo menu, incluímos um exemplo completo com itens de menu populares para mostrar ideias de layout e permitir que você copie/cole conforme necessário. No entanto, se você é novo no Navi+ e está usando o plano Starter, verá muitos avisos vermelhos (i) para recursos que não estão disponíveis, como fazer upload de imagens ou usar interações avançadas.

Se você gosta desses recursos avançados, considere fazer upgrade para um plano Business ou Elite. Mas se você quiser continuar com o plano Starter, por favor, encontre e exclua os itens de menu com avisos vermelhos (i).

Dica Importante: Quando a confirmação de exclusão aparecer, ative “Não perguntar novamente na próxima vez” para excluir mais rápido.

1.4. Adicione itens de menu à Árvore do Menu

Para adicionar um item de menu, você tem duas opções:

Opção 1 **(Não recomendado se você é novo no Navi+)**: Clique em “Adicionar menu” para inserir um item de menu em branco no final da árvore do menu. Este método requer um bom entendimento das configurações do item de menu, que abordaremos abaixo. Pode parecer esmagador no início, então você pode explorar isso mais tarde.

Opção 2 (Recomendada): Já preparamos muitos templates de itens de menu bem projetados para você. Basta copiá-los e colá-los no lugar certo. Após terminar sua árvore de menu, basta excluir os templates não utilizados.