Imagens em destaque

As imagens em destaque representam o produto na maioria das áreas do seu site, por isso, use a imagem que deseja que os clientes vejam primeiro. A imagem aparece em:

• Páginas da loja
• Blocos de Produto
• Blocos de Sumário
• Páginas de detalhes de produtos

Por padrão, a primeira imagem listada no editor do produto se torna sua imagem em destaque. Para definir uma imagem em destaque diferente, passe o cursor sobre a imagem e clique em Definir como miniatura. Ou clique em ••• para alterar a imagem em destaque.

Additional images

Imagens adicionais oferecem aos clientes uma visão mais completa dos seus produtos. Use imagens adicionais para mostrar imagens detalhadas, diferentes ângulos ou fotos encenadas do seu produto.

Essas imagens aparecem nas páginas de detalhes do produto. No editor do produto, todas as imagens após a primeira são imagens extras. Clique e arraste as imagens para alterar a ordem.

Imagens variantes

Nas páginas de detalhes do produto, as imagens das variantes são exibidas na galeria de imagens adicionais. As imagens das variantes mostram a aparência de cada variante do produto. Por exemplo, use imagens variantes para mostrar produtos em diferentes tamanhos e cores. Por padrão, a imagem em destaque é exibida até que o cliente selecione uma variante no menu suspenso.

Para adicionar ou alterar uma imagem de variante:

1. No editor do produto, role até a seção de variantes e clique em Editar tudo. Ou clique em uma variante no editor principal do produto e depois em Adicionar imagens para adicionar uma imagem da variante.
2. Clique no ícone Carregar imagem ao lado de uma variante.
3. Clique em + para carregar uma imagem, ou selecione uma imagem que já tenha sido carregada.
4. Clique em Aplicar.

Na versão 7.0, a exibição da imagem depende do tipo de página da loja do seu template.

Imagens em destaque

A imagem em destaque representa o produto na maioria das áreas do seu site, inclusive como a miniatura do produto na página da loja; por isso, use a imagem que você deseja que a maioria dos clientes veja primeiro. A imagem aparece:

• Nas Páginas da loja Clássicas ou Exclusivas.
• Como a primeira imagem na página de detalhes do produto.
• No painel da página da loja ou no painel Produtos.
• Em Blocos de produto e Blocos de sumário.

Para definir a imagem em destaque, passe o cursor sobre uma imagem no editor de produtos e clique em Definir como miniatura.

A primeira imagem no editor de produtos é a primeira imagem na página de detalhes do produto, mesmo que seja diferente da imagem em destaque.

Additional images

Imagens adicionais oferecem aos clientes uma visão mais completa dos seus produtos. Use imagens adicionais para mostrar detalhes, ângulos diferentes ou fotos encenadas do seu produto. Imagens adicionais aparecem:

• Nas páginas de detalhes do produto.
• Ao passar o cursor, a segunda imagem é exibida (somente em páginas da loja do plano Avançado).

Todas as imagens após a primeira são imagens extras. Clique e arraste as imagens para alterar a ordem.

Imagens variantes

Nas páginas de detalhes do produto, as imagens das variantes são exibidas na galeria de imagens adicionais para mostrar como cada variante do produto se apresenta. Por exemplo, use imagens de variantes para mostrar produtos em diferentes tamanhos e cores. Por padrão, a imagem em destaque do produto é exibida até que os clientes selecionem uma variante no menu suspenso.

Para alterar a imagem de uma variante:

1. No Editor de produtos, role até Inventário.
2. Em Variantes, clique em Editar tudo.
3. Clique no botão de carregamento ao lado da variante, selecione uma imagem ou carregue uma imagem.
4. Clique em Aplicar.
5. Clique em Voltar e clique em Salvar.

Personalize a forma como as imagens do produto aparecem usando estilos de seção e os ajustes de Item do produto no painel Estilos do site.

Estilize as seções de produtos

Para alterar a forma como as imagens de destaque do produto são exibidas nas seções da loja, mova o cursor sobre a seção e clique no ícone de lápis.

Você pode alterar o espaçamento, as colunas, a proporção da imagem e o alinhamento do texto. Você também pode mostrar ou ocultar o preço dos produtos. Para alterar as cores, clique em Cores.

Dica: se as imagens do seu produto parecerem recortadas, consulte as soluções para os problemas mais comuns de recorte..

Estilize as páginas de detalhes do produto

Para alterar a forma como o produto aparece na página de detalhes do produto:

1. Edite a página e clique em Editar design.
2. Abra estilos de seção e clique no menu suspenso de layout.
3. Selecione um layout.
4. Clique em Salvar para salvar as alterações e continuar editando; ou clique em Sair e depois em Salvar para fechar o editor.

Você pode editar o estilo de elementos como proporção da imagem aspect ratio, alinhamento do texto e design da galeria de produtos. Você também pode mudar o foco de uma imagem recortada após adicioná-la usando seu ponto focal.

Para obter um design consistente, essas mudanças de estilo se aplicam a todos os produtos da loja. Não é possível editar essas configurações para produtos específicos.

Use o painel Estilos do site para personalizar como as imagens do produto aparecem. Os layouts e opções de estilo disponíveis dependem do tipo de página da loja da sua família de templates.

Ajustes nas imagens dos produtos para páginas da loja do plano Clássico

Estes são os ajustes específicos da imagem para as Páginas da loja Clássicas:

• Páginas da loja: use os ajustes Tamanho de item de produto, Recorte automático de imagem do produto e Cor de fundo do produto para estilizar o modo como as imagens do produto são exibidas na página da loja.
• Páginas de itens: use os ajustes de Tamanho da Galeria de Produtos e Recorte automático da Galeria de Produtos para definir o tamanho da imagem e o recorte em páginas de detalhes.

Ajustes na imagem do produto para páginas do plano Avançado da loja

Estes são os ajustes específicos da imagem para Páginas da loja Avançadas:

• Páginas da loja: use o ajuste Proporção da imagem na seção Produtos: Layout para definir a forma das imagens na página da loja. As imagens são recortadas automaticamente para caber na forma.
• Páginas de itens: use os ajustes em Produtos: seção de galeria, como Design, Proporção da imagem, Alinhamento da miniatura e Largura da miniatura para estilizar imagens em páginas de detalhes.

Ajustes nas imagens dos produtos para páginas da loja exclusivas

Para saber como estilizar imagens de produtos nos templates abaixo, acesse os guias de templates:

• Galapagos
• Supply