Como adicionar categorias de produtos WooCommerce ao menu

Publicados: 2020-12-08

Deseja 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.

  1. Na seção de administração do WordPress
  2. 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 .

menu wordpress 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 . adicione categorias de produtos WooCommerce ao menu - crie um novo 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

adicionar categorias de produtos WooCommerce ao menu - adicionar ao menu 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.

adicionar categorias de produtos WooCommerce ao menu - opções de tela 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.

adicione categorias de produtos WooCommerce ao menu - todas as categorias woocommerce 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.

adicione categorias de produtos WooCommerce ao menu - adicione todas as categorias 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.

adicionar categorias de produtos WooCommerce ao menu - menu principal 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.

Adicionar categorias de produtos WooCommerce ao menu - Propriedades avançadas do menu Quando estiver satisfeito com as alterações, pressione Salvar Menu . salve nosso cardápio 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.

Adicionar categorias de produtos WooCommerce ao menu - Categorias 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 .

instalar plugin wordpress quadmenu 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.

instalar o plugin do addon generatepress 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. configurações do plug-in da versão gratuita do quadmenu 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 .

tipografia quadmenu O QuadMenu vem com todas as fontes do Google por padrão, então escolha qualquer fonte que desejar no menu suspenso.

fontes de quadmenu 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.

animações de quadmenu 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. compra premium quadmenu Além disso, obtenha as informações de licenciamento no painel da sua conta. licenças premium quadmenu Depois disso, instale o plugin em sua loja e ative-o.

instalar quadmenu premium Em seguida, vá para a seção Licença e verifique sua chave de licença.

Opção de licenciamento Quadmenu 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.

menu de desenvolvimento quadmenu 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.

configurações do quadmenu 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.

edição de menu iphone 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

Adicionar categorias de produtos WooCommerce ao menu - configurações gerais do QuadMenu 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.

ícones de quadmenu

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.

adicionar ícone de menu

Depois de escolher os ícones que você gosta, verifique o site no frontend e você verá os ícones no seu menu.

quad-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. configurações de menu padrão

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.

cor do menu bg

Então, no front-end, você verá que agora a cor de fundo é azul. Adicione categorias de produtos WooCommerce ao menu - nova cor bg

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.

  1. Do painel do WordPress
  2. 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!