Crie amostras de cores de produtos com o elemento Variantes e Amostras

O que é uma amostra de cor do produto?

A amostra de cor do produto é um botão colorido clicável exibido na página do seu produto. Cada amostra representa uma opção de cor para o produto. Quando um comprador clica em uma amostra, a imagem e os detalhes do produto são atualizados instantaneamente para corresponder à cor selecionada.

Em vez de navegar por menus suspensos, as amostras de cores tornam mais rápido e fácil para os clientes:

• Visualizar variações do produto (por exemplo, camisetas vermelhas, azuis e pretas).
• Comparar opções disponíveis num ápice.
• Melhore a experiência de compra, o que pode aumentar as conversões.

Como configurar variantes de cores no Shopify

O GemPages exibe amostras de cores de produtos com base nas variantes que você já configurou no Shopify.

Passo 1: Faça login no seu Administrador do Shopify.

Passo 2: Acesse Produtos > Selecione um produto que você deseja editar.

Passo 3: Desloque-se até o Variantes seção.

Passo 4: Adicione ou edite suas opções de cores (por exemplo, vermelho, azul, verde).

Passo 5: Clique Economize.

Como adicionar amostras de cores de produtos no GemPages

Etapa 1: abra o editor

De você Painel GemPages, selecione seu modelo preferido (modelo de página de produto) e abra-o no editor.

Etapa 2: Insira o elemento Variantes e Amostras

• Na barra lateral esquerda, vá para Produto seção.
• Localize o Elemento Amostras de produtos.
• Arraste e solte o elemento dentro do seu Módulo de Produto na página.

Etapa 3: Configurar as configurações da variante

• Clique no elemento para abrir o painel de configurações na barra lateral esquerda.
• Debaixo Configurações de variantes, certifique-se de Formato está definido para Separe..

Isso garante que as variantes sejam exibidas em categorias distintas.

Etapa 4: Habilitar amostras de cores do produto

• Acesse Opção > Estilo nas configurações do elemento.
• Selecionar Amostra de cores.

• Clique Editar cor para abrir o Configurar Estilo de Variantes Painel. Aqui, você encontrará ferramentas para gerenciar e personalizar a aparência das suas amostras.

Etapa 5: Atribuir cores às variantes

• Clique em cada variante.
• Escolha uma cor da paleta or insira manualmente o código hexadecimal para cores precisas.
• Quando terminar, clique Aplicar para todos os produtos.

Isso garante que o valor de cor selecionado seja aplicado universalmente em todos os produtos com o mesmo nome de variante (por exemplo, “Vermelho” parecerá consistente em todos os produtos que tiverem a opção Vermelho).

Etapa 6: salvar e publicar

Depois de configurar as amostras de cores do seu produto, clique em Economize no canto superior direito.

Então clique Publicar para tornar as alterações ativas na sua loja.