Obs.: embora os nossos guias mais acessados tenham sido traduzidos para o português, outros guias estão disponíveis apenas em inglês.

Recursos especiais da Página de Produtos

Todos os sites do Squarespace são compatíveis com Páginas de Produtos (chamadas de Páginas de Loja na versão 7.1), onde você pode exibir e vender produtos. Alguns sites têm recursos extras, como Visualização Rápida, Zoom de Imagem e efeitos de pairar, que são exibidos quando os compradores passam o cursor sobre as imagens do produto. Este guia explica esses recursos e onde eles estão disponíveis.

Recursos por versão

Os recursos disponíveis dependem da versão do Squarespace em que seu site se encontra.

Na versão 7.0, essas opções estão disponíveis nas famílias dos templates Brine, Farro, Galapagos, Skye, Tremont e York. Veja informações sobre todos os templates em Tipos de Página de Produtos.

  Versão 7.1
Versão 7.0
Visualização rápida
  • Blocos de Produto
  • Blocos de Sumário
  • Página Armazenar
  • Blocos de Produto
  • Página de produtos
  • Blocos de Sumário
Aproximação na imagem
  • Páginas de detalhes de produtos
  • Lightboxes de Visualização rápida
  • Páginas de detalhes de produtos
  • Lightboxes de Visualização rápida
Efeitos hover
  • Imagem alternativa nas páginas de armazenamento
Listas de espera
  • Sim 
  • Sim (não disponível em Galápagos)

Aproximação na imagem

Com a ampliação da imagem, os clientes podem ampliar as imagens do produto para uma análise mais detalhada do material, da textura e dos detalhes mais finos. Você pode definir a ampliação para que seja ativada ao passar o mouse ou se a imagem for clicada.

A ampliação de imagens está disponível em:

image-zoom.gif

Ativar o zoom da imagem

A forma como você ativa o Zoom de imagem depende da versão do seu site.

Para ativar a ampliação da imagem: 

  1. Enquanto estiver em uma página de detalhes do produto, clique em Editar design no canto superior esquerdo. 
  2. Clique no menu suspenso Ação de pairar
  3. Selecione Zoom. 

Para ativar a ampliação da imagem:

  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 escolher se a Imagem Amplia assim que o cursor se move sobre ela, defina Ampliação ativada: com Clique ou Passar o mouse. (Em Galápagos, a ampliação será sempre ativada ao passar o mouse.)

Mais ajuda com a Aproximação na imagem

  • O Zoom da imagem mostra uma versão maior da imagem. Tecnicamente, ele não amplia o arquivo da imagem.
  • A ampliação de imagens não está disponível em dispositivos móveis.
  • Para obter melhores resultados, formate a imagem do produto para exibição na web antes de enviar.
  • Imagens com fundos transparentes (.png) exibirão a imagem original por trás da versão ampliada.
  • Na versão 7.1, o Zoom da imagem não está disponível nas galerias de produtos com o design Carrossel.

Visualização rápida

Com a Visualização rápida, o cliente clica em um botão para ver os detalhes do item em uma lightbox, sem sair da página atual. A Visualização rápida incentiva o cliente a interagir com sua loja e a conhecer mais produtos.

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

  • Blocos de Sumário
  • Blocos de Produto
  • Páginas de Produtos (chamadas de Páginas de Armazenamento na versão 7.1)

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 um botão 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 um Bloco de Produto:

  1. No editor do Bloco de Produto, escolha um produto para mostrar.
  2. Marque Ativar Visualização rápida.
  3. Clique em Apply (Aplicar) para salvar suas alterações.
  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.

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

  1. Abra as configurações da página.
  2. Clique em Avançado, clique em Exibição Rápidae, em seguida, ative a opção Ativar Exibição Rápida.
  3. Se houver outras Páginas de Produtos, repita os steps em cada uma.

Estilizar o botão e a lightbox (somente na versão 7.0)

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. 
  3. Na seção Produtos: Visualização rápida em lightbox, personalize a aparência da lightbox. 
Dica: se o texto da Visualização Rápida tiver 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.
  • A descrição dos produtos aparece na Visualização rápida sem formatação especial, incluindo estilo de cabeçalho, negrito, itálico, listas com marcadores ou quebras de linha.

Efeitos hover

Os efeitos do recurso de pairar exibem informações ou criam movimento quando você move o cursor sobre uma imagem do produto, adicionando interação e animação à sua loja. As opções de cursor disponíveis no seu site dependem da versão do site .

Todas as Páginas da Loja mostram uma imagem alternativa do produto ao passar o mouse.

As famílias de modelos de Brine, Farro, Skye, Tremont e York (com páginas de produtos avançados) têm três opções:

  • Imagem alternativa
  • Fade
  • Sobreposição de informações do produto

Você pode exibir nomes e preços de produtos sobre uma camada de cores ao passar o mouse nestas famílias de modelos (com Páginas de Produtos Clássica):

  • Adirondack, Avenida, Aviador, Bedford, Cinco, Flatiron, Forte, Ishimoto, Momentum, Montauk, Nativo, Pacífico, Wells, Wexley

Dois templates oferecem opções exclusivas de pairar:

Este artigo foi útil?
Utilizadores que acharam útil: 17 de 62
Recursos especiais da Página de Produtos