Guia de configuração de imagens de variantes no Shopify
Configurar imagens de variantes no Shopify parece simples, mas tem pegadinhas. O admin permite vincular apenas uma imagem por variante. A galeria mostra tudo misturado. E se você não organizar as fotos corretamente, o cliente vê a variante errada primeiro.
Este guia cobre todo o processo: desde o upload das imagens até a configuração de filtragem por variante. Se você quer que o cliente veja apenas as fotos da cor selecionada, com amostras visuais no lugar de dropdowns, está no lugar certo.
Neste artigo
- Preparando as imagens
- Upload e organização no admin
- Vinculando imagens nativamente
- A limitação de uma imagem por variante
- Configuração com Rubik Variant Images
- Configurando amostras de cores
- Usando o Auto-Assign com IA
- Lista de verificação final
- Perguntas frequentes
- Leitura complementar
Preparando as imagens
Antes de subir qualquer foto, organize seus arquivos. Nomeie as imagens de forma consistente. Um padrão que funciona bem: nome-do-produto-cor-angulo. Por exemplo: camiseta-basica-azul-frente.jpg, camiseta-basica-azul-costas.jpg, camiseta-basica-azul-detalhe.jpg.
Essa organização não é obrigatória, mas ajuda em dois momentos. Primeiro, na hora de vincular as fotos às variantes no painel do app. Segundo, no alt text das imagens, que impacta o SEO.
Sobre dimensões: o Shopify recomenda imagens de 2048×2048 pixels. Use fundo branco ou cinza claro para fotos de produto. Mantenha o enquadramento consistente entre variantes para que a troca de cor na galeria pareça fluida.
Upload e organização no admin
No admin do Shopify, vá até o produto e suba todas as imagens na seção “Mídia”. A ordem das fotos importa: a primeira imagem será a foto principal do produto, que aparece nas listagens e no Google Shopping.
Organize as fotos na ordem que faz sentido para sua loja. Um formato comum é: foto principal de cada cor primeiro, depois as fotos secundárias. Assim, as fotos mais importantes ficam no topo da galeria.
Se o produto tem muitas variantes, suba as fotos em lotes. Primeiro todas as fotos da cor preta, depois da azul, depois da vermelha. Isso facilita a organização posterior.
Vinculando imagens nativamente
O Shopify permite vincular uma imagem a cada variante pelo admin. Na seção de variantes do produto, clique na variante e selecione a imagem principal. Quando o cliente escolher essa variante, o Shopify rola a galeria até essa foto.
Esse passo é importante mesmo que você use um app de imagens de variantes. A imagem nativa vinculada aparece no Google Shopping, nos apps de marketing e nos sistemas de gestão de pedidos. Configure-a como a foto principal de cada variante.
A limitação de uma imagem por variante
Aqui está o problema. O Shopify aceita apenas uma imagem por variante no campo nativo. Se a camiseta azul tem 4 fotos (frente, costas, detalhe, look), você vincula apenas uma. As outras 3 ficam na galeria geral, misturadas com fotos de outras variantes.
Para resolver isso, você precisa de um app que use metafields para mapear múltiplas imagens por variante. O app salva essa relação e filtra a galeria em tempo real na página do produto.
Configuração com Rubik Variant Images
Depois de instalar o Rubik Variant Images, siga estes passos:
1. Ative o App Embed. No editor de temas do Shopify, vá em “App embeds” e ative o Rubik Variant Images. Sem essa etapa, o app não aparece na loja.
2. Abra o produto no painel do app. Você verá a lista de variantes à esquerda e as imagens do produto disponíveis à direita. A interface é visual: arraste e solte.
3. Vincule as imagens. Arraste cada foto para a variante correspondente. Para a camiseta azul, arraste as 4 fotos da versão azul. Para a preta, as 4 fotos da versão preta. Imagens que devem aparecer em todas as variantes (como tabela de medidas) podem ser vinculadas a todas.
4. Defina a ordem. A primeira imagem de cada variante será a foto principal quando o cliente selecionar aquela opção. Arraste para reordenar conforme necessário.
5. Salve e teste. Acesse a página do produto na sua loja. Troque de variante e confirme que a galeria mostra apenas as fotos vinculadas.
Configurando amostras de cores
Além de filtrar a galeria, o Rubik Variant Images substitui os dropdowns padrão por swatches visuais. Na configuração do app, você define o tipo de swatch para cada opção do produto:
Cor sólida para opções de cor. Você escolhe o código hexadecimal para cada valor (exemplo: #1B3A5C para “Azul Marinho”).
Thumbnail do produto para opções onde a imagem fala mais que a cor (estampas, padrões, designs diferentes).
Botão pill para opções não visuais como tamanho (P, M, G) ou material (algodão, linho).
Saiba mais sobre como personalizar as amostras de cores no Shopify.
Usando o Auto-Assign com IA
Se você tem dezenas ou centenas de produtos, vincular imagens manualmente leva tempo. O recurso de Auto-Assign com IA do Rubik analisa cada imagem e identifica automaticamente a qual variante ela pertence.
O algoritmo funciona especialmente bem com variantes de cor. Ele reconhece o tom predominante na foto e vincula à variante correta. Você pode revisar as atribuições antes de salvar e ajustar o que for necessário.
Para lojas com catálogo grande, esse recurso economiza horas de trabalho manual.
Lista de verificação final
Depois de configurar, passe por esta lista para garantir que tudo funciona:
- O App Embed está ativado no editor de temas.
- Cada variante tem pelo menos 2 imagens vinculadas.
- A imagem nativa do Shopify está configurada (para Google Shopping).
- Os swatches aparecem no lugar dos dropdowns.
- A galeria filtra corretamente ao trocar de variante.
- As imagens compartilhadas aparecem em todas as variantes.
- O comportamento é consistente no desktop e no celular.
Se algo não está funcionando, veja nosso guia de solução de problemas com imagens de variantes.
Perguntas frequentes
Quantas imagens o Shopify aceita por produto?
O Shopify aceita até 250 imagens por produto. Para a maioria dos produtos com variantes, isso é mais que suficiente para cobrir todos os ângulos de todas as variantes.
Preciso vincular a imagem nativa do Shopify mesmo usando o Rubik?
Sim, é recomendado. A imagem nativa é usada pelo Google Shopping, apps de marketing e sistemas de gestão de pedidos. O Rubik usa metafields adicionais para a filtragem da galeria.
Qual o tamanho ideal das imagens?
O Shopify recomenda 2048×2048 pixels. Imagens quadradas funcionam melhor na maioria dos temas. O Shopify redimensiona automaticamente para diferentes dispositivos.
O Auto-Assign com IA funciona para todos os tipos de produto?
Funciona melhor para variantes de cor, onde o algoritmo identifica o tom predominante na imagem. Para variantes de tamanho ou material com a mesma aparência visual, a atribuição manual é mais indicada.
O app funciona com temas customizados?
Sim. O Rubik Variant Images é compatível com todos os temas Online Store 2.0 do Shopify, incluindo temas customizados e de terceiros.
Posso configurar em massa vários produtos de uma vez?
Sim. O Auto-Assign com IA permite processar múltiplos produtos de uma vez. Para configuração manual, cada produto precisa ser editado individualmente no painel do app.
E amostras de cores na página de coleção?
O Rubik Variant Images atua na página do produto. Para swatches nos cards da página de coleção, use o Rubik Combined Listings, um app separado.
Leitura complementar
