Foto do produto alterada conforme variação selecionada

Topic summary

Problema inicial: Como fazer a imagem do produto mudar automaticamente ao selecionar uma variação (ex: ao escolher “cor preta”, mostrar a foto do produto nessa cor).

Solução fornecida:

  • Acessar a página do produto no admin da Shopify
  • Na seção de variantes, adicionar ou selecionar uma imagem específica para cada variante
  • Pode-se usar imagens já carregadas na seção “Mídia” ou fazer upload de novas
  • Um GIF tutorial foi compartilhado demonstrando o processo

Desenvolvimentos:

  • O usuário original confirmou que a solução resolveu sua dúvida
  • Nova pergunta surgiu sobre personalizar o botão de variante (ex: botão da cor preta ter fundo preto)
  • Outro usuário (WesleySilva1) reportou que seguiu o tutorial mas as imagens das variantes não aparecem

Status: Questão original resolvida, mas há problemas de implementação pendentes e uma pergunta adicional sobre customização visual dos botões de variante.

Summarized with AI on October 27. AI used: claude-sonnet-4-5-20250929.

Gostaria de saber como faço para que a imagem do produto (na página do produto) mude conforme a variação selecionada. Ex: gostaria que a ao selecionar a variante “cor preta” do produto, a imagem apareça automaticamente da peça na cor preta como selecionada.

Olá @bedereoficial !

Entendo que você tem variantes dos produtos e deseja que a foto seja alterada ao clicar na variante. Para configurar isso, basta acessar a página do produto no admin e adicionar uma imagem à variante. Siga as instruções abaixo:

  1. Vá em “Produtos” e “acesse a página do produto específico”.
  2. Desça a página para acessar a seção de variantes do produto.
  3. Verifique cada variante individualmente e adicione uma imagem que corresponde à cor associada a ela. Se já adicionou as imagens na seção “Mídia”, você conseguirá selecionar uma imagem existente, caso contrário, clique em “Adicionar imagem**”** para fazer upload de uma a partir de seu dispositivo.

19-51-gp6xe-xs3jw.gif

Caso a variante já tenha uma imagem, basta clicar na foto dessa variante para selecionar uma nova imagem.

Ao seguir essas instruções, você poderá adicionar imagens às variantes do produto, garantindo que cada imagem e sua cor seja exibida corretamente aos seus clientes. Consulte este documento que explica em detalhes sobre como adicionar imagens às variantes de produto no admin.

Se tiver qualquer dúvida, só enviar uma resposta e ficaremos felizes em continuar ajudando.

1 Like

Ola Paula, tudo bem? Obrigada, Sua explicação solucionou minha dúvida!

Paula, teria como eu acionar a cor no botão da variante do site? Vamos supor, o botão da cor preta do no site, tem o fundo preto

boa tarde Paula, realizei esse tutorial e mesmo assim nao aparece a imagem da variante