Como corrigir links no menu de navegação da Shopify: quebrados, ausentes e não clicáveis

Poucas situações no dia a dia de uma loja online causam tanta apreensão quanto constatar que um link de navegação não responde ao clique do comprador. Você clica em uma categoria principal no cabeçalho esperando exibir uma coleção de produtos organizada, mas nada acontece. Ou pior: um cliente toca em um item pelo smartphone e vai parar em uma página de erro 404 em branco.

Entender a diferença entre um link de menu com defeito e um link devidamente corrigido começa pelo diagnóstico exato do local onde a conexão falhou. Na maioria das lojas da Shopify, os links quebrados não decorrem de falhas de programação ocultas nos modelos Liquid. Quase todos os incidentes pertencem a quatro sintomas operacionais nítidos: links mortos direcionados a recursos excluídos, links que apontam para páginas incorretas, cabeçalhos pai que abrem submenus sem navegar para nenhuma página ou alterações salvas no painel que não aparecem na loja ao vivo.

Cada um desses sintomas conta com uma solução prática que começa diretamente no painel da Shopify em Conteúdo > Menus, sem necessidade de recorrer precipitadamente a edições perigosas no código do tema. Este guia orienta você passo a passo a diagnosticar o problema em sua loja, consertar destinos quebrados com segurança e fazer com que os cabeçalhos com menus suspensos possam ser clicados no computador e no celular.

Resposta rápida: como corrigir links em um menu da Shopify

Para corrigir links em um menu de navegação da Shopify, acesse Conteúdo > Menus, localize o item desejado, clique no x ao lado do campo de link e escolha a coleção, página ou produto correto; em seguida, salve o menu (Shopify Help Center). Se um item pai com menu suspenso não puder ser clicado, isso geralmente decorre do design do tema: a maioria dos temas exibe cabeçalhos suspensos como botões e não como links (Shopify Help Center).

Siga estas cinco etapas para restaurar um link defeituoso:

1. Abra Conteúdo > Menus no painel administrativo da Shopify para visualizar suas listas de navegação (Shopify Help Center).
2. Abra o menu atribuído ao seu cabeçalho (como “Menu principal”) e encontre a linha problemática.
3. Clique no x ao lado do campo de link para desvincular o destino antigo e selecione a coleção, página ou produto adequado (Shopify Help Center).
4. Salve o menu clicando no botão de salvar na barra de ações superior ou inferior.
5. Teste o link em uma janela de navegação anônima no computador e no celular para conferir se a página é carregada sem falhas.

Se o item em questão for uma categoria principal com submenus que não abre nenhuma página ao ser clicada, esse comportamento é controlado pela estrutura do seu tema. Leia a seção a seguir explicando por que o item pai com menu suspenso não é clicável para selecionar o caminho mais adequado.

Identifique seu sintoma: quebrado, incorreto, não clicável ou não atualizado

Antes de alterar ajustes de navegação ou modificar arquivos de tema, você precisa identificar com exatidão o sintoma apresentado. As diferentes falhas visuais se originam em setores distintos da plataforma Shopify. Tratar um menu suspenso que não abre página como se fosse um link quebrado para um produto excluído só causará retrabalho desnecessário.

Consulte a tabela de diagnóstico abaixo para correlacionar o comportamento visual com a causa correspondente:

Ao inspecionar a loja, preste atenção à resposta visual. Um link quebrado exibe a tela de erro 404 padrão (“Página não encontrada”). Um destino equivocado exige apenas selecionar o recurso certo no selettore do painel. Por outro lado, um elemento configurado como botão de abertura suspensa opera de maneira totalmente diferente de um link de página normal, pois o navegador reserva o clique apenas para exibir ou ocultar os itens aninhados.

Corrigir um link quebrado ou incorreto em Conteúdo > Menus

Quando um item de menu conduz a uma página 404 ou abre uma categoria inadequada, a correção primordial ocorre nas configurações de navegação. No painel de administração da Shopify, você pode visualizar e alterar os menus da sua loja virtual em Conteúdo > Menus (Shopify Help Center).

Figura 1: Ilustração conceitual (Concept illustration) — Corrigir um link quebrado ou incorreto em Conteúdo > Menus

Para consertar o item com defeito, execute estas três etapas:

Remover o link antigo

Acesse Conteúdo > Menus e clique no título do menu que contém a linha com falha. Clique em Editar ao lado do respectivo item. Na janela de edição, você verá o campo Nome e o campo Link. Para alterar o destino do item de menu, clique no x ao lado do campo de link (Shopify Help Center). Em seguida, escolha o novo destino.

Escolher a coleção ou página

Com o campo de link vazio, clique dentro da caixa para abrir o seletor nativo da Shopify. A Shopify permite vincular produtos, coleções, páginas, artigos do blog e políticas. Como a Shopify salienta, na maioria dos casos, é preciso criar um item antes de poder vinculá-lo (Shopify Help Center). Se você planejou uma nova linha de produtos, certifique-se de que a coleção já esteja publicada no painel antes de tentar selecioná-la.

Sempre selecione o destino diretamente nessa lista em vez de digitar um endereço relativo manual (como /collections/camisas). Escolher na lista também evita erros de digitação no caminho.

[!NOTE] Se um item sumiu repentinamente da sua navegação sem que ninguém tenha mexido nele, verifique suas coleções e páginas. Se você excluir um recurso usado nos menus da sua loja, todos os itens de menu associados também serão excluídos automaticamente (Shopify Help Center).

Salvar o menu

Assim que o recurso correto constar no campo de link, clique em Aplicar alterações no modal e, em seguida, clique em Salvar menu na barra superior do painel. O destino corrigido agora está gravado no sistema.

Redirecionar URLs antigas após alterar um identificador

É frequente encontrar links quebrados após reestruturar coleções. Por exemplo, se você alterar o handle da URL de uma coleção de /collections/roupas-de-verao para /collections/estilo-verao, links ou favoritos antigos que usam o caminho anterior podem cair em uma página 404.

Ao alterar uma URL na sua loja da Shopify, você pode criar um redirecionamento de URL para evitar que clientes e buscadores encontrem páginas mortas (Shopify Help Center).

Ao configurar os redirecionamentos de endereços antigos, lembre-se de duas regras fundamentais:

Primeiro: você só pode redirecionar a partir de URLs quebradas (Shopify Help Center). Caso o endereço anterior tenha sido desativado permanentemente, a Shopify encaminhará os visitantes de forma transparente para a nova coleção.

Segundo: se a URL ainda carregar uma página válida, o redirecionamento de URL não funcionará (Shopify Help Center). Caso o caminho antigo continue vinculado a uma página ou produto ativo, a plataforma continuará exibindo aquele recurso em vez de acionar a regra de redirecionamento.

Após gerar o redirecionamento, volte a Conteúdo > Menus e atualize diretamente o destino no menu. Não dependa de redirecionamentos para o menu principal: eles são uma rede de segurança para links antigos, e o menu deve apontar direto para a URL ativa.

Por que o item pai com menu suspenso não é clicável

Uma das dúvidas mais comuns na Shopify acontece ao aninhar opções sob um item principal. O lojista cria um item de primeiro nível chamado “Loja” apontando para /collections/all e arrasta sob ele subcategorias como “Camisas” e “Calças”. Assim que salva, clicar em “Loja” na vitrine pública deixa de abrir o catálogo completo de produtos.

Figura 2: Ilustração conceitual (Concept illustration) — Por que o item pai com menu suspenso não é clicável

Geralmente isso é uma decisão de design do tema, não um defeito. De acordo com a documentação oficial da Shopify, a maioria dos temas implementa cabeçalhos de menu suspenso como botões e não como links clicáveis (Shopify Help Center).

Tecnicamente, muitos temas modernos da Shopify estruturam os blocos suspensos usando as tags HTML nativas <details> e <summary>. Segundo a documentação da MDN Web Docs, clicar no elemento <summary> alterna o estado de aberto ou fechado do elemento pai <details> (MDN Web Docs).

Como o navegador emprega a tag <summary> como alternador de exibição, a interação é restringida:

• Apenas abre o menu suspenso: O clique é totalmente consumido pelo navegador para abrir ou recolher os itens aninhados, impedindo a navegação para qualquer endereço de internet atrelado.

Quem gerencia lojas enfrenta essa barreira constantemente. Nos fóruns da Shopify Community, lojistas apontam que os links pai no cabeçalho não podem ser clicados após adicionar menus suspensos e sublinks. Outro comerciante relata o efeito prático: após transformar a navegação em menu suspenso, ela não leva mais à página de todos os produtos (Shopify Community).

Ao planejar hierarquias densas, conhecer a estrutura de menu multinível da Shopify ajuda você a dispor suas categorias com clareza sem complicar a navegação de quem compra pelo celular.

Tornar o link pai clicável: configuração do tema, alternativa de menu ou código

Se a sua loja exige que os clientes consigam tanto acessar a categoria principal quanto abrir os submenus correspondentes, há três caminhos possíveis, ordenados do mais seguro ao mais técnico:

Verificar o tipo de menu no cabeçalho

Antes de mexer no código, examine as opções no editor de temas. Algumas opções de tema trazem seletores nativos para definir a forma de apresentação dos menus suspensos.

Por exemplo, no tema Trade, discussões na comunidade evidenciaram que quando o tipo de menu está configurado como “mega menu”, ajustes no código para tornar os itens pai clicáveis não surtem efeito, ao passo que mudar a configuração para “menu suspenso” ativa o funcionamento esperado (Shopify Community). Acesse a seção Cabeçalho no editor do tema para verificar se formatos alternativos estão disponíveis nativamente.

Adicionar um sublink “Ver tudo”

Uma alternativa sem código consiste em reorganizar o primeiro item aninhado. Em vez de exigir que a linha principal atue ao mesmo tempo como botão e como hiperlink, você a define unicamente como uma pasta interativa.

Em Conteúdo > Menus, edite o item pai. Se você não quiser que o cabeçalho aponte para nada, insira # no campo de link (Shopify Help Center). Em seguida, crie um novo item aninhado no topo desse menu suspenso intitulado “Ver tudo” ou “Coleção completa”, apontando diretamente para a coleção pai.

Essa abordagem oferece três benefícios claros:

1. Não necessita de edições de código, eliminando o perigo de quebrar os arquivos do tema.
2. Mantém o item pai como menu suspenso e ainda oferece aos compradores um link para a coleção completa.
3. O comprador entende de pronto que o cabeçalho expande as opções e que o primeiro link abre a categoria inteira.

Editar o código do tema (faça backup antes)

Caso seja imprescindível que o rótulo principal abra a coleção ao ser clicado no computador, você pode alterar os modelos Liquid do tema (como header-dropdown-menu.liquid ou header.liquid).

[!WARNING] Antes de fazer qualquer alteração no código Liquid, considere a recomendação oficial da Shopify: é uma boa ideia fazer uma cópia de segurança do seu tema antes de personalizar o código (Shopify Help Center). Duplicar seu tema ativo oferece um ponto de retorno imediato caso a edição quebre a responsividade do site.

O princípio técnico consiste em envolver o texto da categoria pai em uma tag de âncora HTML <a> com atributo href ativo, em vez de deixá-lo como simples texto <summary>. Essa estrutura também é vital para a indexação nos mecanismos de busca. De acordo com o Google Search Central, geralmente o Google só consegue rastrear seu link se ele for um elemento HTML <a> (Google Search Central); veja nossas orientações sobre como garantir que o Google consiga rastrear seu menu para preservar o SEO.

Em telas de computador, essa solução costuma adotar um comando dividido:

• Link com seta: O texto da categoria opera como link de navegação para a coleção, enquanto o ícone de seta adjacente funciona como botão para abrir ou fechar o menu suspenso.

No entanto, tenha cautela. Relatos na comunidade sobre o tema Dawn 7.0.1 comprovam que edições manuais em Liquid que funcionam no computador podem falhar em celulares ou deixar de funcionar em outras versões do tema devido a alterações no DOM e nas classes CSS (Shopify Community).

Alterações no menu não aparecem na loja virtual

Outro problema habitual ocorre quando você edita pacientemente os itens no painel, salva com sucesso, mas a loja continua exibindo os links desatualizados.

Conferir qual menu está atribuído ao cabeçalho

Na maioria dos casos, o descompasso decorre de ter editado uma lista de menu diferente daquela em uso. Sua loja pode ter várias listas de menu em Conteúdo > Menus (como “Menu principal”, “Navegação 2026”, “Menu Mobile” ou “Rodapé”).

Para checar a configuração em tempo real:

1. No painel da Shopify, vá até Loja virtual > Temas.
2. Clique em Personalizar ao lado do seu tema ativo.
3. Na barra lateral esquerda, clique na seção Cabeçalho.
4. Examine a opção Menu no painel direito.

Se o cabeçalho estiver configurado para “Nova Navegação”, mas suas edições foram feitas em “Menu principal”, o site nunca refletirá as alterações. Atualize o ajuste do tema para apontar para a lista editada ou edite a lista que já se encontra conectada ao cabeçalho.

O truco comunitário de salvar o identificador novamente

Se o tema já aponta para a lista correta e os novos links ainda demoram a aparecer, pode haver uma retenção na memória cache da loja.

Na comunidade da Shopify, lojistas que enfrentavam atrasos persistentes na sincronização encontraram um contorno prático no painel: alterar e salvar o identificador (handle) do menu e, em seguida, salvá-lo novamente com seu identificador original (Shopify Community).

[!NOTE] Tenha em mente que essa técnica de salvar o identificador novamente é uma alternativa compartilhada por usuários e não um procedimento de suporte oficial da Shopify. Antes de alterar identificadores, faça sempre testes em uma janela de navegação anônima para garantir que o seu navegador não esteja apenas exibindo dados em cache.

O menu suspenso fecha cedo demais no computador

Um desconforto ergonômico ocorre quando um link está tecnicamente perfeito, mas os clientes não conseguem alcançar as subcategorias porque o painel suspenso se fecha rápido demais.

Quando o menu suspenso fecha precipitadamente, o usuário passa o mouse sobre a categoria principal, move o cursor para baixo para clicar em um item secundário e o menu desaparece antes que o clique seja concluído.

Análises detalhadas na comunidade revelaram que esse problema costuma ser causado por uma fresta desnecessária gerada pela borda entre o item de primeiro nível e o quadro do menu suspenso, quebrando a ponte de passagem do mouse (Shopify Community). Quando o ponteiro cruza esse espaço vazio, o estado de hover é perdido e o menu se fecha.

Efeitos semelhantes podem ser provocados por conflitos de CSS oriundos de blocos de aplicativos instalados recentemente. Para rastrear a causa sem criar regras CSS arriscadas, desative temporariamente os blocos de aplicativos no editor do tema ou contate o desenvolvedor do tema para ajustar as margens do cabeçalho.

Compensações: quando não editar o código do tema

Ao se deparar com um link pai que não clica, é tentador procurar um código Liquid em fóruns e inseri-lo de imediato no tema. Porém, intervenções manuais de código acarretam custos contínuos:

• Perda em atualizações de temas: Quando o criador do tema lança uma atualização de segurança ou desempenho, as mudanças feitas em header.liquid ou header-dropdown-menu.liquid não são migradas automaticamente. Você terá de refazer e testar as alterações a cada versão nova.
• Incompatibilidade de versões: A estrutura interna dos temas evolui rapidamente. Como se viu no tema Dawn 7.0.1, um trecho de código que funciona em uma versão pode se tornar inútil em outra devido a novas tags summary ou classes CSS (Shopify Community).
• Problemas em telas móveis: Scripts pensados para o mouse de computador costumam responder mal em telas de toque. Tocar na categoria principal pode acionar a navegação imediatamente antes que o comprador consiga ver as opções aninhadas.

Para muitas lojas, o sublink “Ver tudo” entrega uma navegação fluida sem código personalizado para manter. Se o seu catálogo exige estruturas mais robustas, avalie os limites dos menus dos temas para decidir se um aplicativo especializado atende melhor às suas necessidades.

Onde o Navi+ se encaixa

Se a sua loja requer uma organização de catálogo abrangente e você prefere não lidar com manutenção de código Liquid no tema, o Navi+ surge como uma alternativa versátil.

O Navi+ atua como uma solução completa de navegação, oferecendo menus móveis em gaveta (drawer), mega menus para computador e mobile, e uma barra de guias fixa para smartphone, comportando até três níveis de aninhamento. Em vez de alterar arquivos essenciais do tema, o Navi+ opera de maneira independente ao lado do seu design.

Cada elemento configurado no Navi+ traz opções individuais de link:

• Ao usar # em um item pai, o toque expande os submenus sem trocar de página (Documentação do Navi+).
• Nas lojas que necessitam de links diretos no item principal, os cabeçalhos de seção do Navi+ podem linkar para a página e abrir submenus ao mesmo tempo: tocar no texto abre a lista, enquanto tocar na seta leva diretamente à coleção (Changelog do Navi+).

Se o seu tema insiste em transformar itens pai em botões e você não quer assumir a manutenção de código no cabeçalho, você pode construir seu menu no Navi+ e definir para cada item se ele deve linkar, expandir ou executar ambas as funções.

Checklist pós-correção

Após consertar os links, revise esta lista de verificação para certificar-se de que sua navegação opera sem falhas em todos os canais:

• Abra uma janela anônima no computador e no celular para testar sua loja sem a interferência de dados em cache.
• Clique ou toque em cada elemento de nível 1, nível 2 e nível 3 para confirmar que a página de destino é carregada normalmente.
• Confira se não há erros 404 em coleções renomeadas e verifique se os redirecionamentos de URL estão ativos no painel (Shopify Help Center).
• No editor de temas, confirme se a seção Cabeçalho está conectada exatamente ao menu que você editou em Conteúdo > Menus.
• Verifique se uma cópia de segurança do tema foi feita antes de qualquer edição manual de código (Shopify Help Center).
• Inspecione seus menus sempre que excluir coleções, páginas ou produtos para repor os itens removidos automaticamente pela plataforma (Shopify Help Center).
• Teste a passagem do mouse no computador para garantir que os menus suspensos não se fechem de forma abrupta.
• Consulte nosso guia completo de menus da Shopify para preservar uma estrutura equilibrada e acessível conforme o catálogo crescer.

Perguntas frequentes

Por que não consigo clicar no meu item de menu principal que possui um menu suspenso?

A Shopify explica que a maioria dos temas implementa os cabeçalhos de menu suspenso como botões e não como links (Shopify Help Center). Você pode checar o tipo de menu nas opções do tema (Shopify Community) ou criar um sublink “Ver tudo” apontando para a coleção pai.

Por que um item de menu sumiu de repente da minha navegação?

Se você excluir um recurso (como uma coleção, página ou produto) vinculado aos seus menus, todos os itens de menu dependentes dele serão excluídos automaticamente (Shopify Help Center). Verifique se o recurso original foi excluído recentemente.

Por que meu link de menu dá erro 404 após eu renomear uma coleção?

Ao alterar o identificador ou endereço de uma página na loja, você pode criar um redirecionamento de URL para não perder acessos (Shopify Help Center). No entanto, redirecionamentos só funcionam para URLs quebradas, portanto você deve sempre atualizar o link em Conteúdo > Menus.

Por que meu menu de navegação não atualiza na minha loja virtual?

Verifique qual menu está selecionado na seção Cabeçalho dentro do editor de temas. Uma solução identificada na comunidade consiste em mudar e salvar o identificador do menu e depois salvá-lo novamente com o nome inicial (Shopify Community); realize sempre testes em janela anônima.

Quantos níveis um menu suspenso da Shopify pode ter?

O item de nível superior pode comportar até dois níveis de menus suspensos aninhados abaixo dele (Shopify Help Center), permitindo formar até três níveis de navegação no total.

É seguro editar o código do cabeçalho para corrigir esse problema?

A Shopify recomenda duplicar o tema para gerar uma cópia de segurança antes de personalizar o código (Shopify Help Center). Alterações manuais em Liquid podem gerar falhas visuais após atualizações do tema e em telas de toque de celulares.

Fontes

• Shopify Help Center: Editing Menus — Gerenciamento de destinos de menu e associação de recursos.
• Shopify Help Center: Drop-down Menus — Diretrizes para menus multinível e comportamento de botões pai.
• Shopify Help Center: URL Redirects — Regras e limites para o redirecionamento de URLs na loja.
• Shopify Help Center: Duplicating Themes — Práticas recomendadas de backup antes de alterar o código do tema.
• Google Search Central: Make Links Crawlable — Padrões em tags HTML de âncora para rastreamento por buscadores.
• MDN Web Docs: The Summary Element — Funcionamento técnico de abertura e fechamento em tags summary e details.
• Shopify Community: Why Isn’t My Navigation Menu Updating — Trocas de experiências sobre a sincronização de identificadores de menu.
• Shopify Community: Why Aren’t the Main Menu Links Working — Estudo sobre distâncias de bordas e fechamentos precoces no computador.
• Shopify Community: Dropdown Menu Clickable - Trade — Efeito do tipo de menu de cabeçalho no tema Trade.
• Shopify Community: Dawn Theme 7.0.1 Dropdown Menu Parent Link Not Clickable — Relatos de lojistas sobre cabeçalhos pai que não clicam.
• Shopify Community: How to Make My Shop Link in the Header Work Again — Repercussão de links desativados ao serem convertidos em menus suspensos.
• Navi+ Documentation: Menu Item Link Types — Tipos de links independentes e resposta ao toque em links sustenido.
• Navi+ Changelog: Latest Update — Capacidade de linkar e expandir simultaneamente nos cabeçalhos de seção.