Fora da caixa, WooCommerce mostra variações de produtos como menus suspensos simples Escolha um tamanho, escolha uma cor, tudo em uma caixa de seleção cinza que esconde como realmente são as opções. A WooCommerce variação swatches plugin corrige isso Ele troca esses dropdowns por círculos de cores clicáveis, miniaturas de imagens e botões rotulados, para que um comprador veja a camisa vermelha ou o XL rapidamente, em vez de decodificar um menu de texto.
Essa pequena mudança move a agulha, porque as pessoas compram o que podem ver Este guia compara 8 dos melhores plugins de amostras, e cada um é livre para instalar a partir do diretório oficial do WordPress.org, para que você possa experimentá-los em sua própria loja antes de cometer Primeiro, porém, um plugin que pertence a cada loja Elementor antes mesmo de pensar em amostras: Master Addons for Elementor. Não é um plugin de amostras, mas constrói a página do produto em que suas amostras viverão, então ele ganha o primeiro lugar.
O que são amostras de variação do WooCommerce?
As amostras de variação substituem as reduções de atributos num produto variável por selectores visuais Em vez de uma descida de “Color”, obtém-se uma linha de quadrados de cores Em vez de uma descida de “Size”, obtém-se botões clicáveis: S, M, L, XL.
Você geralmente verá quatro tipos de amostras:
- Amostras de cores para atributos como vermelho, marinho ou verde-oliva
- Amostras de imagem que mostram uma pequena foto de cada variação, seja um padrão, uma textura ou o produto dessa cor
- Botão ou amostras de etiquetas para tamanhos, materiais ou qualquer atributo de texto
- Suportes de rádio para uma versão mais arrumada do padrão selecione
Os melhores plug-ins também colocam amostras nas páginas da loja e da categoria, e não apenas na página única do produto, para que os compradores identifiquem suas opções enquanto ainda navegam.
Como adicionar amostras de cores no WooCommerce
A configuração é quase idêntica em todos os plug-ins aqui:
- Instale e ative o WooCommerce e o plugin de amostras escolhido.
- Ir para Produtos > Atributos e crie um atributo como Cor e adicione seus termos (Vermelho, Azul, Verde).
- Defina o tipo de amostra de cada termo. Para cores, escolha o valor hexadecimal; para imagem, carregue uma miniatura.
- Abra um produto variável, adicione o atributo na guia Atributos e gere variações.
- Salvar e visualizar O dropdown agora é uma linha de amostras.
Nenhum código em qualquer lugar dessa lista Se seus produtos variáveis ainda não estão configurados, classifique isso primeiro com o oficial Documentação do produto variável WooCommerce, que percorre atributos e variações Para o design da página em torno das amostras, nosso resumo do melhores complementos Elementor para WooCommerce mostra como construir um modelo de produto único personalizado.
Comparação rápida: Melhores plug-ins WooCommerce Swatches
| Plug-in | Active Instala | Classificação | Comprar amostras de páginas (gratuitas) | Melhor Para |
|---|---|---|---|---|
| Complementos Mestres para Elementor | 30.000+ | 4,5 • | n/a (kit de ferramentas) | Construindo a própria página do produto |
| Swatches de variação para WooCommerce (Emran Ahmed) | 300.000+ | 4,8 • | Pro | A escolha padrão segura |
| Swatches de variação para WooCommerce (CartFlows) | 200.000+ | 4,6 • | Pro | Astra /lojas CartFlows |
| Swatches de variação WCBoost | 50.000+ | 4,8 • | Sim | Opção rápida e sem problemas |
| Variações de produtos Swatches (VillaTheme) | 10.000+ | 4,7 • | Sim | Swatches + troca de imagens de galeria |
| Amostras de variação (RadiusTheme) | 10.000+ | 4,7 • | Sim | Completo com amostras de catálogo |
| Swatches de variação WPC | 7.000+ | 4.3 • | Sim | Usuários do ecossistema WPClever |
| Variações inteligentes Imagens & Swatches | 1.000+ | 4,7 • | Parcial | Troca de imagens de variação |
| Swatches de variação para WooCommerce (Woosuite) | 50.000+ | 3,7 • | Sim | Faixas de catálogo gratuitas de longa duração |
1. Master Addons para Elementor (a base)
Deixe-me ser franco: Complementos Mestres para Elementor não é um plugin de swatches de variação, e ainda fica no número um Aqui está a lógica Os swatches só ganham a sua manutenção em uma página de produto que é realmente construído para vender, e essa página é onde Master Addons entra É o kit de ferramentas leve Elementor que projeta o modelo, então qualquer plugin de swatch abaixo deixa cair seus seletores de cor e imagem nele.
Usado em 30.000 + sites e reconstruído para funcionar cerca de 3 x mais rápido na versão 3, Master Addons dá-lhe um completo Construtor Tema para modelos personalizados de produto único, loja e arquivo Então, em vez de aceitar qualquer layout que seu tema envie, você projeta a página do produto, adiciona as amostras e controla exatamente onde elas pousam.
Por que ele vai primeiro para uma loja Elementor:
- Construtor Tema para construir o único produto e modelos de loja em que suas amostras são exibidas
- Widget de produto em destaque para soltar qualquer produto, preço e botão de adição ao carrinho em uma página de destino
- Construtor Popup para venda, ofertas de cupons e intenção de saída que elevam o valor do carrinho
- Menu Mega para navegação em compras com categorias de produtos
- mais de 80 widgets e extensões em um pacote leve, você não está empilhando cinco plug-ins para construir uma página
Instale isso primeiro para construir a loja, em seguida, escolha um dos plugins de amostras abaixo para lidar com a exibição de variação Navegue por completo widgets e extensões liste ou verifique o preços, e pegue a versão gratuita do Página do plugin WordPress.org.
2. Variation Swatches para WooCommerce (por Emran Ahmed)
Este é o plugin de swatches mais instalado no WordPress.org, com mais de 300.000 instalações ativas e uma classificação de 4,8 em mais de 900 avaliações. Quer a opção em que a maioria das lojas já confia? Comece aqui.
Melhores características:
- Cor, imagem e tipos de botão/etiqueta swatch
- Atribua dicas de ferramentas ao pairar
- Substituições de amostra por atributo e por produto
- Controle sobre como as variações fora de estoque se comportam, clicáveis ou desfocadas
- Ampla compatibilidade de temas, por isso funciona na maioria dos temas do WooCommerce sem confusão
A versão gratuita lida bem com a página única do produto As amostras de catálogo e página de loja, além de galerias de imagens de variação, fazem parte da atualização Pro. Pegue-o no Página do plugin WordPress.org.
3. amostras de variação para WooCommerce (por CartFlows)
Este vem da equipe por trás do Astra e CartFlows, e ele pegou 200.000+ instalações em uma classificação de 4,6 É leve, limpo, e uma chamada fácil se você já executar outros produtos Brainstorm Force.
Melhores características:
- Cor, imagem, botão/etiqueta, e tipos de amostras de rádio
- Dicas de ferramentas para atributos
- Estilo global com substituições por atributo
- Código leve que fica fora do caminho do seu tema
- Apoiado por um conhecido fornecedor de WordPress
Se sua loja funciona no Astra ou você constrói funis com CartFlows, isso mantém tudo em uma casa Instale-o a partir do Página do plugin WordPress.org.
4. amostras de variação WCBoost
WCBoost é a escolha sem sentido, e ele faz algo que os dois plugins maiores fazem você pagar: ele mostra amostras em páginas de loja e arquivo na versão gratuita Adicione uma classificação de 4,8 e 50.000+ instala e ele ganha seu lugar.
Melhores características:
- Cor, imagem, botão e amostras de rádio
- Dicas de ferramentas sobre o hover de atributos
- Forma e tamanho ajustáveis da amostra (arredondado ou quadrado)
- Loja e exibição de página de arquivo, livre
- Nenhum aumento constante de vendas no administrador
Para um plugin rápido e limpo que lhe entrega amostras de catálogo sem acesso pago, o WCBoost é uma das escolhas de melhor valor nesta lista. Baixe-o do Página do plugin WordPress.org.
5. variações de produto Swatches para WooCommerce (por VillaTheme)
O VillaTheme está no espaço WooCommerce há muito tempo, e seu plugin de amostras emparelha seletores visuais com troca de imagens de variação Clique em uma cor e a galeria principal muda para as fotos dessa variação.
Melhores características:
- Cor, imagem, botão, rádio, e tipos da amostra da gota-a-baixo
- Dicas de ferramentas para cada atributo
- Catálogo e amostras de páginas de loja
- Troca de imagens de variação na galeria de produtos
- Controles de estilo por atributo
Se você vender coisas onde as fotos da galeria importam tanto quanto a amostra (moda, móveis, impressões artísticas), essa troca de imagens é o motivo para escolhê-la. Obtenha isso do Página do plugin WordPress.org.
6. Variation Swatches para WooCommerce (por RadiusTheme)
De RadiusTheme, o pessoal por trás de The Post Grid e ShopBuilder, este é um polivalente constante com 10.000 + instala e uma classificação de 4,7 Ele cobre os tipos de swatch núcleo e empurra-los para fora para páginas de catálogo também.
Melhores características:
- Cor, imagem, botão e amostras de rádio
- Dicas de ferramentas de atributos
- Comprar e arquivar amostras de páginas
- Configurações por atributo e por produto
- Apoiado por um fornecedor ativo de plugins WooCommerce
É uma escolha confiável de meio-termo, e essas configurações por produto ganham seu sustento quando um punhado de produtos precisa de amostras com estilos diferentes dos demais. Instale-o a partir do Página do plugin WordPress.org.
7. WPC Variation Swatches para WooCommerce
WPClever executa uma grande família de plugins WooCommerce, e este plugin swatches direito nele Se você já usa produtos WPC como Smart Compare ou Linked Variation, ele vai se sentir como em casa.
Melhores características:
- Cor, imagem, botão e tipos de amostra de rótulo
- Suporte tooltip
- Atribuição de swatch no nível do termo
- Pequena pegada
- Funciona com a suíte WPClever mais ampla
A classificação é um pouco menor e a contagem de comentários é fina, então teste-a no estadiamento antes de enviá-la. Para usuários do WPClever, porém, é o ajuste óbvio. Baixe-o do Página do plugin WordPress.org.
8. imagens e amostras de variações inteligentes para WooCommerce
Este se inclina fortemente para imagens Ele automaticamente mostra, esconde e troca fotos de produto-galeria com base na variação que um comprador escolhe, o que é ideal quando a diferença visual entre as variações é todo o tom.
Melhores características:
- Amostras de imagens vinculadas a fotos de variação
- Exibição automática de galeria, ocultação e troca por variação
- Imagem inteligente vinculando a atributos
- Joga bem ao lado de outro plugin de amostra se você já executar um
- 142 avaliações com uma classificação de 4,7, grande engajamento para seu tamanho
É menos sobre o estilo do botão e mais sobre a galeria reagir ao clique Se a troca de imagens é sua prioridade, este é o especialista Obtenha-o do Página do plugin WordPress.org.
9. Variation Swatches para WooCommerce (por Woosuite)
Este é um dos plug-ins de amostras mais antigos do repositório, listado em 2017, e ainda funciona em mais de 50.000 lojas. O sorteio são amostras gratuitas de páginas de catálogo e um conjunto completo de tipos de amostras sem parede de vendas.
Melhores características:
- Cor, imagem, rótulo/texto e amostras de rádio
- Dicas de ferramentas para atributos
- Arquivar e catalogar amostras de páginas na versão gratuita
- Configuração por atributo
- Um longo histórico nas lojas WooCommerce
Uma ressalva honesta: sua classificação de 3,7 é a mais fraca aqui, então deslize as avaliações recentes e teste-as em relação ao seu tema antes de se apoiar nele Instale-o a partir do Página do plugin WordPress.org.
Também vale a pena dar uma olhada
Mais alguns estão no WordPress.org e podem se adequar a uma configuração específica, mesmo que não tenham quebrado a lista principal. Variações de cores e rótulos YITH oferece amostras de cores e rótulos gratuitamente e retém amostras de imagens para Pro. Swatches de variação QODE é uma opção mais nova e mais leve que ainda está acumulando avaliações.
Como escolher o plug-in de amostras certas
Combine o plugin com o que sua loja realmente precisa:
- Você quer a opção mais segura e testada: Swatches de variação para WooCommerce por Emran Ahmed.
- Você quer amostras de páginas de loja sem pagar: WCBoost ou o plugin Woosuite.
- As imagens da sua galeria mudam muito entre as variações: VillaTheme ou Variações Inteligentes Imagens.
- Você vive no ecossistema Astra/CartFlows ou WPClever: escolha o plugin correspondente (CartFlows ou WPC).
O que quer que você pousar, fique de olho no desempenho Os scripts Swatch adicionam peso às suas páginas de produtos, então combine-os com as dicas em nosso guia como acelerar os sites da ElementorE se seus produtos precisam de mais do que amostras, pense em campos personalizados, complementos ou gravura, observe opções extras de produtos para WooCommerce para capturar aqueles na finalização da compra.
Construir a loja em torno dessas faixas? Master Addons permanece leve mais de 80 widgets e extensões, e é Construtor Tema permite que você projete o modelo de produto único em que suas amostras se sentam Verifique o preços se você quiser o kit de ferramentas inteiro.
Perguntas frequentes
Qual é o melhor plugin gratuito de amostras de variação WooCommerce?
Variation Swatches for WooCommerce de Emran Ahmed é a escolha gratuita mais segura, com mais de 300.000 instalações e uma classificação de 4,8. Se você precisar de amostras de páginas de loja gratuitamente, WCBoost Variation Swatches é uma alternativa forte que não bloqueia amostras de catálogo atrás do Pro.
Como adiciono amostras de cores no WooCommerce?
Instale um plugin de amostras, vá para Produtos > Atributos, crie um atributo Cor e defina um valor hexadecimal para cada termo Em seguida, adicione o atributo a um produto variável e gere variações A queda se transforma em uma linha de amostras de cores clicáveis, sem necessidade de código.
Posso adicionar amostras de variação sem um plugin?
Não facilmente. WooCommerce não tem opção de swatch integrada, então você precisaria de código personalizado e CSS para converter os dropdowns sozinho. Um plugin de swatches dedicado faz isso com alguns cliques e permanece compatível por meio de atualizações do WooCommerce, e é por isso que quase todas as lojas usam um.
As amostras de variação aparecem nas páginas da loja e das categorias?
Depende do plugin Muitos mostram amostras apenas na página de um único produto em sua versão gratuita WCBoost, VillaTheme, RadiusTheme e o plugin Woosuite os exibem nas páginas da loja e do arquivo gratuitamente, enquanto outros salvam isso para Pro.
Um plugin de amostras atrasará minha loja?
Um bem construído adiciona apenas um pouco de CSS e JavaScript Opções leves como WCBoost mantêm o impacto baixo Não execute dois plugins de amostra de uma só vez, e verifique a velocidade da sua página antes e depois de instalar para que você saiba onde está.
Embrulhar
O melhor plugin de amostras de variação WooCommerce para sua loja realmente se resume a duas perguntas: você precisa de amostras de páginas de loja gratuitamente e quanto as imagens de sua galeria mudam entre as variações? Para a maioria das lojas, Variation Swatches for WooCommerce de Emran Ahmed é o começo seguro, WCBoost é a melhor rota gratuita para catalogar amostras e VillaTheme ou Smart Variations Images vencem quando as fotos são vendidas.
Instale algumas versões gratuitas, teste-as em relação ao seu tema e mantenha a que parece certa. Em seguida, construa a loja ao seu redor: explore ao máximo Widgets e extensões Master Addons ou comece mais rápido com pronto kits modelo.
Leitura relacionada: Melhores complementos de elementador para WooCommerce, Opções extras de produto para WooCommerce, e 100 melhores complementos de elementadores.
