Nota: Embora nossos guias mais populares tenham sido traduzidos para o português, alguns guias estão disponíveis apenas em inglês.
Recursos especiais da Página de Produtos

Cada template aceita Páginas de Produtos e cada família tem suas próprias opções de estilo e layout. Algumas Páginas de Produtos de determinados templates oferecem recursos adicionais:

  • Aproximação na imagem de produtos - clientes podem ampliar imagens de produtos para ver de perto o material, a textura e os detalhes. Você pode definir que a aproximação seja ativada ao pairar o cursor ou ao clicar na imagem.
  • Visualização rápida de produtos - clientes podem clicar em um botão para visualizar detalhes de itens em uma lightbox, sem sair da página atual. A Visualização rápida incentiva os clientes a interagir com sua loja e a acessar mais produtos,.
  • Efeitos de pairar - exiba informações ou crie movimentações ao pairar o cursor sobre uma imagem de produto, oferecendo animações e mais interação na sua loja.
Dica: para mais ajuda com seu template, acesse o guia de templates.

Supported templates

Aproximação na imagem, Visualização rápida e efeitos de pairar avançados estão disponíveis nos templates abaixo, agrupados por família:

  • Família Brine - Aria, Basil, Blend, Brine, Burke, Cacao, Clay, Ethan, Fairfield, Feed, Foster, Greenwich, Hatch, Heights, Hunter, Hyde, Impact, Jaunt, Juke, Keene, Kin, Maple, Margot, Marta, Mentor, Mercer, Miller, Mojave, Moksha, Motto, Nueva, Pedro, Polaris, Pursuit, Rally, Rover, Royce, Sofia, Sonny, Sonora, Stella, Thorne, Vow, Wav, West
  • Família Farro - Farro, Haute
  • Galapagos
  • Família Skye - Foundry, Indigo, Ready, Skye, Tudor
  • Família Tremont - Camino, Carson, Henson, Tremont
  • Família York - Artesia, Flores, Harris, Jasper, Jones, Lange, Shibori, York

Todos os outros templates aceitam efeitos de pairar clássicos.

Aproximação na imagem

A Aproximação na imagem do produto está disponível em:

image-zoom.gif

Ativar o zoom da imagem

A maneira de habilitar a aproximação na imagem depende da versão do Squarespace usada pelo site.

  1. Em uma página de item de produto, acesse o Menu Inicial, clique em Design e clique em Estilos do Site.
  2. Role para a seção Produtos: Aproximação na imagem. (No Galapagos, role até a seção Item de produto.)
  3. Marque Ativar Aproximação na imagem.
  4. Para definir o nível de ampliação, defina o controle deslizante do Fator de aproximação entre 1 e 5. (No Galapagos, é o Fator de aproximação na imagem.)
  5. Para definir se a aproximação na imagem acontece assim que o cursor passar sobre ele, selecione a opção Ativar zoom ao: e escolha Clicar ou Mover o cursor (no Galapagos, o zoom sempre é ativado ao mover o cursor).
  1. No Menu Inicial, clique em Design e, em seguida, em Itens de produtos.
  2. Clique no menu suspenso Ação ao mover o cursor e selecione Zoom.
  3. Defina o fator do zoom da imagem.

Mais ajuda com a Aproximação na imagem

  • O recurso de Aproximação na imagem do produto não está disponível em dispositivos móveis.
  • Para obter melhores resultados, formate sua imagem para exibição na web antes de fazer o upload.
  • A Aproximação na imagem exibe uma versão maior da imagem; tecnicamente, ela não faz aproximação em um arquivo de imagem.
  • Imagens com fundos transparentes (.png) exibirão a imagem original por trás da versão ampliada.

Visualização rápida

O botão Visualização rápida pode ser exibido em:

  • Páginas de produtos
  • Blocos de Sumário e Blocos de Produto conectados a uma Página de Produtos

O botão é exibido ao pairar sobre o produto. A lightbox de Visualização rápida inclui detalhes e imagens do produto, e um link para Exibir item completo que leva à página do item.

Product_Block_with_Quick_View.png

Adicione botões de Visualização rápida

Você pode ativar a Visualização rápida em cada Página de Produtos e em cada bloco. Se você tiver diversas Páginas de Produtos ou blocos, adicione os botões em cada uma delas.

Para adicionar a Visualização rápida em uma Página de Produtos:

  1. Abra as configurações de página da página em questão.
  2. Clique na aba Avançado e marque Ativar Visualização rápida.
  3. Caso tenha várias Páginas de Produtos, repita esses passos para cada uma.

Para adicionar a Visualização rápida em um Bloco de Produto:

  1. No editor do Bloco de Produto, escolha um produto a ser exibido.
  2. Marque Ativar Visualização rápida.
  3. Click Apply to save your changes.
  4. Salve as alterações à página. 

Para adicionar a Visualização rápida a um Bloco de Sumário:

  1. No editor do Bloco de Sumário, acesse a aba Conteúdo e verifique se uma Página de Produtos está selecionada
  2. Clique na aba Exibir.
  3. Marque Ativar Visualização rápida.
  4. Clique em Aplicar para salvar as alterações. O botão de Visualização rápida será exibido sobre todas as imagens em miniatura de produtos no bloco.
  5. Salve as alterações à página.

Estilize o botão e a lightbox

Depois de ativar a Visualização rápida, novas seções aparecerão no Painel de Estilos do Site. As configurações de estilo são aplicadas em todo o site para criar uma estética consistente.

  1. No Menu Inicial, clique em Design e depois em Estilos do Site.
  2. Na seção Produtos: Botão de Visualização Rápida, personalize estilo, cor, fonte, preenchimento, posição e tamanho do botão Visualização rápida. Por exemplo, use o ajuste de Posição para mover o botão para o meio ou para a parte inferior da imagem.
  3. Na seção Produtos: Visualização Rápida da Lightbox, personalize a aparência da lightbox. Ajustes importantes de estilo:
  • Selecionar Exibição de Trecho: Truncar para exibir a descrição do produto.
  • A Cor de sobreposição adiciona um filtro de cor à Página de Produtos por trás da lightbox.
  • Usar os ajustes de Controles para ajustar os botões de navegação e de fechar que aparecem fora da lightbox.
  • Para alterar a fonte do título da Visualização rápida, selecionar Fonte de títulos na seção Produtos: Detalhes do painel Estilos do Site.
Dica: se o texto de Visualização rápida estiver com problemas de formatação, tente adicionar os detalhes do produto como texto simples.

Mais ajuda com a Visualização rápida

  • A Visualização rápida não está disponível em dispositivos móveis.
  • Não é possível personalizar o texto do botão de "Visualização rápida" neste momento.
  • As imagens de produtos são exibidas como quadrados recortados na Visualização rápida.
  • As descrições de produtos aparecem na Visualização rápida sem formatação especial, incluindo estilos de cabeçalhos, negrito, itálico ou listas com marcadores.

Efeitos hover

Os efeitos de pairar disponíveis em suas Páginas de Produtos dependem do template do seu site.

Páginas de Produtos Clássicas

Você pode exibir nomes de produtos e preços por cima de uma sobreposição de cor ao pairar o cursor em templates que aceitam a Página de Produtos Clássica. Para saber mais, acesse Como estilizar a Página de Produtos Clássica.

Páginas de Produtos Avançadas

Templates compatíveis com a Página de Produtos Avançadas oferecem opções avançadas de pairar:

  • Imagem alternativamostre um recurso especial ou detalhe importante para cada produto. 
  • Desvanecer - crie um efeito de desvanecer.
  • Sobreposição de produtos - mostre informações do produto.

Para saber mais, acesse Como estilizar a Página de Produtos Avançada.

Observação: atualmente, a versão 7.1 tem sempre uma imagem alternativa ativada.

Páginas de Produtos Exclusivas

Dois templates oferecem opções exclusivas de pairar:

Esse artigo foi útil?
Usuários que acharam isso útil: 12 de 31
Recursos especiais da Página de Produtos