Amostra de cores e tamanhos - Signashop
O Color Swatches (amostras de cores) é uma função muito indicada para quem possui loja de roupas ou calçados.
O módulo mostra aos clientes diferentes imagens do produto, baseando-se em atributos específicos, como cores, tamanhos, entre outros. Para habilitá-lo, atente-se aos passos:
01. No painel administrativo, acesse o menu sistema e clique em configuração.
02. Na aba catálogo, clique em Color Swatches Pro*.
Categorias gerais
01. Em categorias gerais, habilite a função.
02. Em usar zoom e lightbox, marque a palavra sim. Com o efeito zoom ativado, o cliente poderá examinar todos os detalhes do produto. Já a opção lightbox permite que ele visualize uma imagem maior de um item, sem precisar sair da página.
03. No campo esconder opções de drop-downs, marque a palavra não.
04. No campo atualizar imagens quando o primeiro atributo for selecionado, marque a palavra sim.
05. Em selecionar automaticamente atributos que tem valor único, marque a palavra sim. Isso quer dizer que se existir apenas uma variação do produto, este vem selecionado como padrão.
06. Salve as alterações.

Obs: todas as opções podem e dever ser configuradas de acordo com a preferência do lojista.
*Obs: color swatches disponível a partir do Essencial II.
Configurações da categoria Grid
01. Em exibir o Color Swatches na página de listagem dos produtos, marque a palavra sim.
Obs: consulte o suporte caso queira ativar essa opção.
02. Em largura e altura da miniatura da imagem, você pode inserir o número desejado.
03. Salve as alterações.
Configurações do tamanho da imagem
01. Configure o tamanho da miniatura da imagem e a largura/altura da imagem principal.
02. Salve as alterações.
Função de zoom para a imagem principal
01. Em ativar função de zoom, marque a palavra sim.
02. No campo tipo do zoom, escolha o efeito desejado (em círculo, quadrado, entre outros).
03. Em ação para trocar a imagem principal, selecione a opção ao clicar.
04. Salve as alterações.
Configurações da função zoom
01. Em pré-carregar imagens e usar zoom com o scroll do mouse, marque a palavra sim.
02. No campo tamanho da lente de zoom, insira o tamanho que o zoom deverá ter.
03. Salve as alterações.
Ativar função Carrossel para miniaturas
01. Em ativar função de Carrossel, marque a palavra sim.
02. No campo passar as miniaturas automaticamente, marque a palavra não.
03. Salve as alterações.

Pronto! O Color Swatches está configurado.
Alterando a exibição dos atributos
Caso deseje alterar a forma de exibição dos atributos, atente-se aos passos:
02. Clique no atributo de seu produto configurável.
03. Em atributo com imagem, no campo Swatches Size Settings, marque a opção usar imagens nas opções dos atributos em produtos configuráveis.
04. No mesmo campo, você pode determinar a largura e a altura das imagens.

05. Em atributo com imagem, clique em escolher arquivo e envie a imagem desejada para cada variação do atributo. Em nosso exemplo, utilizamos o atributo cor.

06. Salve as alterações.
Alterando a exibição do produto escolhido no carrinho de compras
Para que a imagem de um produto com atributos de cor (por exemplo) possa ser exibida corretamente (imagem do produto com a cor escolhida) no carrinho de compras, deve ser feita uma alteração simples:
02. Encontre a aba Vendas e selecione Fechar Pedidos.
03. Em Carrinho no campo Imagem do produto configurável, a opção "Miniatura do produto principal" vem como padrão:

04. Mude para a opção "Miniatura do produto".

Considerações gerais
• Após configurar a função, ela só funcionará com novos produtos cadastrados.
• Se o lojista quiser habilitar esta função para produtos já cadastrados, estes devem ser recadastrados.
• Todas as variações do produto devem ser cadastradas no campo imagens do cadastro básico.
• No momento do cadastro dos produtos associados, somente a imagem de um produto deverá ser configurada.
• Marque cada produto associado nas imagem do carrinho, listagem e detalhes.
É importante limpar o cache depois de alterar qualquer configuração em sua loja. Para isso, acesse sistema > gerenciar cache > marcar todos > atualizar > enviar.
• Aprenda a cadastrar um produto configurável.