Como permitir que os clientes escolham uma variante por item (amostras de variantes)

Em uma oferta de Descontos por quantidade, ative o Seletor de variantes para permitir que os clientes escolham um tamanho, uma cor ou outra opção para cada unidade. Por exemplo, uma oferta Compre 2 pode conter uma bolsa Pequena na cor Marfim e uma bolsa Grande na cor Blush. Escolha menus suspensos, amostras de cor, botões ou imagens de variantes para deixar essas opções claras.

Ative o seletor de variantes

Essa configuração fica no cartão Seletor de variantes da aba Complementos do editor de pacotes. Um botão de alternância no cabeçalho do cartão indica se ele está ativado ou desativado.

1. Abra o pacote que deseja editar, acesse a aba Complementos e localize o cartão Seletor de variantes.
2. Ative o botão de alternância no cabeçalho do cartão.

Para ofertas regulares de Descontos por quantidade e ofertas Compre X, leve Y, ativar essa configuração dá a cada unidade sua própria escolha. Quando desativada, uma oferta regular não fixada segue a variante selecionada no tema. Os cartões de Pacote de produtos e os produtos principais fixados em um conjunto de variantes ainda podem ter um seletor no cartão.

O que o botão de alternância controla

As ofertas regulares usam esse botão de alternância para o seletor por unidade do produto principal. Um cartão principal de Pacote de produtos mantém um seletor no cartão mesmo quando o botão de alternância está desativado, permitindo que os clientes escolham junto com os outros produtos obrigatórios. Produtos obrigatórios do pacote, brindes e extras opcionais também mantêm suas próprias escolhas quando aplicável. Um produto principal fixado também pode manter um seletor simples quando o botão de alternância está desativado, limitado às variantes fixadas.

Com o botão de alternância desativado, as linhas de Pacote de produtos usam menus suspensos simples. Quando ativado, os tipos de exibição configurados também estilizam as linhas de produtos obrigatórios do pacote. Os seletores de brindes e extras opcionais usam seus próprios controles. Um produto com apenas uma variante selecionável pode exibir sua identificação como texto, em vez de um menu suspenso desnecessário.

Defina o tipo de exibição de cada opção

Depois que o botão de alternância é ativado, o Bundlex carrega as opções de variantes encontradas nos produtos aos quais este pacote se aplica e as lista em uma tabela com três colunas: Opção, Tipo de exibição e Predefinição. Cada linha corresponde a uma opção, como Tamanho ou Cor.

Na coluna Tipo de exibição, escolha como essa opção aparecerá na página do produto:

• Menu suspenso - um menu de seleção padrão.
• Amostra de cor - pequenos círculos de cor. Permite atribuir uma cor a cada valor, conforme descrito abaixo.
• Pílula / Botão - pílulas ou botões clicáveis, opcionalmente com a imagem da variante.
• Imagem da variante - exibe cada valor usando a imagem do produto.

Você pode combinar tipos entre as opções, por exemplo, usar uma amostra de cor para Cor e um menu suspenso para Tamanho no mesmo produto. Clique no ícone de visualização, em formato de olho, ao lado do nome de uma opção para exibir no painel de prévia um produto que tenha essa opção.

Escolha uma predefinição compartilhada

A coluna Predefinição define o estilo visual de um tipo de exibição. As predefinições são compartilhadas por tipo: todas as opções que usam o mesmo tipo de exibição compartilham uma predefinição, portanto, alterar a predefinição de uma opção atualiza todas as outras opções desse tipo. Amostra de cor, Pílula / Botão e Imagem da variante têm seus próprios conjuntos de predefinições; o tipo de menu suspenso não tem predefinição.

Escolha Personalizado no menu de predefinições para abrir a seção Estilo da amostra, onde você pode ajustar o estilo além das predefinições integradas.

Atribua cores às amostras de cor

Quando uma opção usa o tipo de exibição Amostra de cor, cada um de seus valores recebe um campo de cor com um seletor de cores. Você pode:

• Definir cada cor manualmente usando o seletor ou digitando um valor hexadecimal.
• Clique em Detectar cores automaticamente para preencher as cores automaticamente com base nos nomes dos valores, como "Navy" ou "Forest green". A detecção automática preenche apenas os valores que ainda estão vazios e fica indisponível quando todas as cores já foram definidas.

Mostrar nomes das cores no desktop

Abra Estilo da amostra > Amostra de cor e ative Mostrar nome da cor ao passar o mouse para exibir uma dica com o nome da cor. Isso se aplica às amostras de cor, não a todos os tipos de exibição. Dispositivos com tela sensível ao toque não têm dica ao passar o mouse.

Mostrar a imagem da variante

Ative Mostrar imagem da variante, disponível depois que o seletor é ativado, para exibir a imagem da variante selecionada ao lado do seletor de variantes. Isso funciona com qualquer tipo de seletor, não apenas com o tipo de exibição de imagem da variante.

Ocultar o seletor de variantes do tema

Com o seletor ativado, você também tem a opção Ocultar seletor de variantes do tema. Ela oculta o seletor de variantes padrão do tema para que apenas o seletor do Bundlex fique visível. O seletor do tema é ocultado com CSS, em vez de ser removido, permitindo que a integração normal do tema continue sincronizando a imagem principal do produto. Teste esse comportamento no seu tema.

Se a imagem principal do produto não for atualizada quando uma variante for selecionada, talvez seja necessário ajustar o seletor do bloco Variantes nas configurações de incorporação do app Bundlex para que corresponda ao seu tema. Entre em contato com o suporte se precisar de ajuda.

Recolher listas longas por unidade

Recolher seletores de variantes reúne as escolhas de cada unidade em uma linha que pode ser aberta individualmente. Isso pode manter uma oferta maior de Descontos por quantidade compacta. Não se aplica a ofertas de Pacote de produtos.

Teste as escolhas, o estoque e os preços

Salve e ative o desconto e, em seguida, teste um produto elegível na vitrine. Esta demonstração usa a Lituânia com USD. Neste exemplo, a bolsa Pequena na cor Marfim custa $24 e a bolsa Grande na cor Blush custa $30. Uma oferta Compre 2 com 10% de desconto totaliza $48.60. Adicione usando o botão real Adicionar ao carrinho e confirme as duas cores, os dois tamanhos e o total no carrinho e no checkout.

Uma combinação esgotada pode continuar visível e selecionável enquanto Ocultar variantes indisponíveis estiver desativado. Escolher Blush / Pequena nesta demonstração exibe uma mensagem de indisponibilidade e bloqueia o botão Adicionar ao carrinho. Escolher o tamanho Grande disponível restaura o botão. Uma combinação que não existe é diferente: o seletor pode mover as opções posteriores para uma combinação válida, portanto, verifique o tamanho final depois de alterar uma cor.

Para remover valores esgotados dos seletores compatíveis, abra Avançado > Ofertas e estoque > Ocultar variantes indisponíveis. A disponibilidade segue a política de estoque da Shopify; uma variante com estoque zero que permite continuar vendendo ainda pode estar disponível. Consulte disponibilidade das opções de variantes para conhecer o escopo e os detalhes de fallback.

Quando não há nada para escolher

Quando o conjunto selecionável inteiro tem exatamente uma variante, um menu suspenso é reduzido ao nome da variante no cartão. Botões ou amostras de cores configurados podem continuar visíveis como um selo de seleção. Produtos com apenas a variante padrão da Shopify não precisam de um seletor.

É por isso que um seletor que você esperava pode não aparecer. Normalmente, isso significa uma das seguintes situações:

• O produto realmente tem uma única variante.
• Você fixou o item em uma única variante.
• Ocultar variantes indisponíveis está ativado e resta apenas uma variante em estoque.

Reabastecer uma variante ou ampliar a seleção fixada faz o seletor voltar automaticamente. A oferta principal e os cartões de produtos obrigatórios do pacote seguem esse comportamento, passando do seletor para a identidade. Brindes, upsells e complementos têm seus próprios filtros de disponibilidade. Uma única opção disponível pode não exibir um nome de variante separado.

Recarregar opções após editar variantes

Se você adicionar, renomear ou remover variantes dos seus produtos depois de configurar isso, clique em Recarregar opções no topo da tabela de opções de variantes para carregar as opções mais recentes. O Bundlex confirma com a mensagem "Variantes atualizadas" quando algo mudou ou "Recarregado, sem alterações" quando o conjunto de opções já está atualizado. Salve todas as alterações resultantes antes de verificar a vitrine. Novas cores visíveis no editor não são publicadas até serem salvas.

Se nenhuma opção aparecer

A tabela de opções de variantes precisa dos dados de opções dos produtos para a segmentação do pacote e dos produtos obrigatórios do pacote. Se as opções ainda estiverem carregando, aguarde a conclusão desse processo antes de considerar uma tabela vazia um problema de configuração. Se aparecer uma solicitação para selecionar produtos ou coleções, configure isso primeiro na seção Exibir widget em. Se, em vez disso, aparecer "Nenhuma opção de variante encontrada para os produtos selecionados", os produtos selecionados não têm opções de variantes para configurar.