Como personalizar páginas de categoria de produto no WooCommerce

Publicados: 2022-03-21

Quer saber como personalizar páginas de categorias de produtos no WooCommerce?

As páginas de categorias são essenciais para qualquer loja WooCommerce porque ajudam os clientes em potencial a pesquisar produtos antes de comprar. No entanto, se suas páginas de categoria de produto forem imprecisas, elas podem fazer com que os compradores saiam do seu site, perdendo leads e receita.

Este artigo mostrará como personalizar e exibir páginas de categorias de produtos WooCommerce para melhorar a experiência do usuário e as vendas.

Por que personalizar as páginas de categoria de produtos WooCommerce?

Existem vários motivos para personalizar suas páginas de categoria WooCommerce:

  • Aumente as vendas: cerca de 70% das vendas vêm de páginas de categorias, o que significa que elas contribuem diretamente para o sucesso do seu negócio. A criação de páginas de categorias personalizadas adaptadas às necessidades dos compradores pode levar a altas taxas de conversão.
  • Melhore o SEO: otimizar as páginas de categoria pode ajudar a aumentar seus rankings nos resultados de pesquisa. Como muitas lojas online têm conteúdo mínimo nas páginas de categorias, é uma oportunidade ideal para otimizar categorias e subcategorias de produtos para palavras-chave que seu público está procurando.
  • Agarre a atenção: os mecanismos de pesquisa geralmente levam os usuários às páginas de categorias de produtos mais do que às páginas da loja, porque se concentram em resultados específicos. Você pode personalizar essas páginas com conteúdo gerado pelo usuário, melhores imagens de produtos e avaliações para chamar a atenção e convencer os compradores a fazer o check-out.

No final, personalizar as páginas de categorias de produtos no WooCommerce pode ajudá-lo a atender melhor os compradores, melhorar as classificações dos mecanismos de pesquisa e aumentar suas vendas.

Antes de mostrarmos como personalizar suas páginas de categoria, vamos ver como adicioná-las à sua loja WooCommerce.

Como adicionar categorias de produtos no WooCommerce

Adicionar páginas de categorias de produtos no WooCommerce é bastante simples. Vá para Produtos »Categorias no painel do WordPress e você verá vários campos de entrada.

How to add product categories in woocommerce

Você pode adicionar quantas categorias quiser, mas lembre-se de inserir as seguintes informações para facilitar a exibição dos dados da categoria nas páginas do produto:

  • Nome
  • lesma de categoria
  • Categoria Parental
  • Descrição
  • Tipo de exibição
  • Miniatura

Depois de adicionar categorias à sua loja online, você está pronto para criar e personalizar suas páginas de categorias.

Primeiro, mostraremos como criar uma página de categoria de produto personalizada no WooCommerce usando o SeedProd. Depois, compartilharemos várias maneiras de exibir categorias de produtos no WooCommerce.

Índice
  1. Como adicionar categorias de produtos no WooCommerce
  2. Como personalizar a página de categoria de produto no WooCommerce
  3. Como exibir a categoria do produto no WooCommerce

Como personalizar a página de categoria de produto no WooCommerce

Embora o WooCommerce inclua muitas maneiras de exibir categorias de produtos, não é fácil personalizá-los sem ferramentas de terceiros e plugins do WordPress. Além disso, muitas dessas ferramentas são difíceis de usar e adicionam inchaço ao seu site, o que pode deixá-lo mais lento.

É por isso que sempre sugerimos usar o SeedProd para personalizar sua loja WooCommerce.

SeedProd WordPress website builder

SeedProd é o melhor construtor de sites para WordPress. Com mais de 1 milhão de instalações ativas, é a maneira mais fácil de criar temas, layouts e páginas de destino personalizados do WordPress sem código.

Também é rápido, leve e suporta totalmente o WooCommerce, permitindo que você crie lojas online inteiras com seu construtor fácil de arrastar e soltar.

Siga as etapas abaixo para criar páginas de categorias personalizadas com o SeedProd.

Etapa 1. Instale e ative o SeedProd Website Builder

O primeiro passo é baixar o construtor de sites SeedProd.

Comece hoje mesmo com o SeedProd

Nota: Existe uma versão gratuita do SeedProd disponível, mas usaremos o SeedProd Pro para os recursos do WooCommerce.

Em seguida, instale e ative o arquivo .zip do plugin em seu site WordPress. Se precisar de ajuda com esta etapa, siga estas instruções sobre como instalar um plug-in do WordPress.

Depois de instalar e ativar o SeedProd, vá para SeedProd » Configurações e cole sua chave de licença.

enter your license key

Você pode encontrar sua chave de licença fazendo login no site da SeedProd e copiando-a na guia Downloads.

copy your seedprod license key

Clique no botão Verificar chave ; então você está pronto para configurar suas páginas de categorias personalizadas do WooCommerce.

Etapa 2. Crie um tema WooCommerce

O SeedProd permite que você crie páginas personalizadas do WooCommerce de 2 maneiras:

  • Theme Builder – O Theme Builder substitui seu tema atual e permite que você personalize cada parte do seu site com seu editor visual.
  • Landing Page Builder – O Landing Page Builder permite que você mantenha seu tema atual e crie landing pages individuais que você pode personalizar com o editor de arrastar e soltar.

Usaremos a opção Theme Builder para fazer todas as páginas automaticamente para uma loja WooCommerce.

Para configurar seu tema WooCommerce, vá para SeedProd » Theme Builder .

Normalmente, você verá uma lista dos modelos que compõem seu tema nesta página. Por enquanto, você verá apenas o modelo Global CSS.

SeedProd theme builder

O melhor do SeedProd é que ele vem com mais de 150 páginas de destino responsivas para dispositivos móveis e modelos de temas. Dessa forma, você não precisará começar do zero com o design do seu site WooCommerce.

Clique no botão Temas para ver uma lista dos modelos de tema WordPress atuais do SeedProd. Mais modelos são adicionados regularmente a esta lista, muitos dos quais são adaptados para lojas online.

wordpres theme templates seedprod

Por exemplo, o tema Bicycle Shop seria adequado para lojas que vendem bicicletas e acessórios para ciclismo.

Para escolher um tema, passe o mouse sobre ele e clique no ícone de marca de seleção.

Choose a premade woocommerce theme

Depois de importar seu tema, o SeedProd fará todas as partes da demonstração do tema. No nosso caso, inclui os seguintes modelos de tema:

  • Arquivos de produtos: um arquivo completo de todos os produtos.
  • Página do produto: um espaço para exibir detalhes sobre produtos individuais.
  • Página de loja: uma página de vitrine personalizável.
  • Página única: uma página individual para conteúdo, como sobre ou informações de contato.
  • Índice do Blog, Arquivos, Pesquisa: uma página para mostrar suas postagens de blog, resultados de pesquisa e arquivos de postagem.
  • Página inicial: a primeira página do seu site.
  • Barra lateral: uma área pronta para widget que você pode personalizar.
  • Rodapé: um local para links personalizados, conteúdo e informações de direitos autorais.
  • Cabeçalho: um espaço para seu logotipo e menus de navegação.
seedprod theme parts

Observação: muitas vezes nos referimos a partes individuais de um tema como “modelos”.

Clicar em cada modelo de tema o abrirá no editor de arrastar e soltar do SeedProd, onde você pode personalizar o conteúdo e o design.

Um modelo de tema crítico para este tutorial é o Product Archive. Quando os usuários clicarem em uma categoria em sua loja, eles verão o Arquivo de produtos dessa categoria de produtos.

É esse modelo que você precisará abrir para personalizar suas páginas de categoria de produtos WooCommerce. Passe o mouse sobre o modelo e clique no link Editar design para abri-lo no editor visual.

edit woocommerce product archives template

Etapa 3. Personalize seu modelo de página de categoria de produto

Ao abrir os modelos de arquivos do produto, você verá um layout de 2 colunas. À esquerda estão blocos e seções que você pode adicionar à sua página. Em seguida, há uma visualização ao vivo do seu design à direita.

SeedProd product archives template

Já deve haver 2 blocos na sua página:

  1. Título do arquivo
  2. Arquivar produtos

O título do arquivo é um dos blocos de tags de modelo do SeedProd. Ele puxa automaticamente o título do arquivo do seu banco de dados WordPress.

SeedProd archive title block

Por exemplo, se você clicar na categoria “bicicleta preta” em sua loja, a página que você verá terá o título: “Categoria: Bicicletas pretas”. O título mudará automaticamente dependendo de qual categoria você clicar.

Da mesma forma, o bloco Archive Products é uma das tags de modelo WooCommerce da SeedProd. Este bloco exibirá uma grade de produtos nessa categoria específica.

SeedProd archive products block

Para usar nosso exemplo anterior, se você clicar na categoria “bicicleta preta”, verá uma grade de produtos que mostra apenas bicicletas pretas.

Personalizar ambos os blocos é fácil. Basta clicar em qualquer um dos blocos e ajustar o estilo no painel de configurações à esquerda.

Por exemplo, você pode alterar o tamanho, o alinhamento e o nível do título do título do arquivo. Em seguida, na guia Avançado, você pode ajustar as fontes, cores, espaçamento, sombras e muito mais.

Archive title advanced settings

No painel de configurações de produtos de arquivamento, você pode alterar as colunas, paginação, consulta, contagens de itens e muito mais. Você também pode alterar o estilo na guia Avançado.

Além disso, é super fácil alterar todo o layout da página da categoria do produto com qualquer um dos blocos e seções do SeedProd.

Por exemplo, você pode arrastar sobre o bloco de imagem e adicionar uma imagem de banner atraente. Em seguida, você pode vinculá-lo a uma venda ou promoção que está em execução no momento.

SeedProd image block

Você também pode adicionar depoimentos de clientes anteriores para convencer os compradores de que seus produtos são a melhor escolha.

Neste exemplo, arrastamos o título do arquivo e os blocos de produtos para uma seção ampla e estreita de 2 colunas. Em seguida, usamos o bloco Testemunhos na coluna menor.

Seedprod testimonials on custom product category page woocommerce

As possibilidades são praticamente infinitas.

Quando estiver satisfeito com sua página de categoria, lembre-se de clicar no botão Salvar no canto superior direito. Então você pode ir em frente e personalizar o resto do seu tema WooCommerce da mesma maneira.

Etapa 4. Publique seu tema WooCommerce

Quando estiver pronto para dar vida ao seu novo design, vá para a página SeedProd » Theme Builder . Em seguida, no canto superior direito, clique no botão Ativar SeedProd Theme até que esteja na posição “on”.

Enable seedprod theme

Agora você pode visualizar qualquer página de categoria de produto para ver suas personalizações.

how to customize product category page in woocommerce

Como exibir a categoria do produto no WooCommerce

Agora que você sabe como personalizar as páginas de categorias de produtos no WooCommerce, veja como exibi-las na página da sua loja.

Exibir categorias de produtos na página da loja com o SeedProd

Se você deseja mostrar categorias de produtos na página da sua loja WooCommerce com o SeedProd, vá para SeedProd » Theme Builder e abra o modelo da página da loja.

Edit seedprod shop page template

A partir daí, abra as configurações do bloco Product Grid e altere o Query Type para Custom Query. Sob o título Query Attribute, clique em “Select by Category”. Em seguida, na caixa de categoria, clique nas categorias que deseja mostrar na página.

Display woocommerce product categories on the shop page

Nota: Você pode selecionar várias categorias mantendo pressionado o comando no mac ou ctrl no windows.

Clique em Salvar para armazenar suas alterações.

Exibir categorias de produtos na página da loja com WooCommerce

Para mostrar categorias de produtos na página da sua loja com as configurações padrão do WooCommerce, vá para Aparência » Personalizar » WooCommerce » Catálogo de produtos.

Em seguida, sob o título “Exibição da página da loja”, escolha a opção “mostrar categorias”.

Show categories on the shop page with product catalog

É isso!

Esperamos que este artigo tenha ajudado você a aprender como personalizar páginas de categorias de produtos no WooCommerce.

Você também pode gostar deste guia sobre como acelerar sua loja WooCommerce.

Obrigado por ler. Siga-nos no YouTube, Twitter e Facebook para obter mais conteúdo útil para expandir seus negócios.