Como adicionar amostras de variação à sua loja: um guia passo a passo (2022)

Publicados: 2022-10-20

Vender produtos com várias opções como tamanhos ou cores diferentes? Deseja adicionar amostras de variação à sua loja WooCommerce? Se sua resposta for sim, este artigo é apenas para você.

As amostras de variação permitem que você exiba opções de produtos, como tamanho ou cor, de maneira agradável para facilitar a seleção para os compradores. É um recurso obrigatório se você administra uma loja online que vende produtos com várias opções.

Isso aprimora a experiência de compra, levando a melhores conversões e mais vendas.

Embora o WooCommerce permita que você adicione variações de produtos prontas para uso, a versão padrão não é muito interessante no que diz respeito ao design.

A boa notícia é que adicionar amostras de variação de aparência atraente à sua loja online é bastante simples.

Neste artigo, começaremos entendendo o que são amostras de variação, os diferentes tipos de amostras de variação e explicaremos, passo a passo, como adicioná-las à sua loja.

Vamos começar!

Índice
  1. O que são amostras de variação?
  2. Tipos de amostras de variação
  3. 5 principais benefícios de adicionar amostras de variação à sua loja
  4. Como adicionar amostras de variação à sua loja
  5. Como você adiciona amostras de variação à sua loja?

O que são amostras de variação?

Amostras de variação são a maneira ideal de mostrar variações e atributos de produtos e torná-los interessantes.

Por atributos, queremos dizer coisas como as diferentes cores e tamanhos do produto. Tem outro recurso que gostaria de adicionar? Você pode incluir isso também.

Por exemplo, se você estiver vendendo camisetas, provavelmente desejará mostrar as diferentes opções de cores disponíveis.

Amostras de variação de cores

Você também pode querer mostrar as diferentes opções de tamanho disponíveis.

Normalmente, os lojistas vendem produtos com diferentes atributos e variações, o que pode ser um desafio para mostrar de forma eficaz.

E é aí que entram as amostras de variação.

Quando um usuário clica, digamos, na cor azul, ele vê como a camiseta fica na cor selecionada.

Amostras de variação simplificam a experiência de compra para seus clientes e fazem com que eles voltem para mais.

Mais importante, eles permitem que o cliente veja exatamente o que está comprando, em qualquer variação que esteja procurando. Isso é vital para a conversão.

Em suma, quando se trata de melhorar a experiência do usuário, as amostras de variação são o caminho a percorrer!

Por que adicionar amostras de variação?

Por que adicionar amostras de variação? Porque ver é acreditar.

Se um comprador puder ver o que está comprando e escolher visualmente, é muito mais provável que ele converta do que selecionando em um menu suspenso.

Quando se trata do sucesso de uma loja online, a experiência do usuário desempenha um papel significativo. Um dos principais benefícios das amostras de variação é que elas oferecem uma experiência de usuário aprimorada.

Fora da caixa, o WooCommerce nos permite adicionar variações de produtos. No entanto, você provavelmente concorda que a interface suspensa não é muito atraente.

Graças a temas como Astra e alguns plugins WordPress muito úteis, você pode transformar a lista suspensa de variações padrão em amostras clicáveis.

Os usuários podem simplesmente clicar no tipo de variação em vez de passar por uma lista suspensa.

Isso melhora a experiência de compra e pode aumentar as conversões.

Tipos de amostras de variação

Agora que sabemos o que é uma amostra de variação, vamos ver os diferentes tipos que você pode adicionar à sua loja WooCommemrce.

Amostras de variação de cor

Um produto pode ter várias opções de cores.

Por exemplo, digamos que você esteja vendendo um relógio disponível em várias cores.

Amostras de variação de cores para relógios

Permita que seus clientes escolham entre as variantes incorporando amostras de variação de cores.

Amostras de variação de imagem

Quer mostrar as variantes como uma imagem?

Algumas variantes de produtos são melhor mostradas como imagens para que o cliente possa ver exatamente o que está comprando.

Por exemplo, em nosso mesmo exemplo de relógios, você provavelmente gostaria de mostrar as diferentes variantes como imagens que, de outra forma, seriam desafiadoras com uma lista suspensa.

Amostras de variação de imagem

Nesses casos, use amostras de variação de imagem!

Amostras de variação de rótulo

Quer mostrar variantes de tamanho? Variantes como pequeno (S), médio (M) e grande (L)? Ou talvez até variantes de tamanho que são mostradas como números?

Isso funciona excepcionalmente bem se você estiver vendendo roupas e sapatos.

Amostras de variação de rótulo

Você pode tornar as variantes atraentes usando as amostras de variação de rótulo.

5 principais benefícios de adicionar amostras de variação à sua loja

Se você vende roupas, itens de decoração para casa ou gadgets, uma boa variedade é a chave para criar compras por impulso e incentivar compras repetidas.

Se os clientes não encontrarem o produto que estão procurando entre suas muitas ofertas, eles podem simplesmente ir embora de mãos vazias.

Aqui estão alguns benefícios de adicionar amostras de variação à sua loja online.

1. Seus clientes estão procurando uma variedade

Pode parecer um pequeno detalhe, mas adicionar um lookbook à sua loja é uma ótima maneira de dar aos clientes uma sensação de variedade.

Dependendo da variedade de produtos e do tipo de loja, você pode não oferecer uma grande variedade de opções.

Com amostras de variação, você pode expandir suas opções de produtos e dar a seus clientes um maior senso de escolha.

2. Melhore a experiência do usuário e as vendas

A incorporação de amostras no design da sua loja pode ajudar bastante a melhorar a experiência de compra dos clientes.

Especialmente se sua empresa oferece uma ampla variedade de produtos, oferecer uma seleção de amostras pode ajudar os compradores a visualizar rapidamente cores, tecidos e outros detalhes.

3. Ajuda os usuários a tomar decisões de compra informadas

Quando você coloca imagens, descrições e outros detalhes de produtos na vanguarda de sua loja, você incentiva os clientes a tomar decisões informadas.

No entanto, eles nem sempre podem confiar nesses detalhes para tomar suas decisões de compra.

Adicionar amostras de variação à sua loja WooCommerce pode ajudar a aumentar o apelo visual do seu produto.

Isso, por sua vez, pode ajudar a incentivar os clientes a dar uma segunda olhada em seus produtos e fazer uma compra por impulso.

As amostras de variação também podem ajudar a aumentar a taxa de conversão da sua loja. Quando os clientes veem os produtos em sua cor natural, é mais provável que os adicionem ao carrinho.

4. Maior envolvimento do cliente

Alguns clientes hesitam em comprar produtos online que nunca experimentaram pessoalmente.

Para ajudar a incentivar esses clientes, adicionar amostras de variação pode aumentar o apelo visual de seus produtos.

Se sua loja oferece vários estilos de um único produto, incluir amostras pode ajudar os clientes a visualizar as diferentes opções antes de fazer uma compra.

Além disso, as amostras podem ajudá-lo a atrair novos clientes para sua loja, mesmo aqueles que ainda não estão prontos para fazer uma compra.

Se um cliente estiver intrigado com a cor ou as diferentes variantes de seus produtos, as amostras podem levá-lo a navegar por toda a linha de produtos de sua loja.

Isso, por sua vez, pode ajudá-lo a construir uma base de clientes com maior probabilidade de se tornarem clientes recorrentes.

5. Melhore a experiência de compra

Adicionar amostras de variação à sua loja WooCommerce pode ajudar a aumentar o apelo visual das imagens de seus produtos.

Isso pode ajudar os clientes a visualizar seus produtos enquanto navegam em suas coleções.

As diferentes variantes e informações de produtos disponíveis de forma organizada certamente ajudam a impulsionar toda a experiência de compra.

Para resumir, as amostras de variação ajudam a melhorar a experiência do usuário, envolver seus clientes e aprimorar toda a experiência de compra.

Sem falar que ajuda a aumentar as vendas!

Como adicionar amostras de variação à sua loja

Vamos aprender como adicionar amostras de variação à sua loja online.

Faremos isso usando a opção padrão disponível no WooCommerce e, em seguida, usaremos um plug-in do WordPress.

Usando as configurações padrão do WooCommerce

Estamos assumindo que você instalou o WooCommerce em seu site WordPress.

Precisamos criar variantes para atributos, como tamanho e cor.

Para isso, vá até Produtos > Atributos .

Dê um nome ao seu atributo. Por exemplo, vamos criar o atributo size.

Criar um novo atributo

Quando terminar, clique em Adicionar atributo .

Você notará o atributo adicionado à lista. Atualmente, temos apenas um atributo, tamanho.

Lista de atributos

Clique em Configurar termos .

É aqui que você adiciona as diferentes variantes para cada atributo. Como estamos incluindo variantes para o atributo size, vamos adicionar as variantes como XS, S, M, L e XL.

Adicionar variantes

Certifique-se de clicar em Adicionar novo tamanho após inserir cada variante.

Depois de adicionar as diferentes variantes, você deverá ter a tela a seguir.

Lista de variantes de produtos

Você também pode seguir as mesmas etapas para adicionar variantes para a cor do atributo.

Vamos agora adicionar um novo produto. Navegue até Produtos > Adicionar novo .

Dê um nome ao seu produto e role para baixo até a seção onde você encontra Dados do produto .

Selecione o tipo de produto, que neste caso será Produto variável .

Selecione Produto variável nas opções fornecidas

Agora, clique na guia Atributos e adicione seus atributos.

Selecionar atributo

Criamos apenas um atributo até agora, então selecione Tamanho e clique em Adicionar .

Em valores, você encontrará todas as variantes criadas no atributo size.

Selecione individualmente as variantes do produto

Você pode selecioná-los individualmente ou simplesmente clicar em Selecionar tudo .

Selecionar todas as variantes do produto

Clique em Salvar atributos quando terminar.

Agora clique na guia Variações .

É aqui que você precisará adicionar imagens e descrições para as diferentes variantes que você possui.

Crie variações de todos os atributos

Selecione Criar variações de todos os atributos na lista suspensa e clique em Ir .

Você será avisado de que as variações foram adicionadas. No nosso caso, fomos informados de que cinco variações haviam sido criadas.

Variantes criadas

Agora a parte divertida!

Clique em cada variante e preencha os detalhes. Detalhes, como o preço, se o produto está em estoque, descrição, peso e outras informações do produto.

Insira os detalhes da variante

Embora isso possa demorar um pouco, é uma coisa única.

Siga as mesmas etapas para todas as variantes e, quando terminar, clique em Salvar alterações .

Certifique-se de adicionar a imagem e as descrições do produto e, quando estiver satisfeito com todos os detalhes, clique em Publicar .

Você notará que as variantes agora são mostradas na página do produto.

Variações de produto padrão

Todas as variantes de tamanho estão disponíveis na lista suspensa.

É tão simples adicionar variações à sua loja online!

No entanto, você provavelmente concordará que a lista suspensa não é muito atraente. É aqui que entram as amostras de variação.

Vá em frente e instale o plugin Variation Swatches for WooCommerce by CartFlows.

Se você usar o tema Astra e importar um de seus modelos iniciais para uma loja online, o plug-in Variation Swatches for WooCommerce by CartFlows vem instalado por padrão.

Depois de instalar e ativar o plug-in, vá para WooCommerce > Variation Swatches e clique na guia Configurações .

Ative todas as opções em Configurações gerais .

Configurações gerais para amostras de variação para WooCommerce por CartFlows

Depois de ativar as opções, você encontrará a adição de duas novas configurações, Estilo global e Estilo da página da loja .

Ative todas as configurações na guia geral

Brinque com as opções nas duas novas configurações. É como você personaliza a aparência da página da sua loja, principalmente as amostras de variação.

Atualize a página do seu produto e você notará amostras impressionantes de variação de rótulo substituindo a lista suspensa.

Amostras de variação de rótulo

Você pode até adicionar amostras de variação de cor e imagem.

Para isso, vamos adicionar o atributo color com as variantes vermelho, azul, amarelo e preto.

Assim como anteriormente, vá para Produtos > Atributos .

Embora o processo seja o mesmo, há uma nova inclusão.

Você percebe as Variações Amostras – Configurações enquanto você rola para baixo?

Selecione Cor nas configurações de amostras de variação

Como estamos adicionando o atributo color, vá em frente e selecione o tipo Color .

Você também pode selecionar uma forma de sua preferência no menu suspenso.

Clique em Adicionar atributo quando terminar.

Agora, vamos adicionar as diferentes variantes.

Clique em Configurar termos no atributo Cor .

Configurar termos para o atributo de cor

Ao adicionar suas novas variantes, certifique-se de selecionar a cor para cada uma.

Por exemplo, nomeamos nossa primeira variante de Red e selecionamos a cor de acordo.

Adicionar nova variante de cor

Clique em Adicionar nova cor quando terminar.

Repita este processo para as variantes restantes.

Você deve encontrar a tela a seguir quando terminar.

Lista de variantes de cores

Agora, vá em frente e edite a página do produto.

Na guia Atributo , desta vez, selecione o atributo Cor e clique em Adicionar .

Selecionar atributo de cor

O resto do processo é semelhante ao que abordamos anteriormente e é bastante simples.

Depois de concluir todas as variações, clique em Atualizar .

Verifique a página do seu produto para ver as novas amostras de variação.

Amostras de variação de cor

Deseja adicionar uma amostra de variação de imagem? Sem problemas!

Basta selecionar o tipo de amostra de variação de imagem, adicionar seu novo atributo e seguir o restante das etapas mencionadas acima.

Selecione as configurações de amostras de variação de imagem

A criação de amostras de variação para sua loja é simples? Com certeza achamos que sim!

Embora haja uma pequena curva de aprendizado, uma vez que você pega o jeito, é bem direto.

Como você adiciona amostras de variação à sua loja?

Criar uma experiência de compra aprimorada para os clientes é fundamental para o sucesso de qualquer loja online. Todas as pequenas coisas melhoram a experiência do usuário e criam uma experiência de compra perfeita.

O WooCommerce tem um menu suspenso padrão para mostrar as variações do produto, que mais do que fazem o trabalho. No entanto, a interface do usuário não é muito atraente e deixa você querendo mais.

Felizmente, você pode usar amostras de variação que podem ser facilmente integradas à sua loja online. E para não mencionar, melhora toda a experiência do usuário.

Vimos como é simples criar diferentes tipos de amostras de variação. Como você adiciona amostras de variação à sua loja? Nos informe!