Como adicionar categorias de produtos WooCommerce ao menu
Publicados: 2020-12-08Deseja incluir categorias de produtos em seu menu? Você veio ao lugar certo. Neste post, mostraremos 2 métodos diferentes para adicionar categorias de produtos WooCommerce ao Menu .
Por que adicionar categorias de produtos ao menu?
Otimizar sua loja WooCommerce para conversões é fundamental para aumentar suas vendas e receita. Além de uma ótima página de checkout e um tema com aparência profissional, sua loja deve ser fácil de navegar. Isso geralmente é esquecido, mas é extremamente importante. Para fornecer aos usuários uma ótima experiência de compra, você precisa facilitar para eles encontrarem o que estão procurando.
Ter um menu claro e bem elaborado é fundamental para ajudar os usuários a navegar pelo seu site. Os menus possuem informações muito importantes e por isso costumam estar no topo dos sites. No entanto, manter seu cardápio limpo e organizado pode ser um desafio se você tiver muitos produtos, categorias e subcategorias. Mas nós temos uma solução para você.
Aqui, você aprenderá como adicionar categorias de produtos WooCommerce ao menu para melhorar a navegação do seu site. Por exemplo, digamos que um comprador queira comprar um celular Samsung em sua loja online. Não seria ótimo se eles pudessem ir para a seção de celulares Samsung diretamente do menu e encontrar facilmente o produto que estão procurando? Uma melhor navegação ajudará você a melhorar a experiência do cliente e aumentar suas taxas de conversão.
É por isso que adicionar categorias de produtos ao seu menu pode ser um divisor de águas para o seu negócio.
Como adicionar categorias de produtos WooCommerce ao menu
Neste guia, mostraremos como adicionar produtos WooCommerce ao menu de duas maneiras diferentes.
- Na seção de administração do WordPress
- Com um plug-in
Vamos dar uma olhada em cada método para que você possa escolher aquele que melhor se adapta à sua situação.
1) Do painel do WordPress
O método mais fácil e amigável para iniciantes para incluir categorias de produtos WooCommerce no menu. Não requer nenhuma ferramenta adicional e leva apenas alguns minutos. Primeiro, faça login no seu painel do WordPress e vá para Aparências > Menus .
Se você acabou de configurar as opções básicas, provavelmente não verá nenhum menu, então precisará criar um e atribuir a ele uma posição de menu. Vamos ver como fazer isso.
Criando um cardápio
Para criar um menu, você só precisa nomeá-lo, atribuir-lhe uma posição e clicar no botão Criar Menu . Para nossa demonstração, colocaremos nosso menu na posição de menu principal do tema. No painel esquerdo, você verá todos os elementos e blocos que pode adicionar ao seu menu.
- Páginas
- Postagens
- Categorias
- Pontos de extremidade do WooCommerce
- Produtos
- Categorias de Produtos
Não consegue ver a opção de produtos e categorias do WooCommerce? Não se preocupe. Eles estão ocultos, então você só precisa exibi-los. Vá para as configurações de opções de tela e marque as caixas de seleção correspondentes, conforme mostrado abaixo.
Em seguida, abra a seção de categorias do WooCommerce e verifique as categorias disponíveis que você tem em sua loja online. Na guia Visualizar tudo , você poderá ver todas as categorias disponíveis.
Você pode selecionar todas as categorias e adicioná-las ao seu menu ou incluir categorias específicas.
Adicionando categorias de produtos ao menu
Para esta demonstração, adicionaremos todas as categorias ao menu.
Depois disso, você pode personalizar os itens da seção Menus. Você pode alterar a posição do item, criar submenus, escolher onde exibi-los e muito mais.
Se você quiser personalizar ainda mais seu menu, confira a seção Opções de tela . Lá você verá as propriedades avançadas do menu que podem ser aplicadas aos seus itens de menu.
Quando estiver satisfeito com as alterações, pressione Salvar Menu . Depois disso, vamos verificar o front-end para ver o resultado. Como você pode ver na captura de tela abaixo, as categorias de produtos WooCommerce aparecem no menu.
Este método para adicionar categorias de produtos WooCommerce ao menu é simples, mas muito eficaz. Leva literalmente alguns minutos e pode ajudá-lo a melhorar muito sua navegação. E a melhor parte é que mesmo um iniciante pode fazer isso sem nenhuma ajuda adicional. Você também pode personalizar as cores do menu, fontes e assim por diante com um pouco de codificação. Por outro lado, se você quiser editar seu menu sem qualquer codificação, você pode querer dar uma olhada no próximo método.
2) Adicione categorias de produtos ao menu com QuadMenu
Nesta seção, mostraremos como incluir categorias de produtos no menu com o QuadMenu. QuadMenu é um excelente mega menu freemium que permite criar e gerenciar facilmente diferentes tipos de menus. Este plugin tem uma versão gratuita com recursos básicos que você pode baixar aqui e 3 planos premium com funcionalidades mais avançadas que começam em 15 USD (pagamento único).
Além disso, você pode integrar o QuadMenu com qualquer tema do WordPress, incluindo OceanWP, Avada, Divi, Astra, GeneratePress e muitos outros. Para esta demonstração, mostraremos como adicionar categorias de produtos WooCommerce ao menu usando o tema GeneratePress.
Instalação e ativação
Primeiro, instale e ative o QuadMenu em seu site. Para fazer isso, vá para a seção Plugins , procure por QuadMenu e clique em Instalar .
Em seguida, você precisa instalar o complemento QuadMenu GeneratePress. Se você estiver usando outro tema como Divi ou Avada, precisará instalar a extensão específica para sua loja WooCommerce. Você pode dar uma olhada em todas as extensões aqui.
Após ativar a extensão, você será redirecionado para as configurações do plugin. A partir daí, você poderá configurar o plug-in, o menu e as configurações principais. A versão gratuita do QuadMenu vem com recursos básicos que permitem adicionar facilmente categorias de produtos ao menu. Para fazer isso, vá para as configurações de tema padrão, onde você poderá ver todas as principais opções de configuração. Você pode escolher três opções de layout diferentes para o menu e escolher o alinhamento. Além disso, você pode criar menus fixos, sombras de menus móveis, alternância, título, ícone, botão e opções de tipografia e incluir animações. Por exemplo, vamos ver como alterar a família de fontes do seu menu.
Primeiro, vá para a seção Tipografia .
O QuadMenu vem com todas as fontes do Google por padrão, então escolha qualquer fonte que desejar no menu suspenso.
Em seguida, você também pode alterar o tamanho da fonte e o espaçamento entre as letras. Quando estiver satisfeito com as alterações, pressione Salvar . Além disso, você também pode adicionar animações. Basta ir à seção Animações e selecionar os efeitos que deseja aplicar ao texto, legenda, ícone e outros elementos.
Com alguns cliques do mouse, você poderá levar seu menu padrão do WordPress para outro nível. Agora, se você quiser levar as coisas ainda mais longe, precisará de funcionalidades mais avançadas. Para isso, você precisará da versão premium do QuadMenu.
Instalando e Ativando a Versão Premium do QuadMenu
Você pode comprar a versão premium do QuadMenu na loja oficial por apenas 15 USD. Depois disso, faça login na sua conta QuadLayers e baixe os arquivos do plugin. Além disso, obtenha as informações de licenciamento no painel da sua conta. Depois disso, instale o plugin em sua loja e ative-o.
Em seguida, vá para a seção Licença e verifique sua chave de licença.
QuadMenu está disponível em:
- Site da QuadLayers
- Envato
- Mercado elegante
Portanto, você deve escolher o mercado correspondente no menu suspenso. No nosso caso, vamos escolher QuadLayers. Em seguida, insira a chave de licença e o e-mail registrado e clique em Salvar alterações . A partir de agora, seu site receberá todas as atualizações do plugin e suporte do desenvolvedor oficial.
Agora, vamos seguir em frente e ver como personalizar seus menus do WordPress.
Ativando o QuadMenu
Primeiro, vá para Aparência > Menus como fizemos no método anterior e adicione as categorias de produtos ao seu menu. Antes de salvar o menu, marque a caixa de seleção QuadMenu Dev em Configurações do menu . Este é um passo importante, portanto, certifique-se de marcar a caixa de seleção correspondente.
Depois de salvar o menu, verifique os itens do menu. Ao passar o mouse sobre os itens, você verá um novo menu chamado QuadMenu , conforme mostrado abaixo.
Para editar um elemento, basta clicar na opção QuadMenu. É aqui que a mágica acontece. Você poderá adicionar um ícone personalizado, alterar o título do link, descrição, legenda e muito mais.
A guia Padrão tem configurações básicas que você configura na seção de menus, portanto, recomendamos que você se concentre nas guias Geral e Ícone . Na guia Geral, você verá opções para personalizar:
- Legenda
- Distintivo
- Flutuador
- Personalização do tamanho da tela
- Flutuante suspenso
Por exemplo, digamos que você queira definir ícones personalizados para suas categorias de produtos WooCommerce. Clique na opção correspondente e escolha o ícone que você gosta.
Quando você adiciona várias categorias aos menus da sua loja WooCommerce, os ícones são muito úteis. Com o QuadMenu, você pode exibir ícones personalizados em suas categorias do WooCommerce sem precisar adicioná-los manualmente. Basta selecionar os ícones que você gosta na lista e salvar as alterações.
Depois de escolher os ícones que você gosta, verifique o site no frontend e você verá os ícones no seu menu.
Mudando estilos
Agora, vamos um pouco mais longe e personalizar um pouco mais nosso menu usando as configurações do tema QuadMenu . A boa notícia é que você pode personalizar muitos elementos sem escrever uma única linha de código.
Por exemplo, vamos alterar as cores do menu. Você pode simplesmente selecionar as cores desejadas no painel e salvar as alterações. Para esta demonstração, modificamos a cor de fundo do nosso menu.
Então, no front-end, você verá que agora a cor de fundo é azul.
Se depois de salvar as alterações você não as vir no frontend, basta limpar o cache do WordPress e reaplicar as alterações. É assim que você pode usar o QuadMenu para editar seu menu WooCommerce.
Além de adicionar categorias de produtos e alterar as cores, você pode incluir efeitos de animação, alterar a tipografia, adicionar opções adesivas e muito mais. Portanto, se você deseja levar seus menus para o próximo nível, o QuadMenu é uma excelente opção.
Conclusão
A navegação no site é fundamental para ter uma loja online de sucesso. Os usuários precisam ser capazes de encontrar facilmente o que estão procurando. Considerando a importância dos menus, uma das melhores soluções para melhorar a navegação é adicionar categorias de produtos WooCommerce ao menu. Neste guia, vimos dois métodos simples para fazer isso.
- Do painel do WordPress
- Usando o QuadMenu
Incluir categorias de produtos no painel de administração do WordPress é muito fácil e leva apenas alguns minutos. Mesmo que você possa usar o personalizador do WordPress ou as configurações padrão do menu do WordPress para fazer alterações, as opções de personalização podem ser bastante básicas se você não tiver habilidades de codificação.
Por outro lado, QuadMenu é um plugin muito poderoso e fácil de usar para criar e gerenciar menus. Ele permite que você assuma o controle total do seu menu, adicione ícones de fonte personalizados, fontes do Google, altere as cores, o layout e muito mais. Além disso, com QuadMenu você pode criar facilmente mega menus que podem funcionar muito bem para lojas com muitos produtos. Portanto, se você deseja fazer muitas modificações e levar seus menus para o próximo nível, o QuadMenu é uma excelente escolha.
Você conhece alguma outra maneira de adicionar categorias de produtos ao menu? Você teve algum problema ao seguir o tutorial? Deixe-nos saber na seção de comentários abaixo!