Página do produto¶
As páginas de produtos do e-commerce exibem todos os detalhes do produto e itens de mídia relacionados aos produtos relevantes. É possível personalizar a seção de imagens e vídeos, escolher quais informações do produto exibir, mostrar botões específicos, personalizar a seção de detalhes de atributos, habilitar recursos organizacionais adicionais e adicionar conteúdo usando blocos de construção.
Product images and videos¶
Após adicionar itens de mídia no formulário do produto ou após a criação do produto no frontend, personalize-os nas páginas de produto do frontend. Para fazer isso, navegue até a página do produto relevante na loja online, clique em Editar no canto superior direito e navegue até a aba Estilo.
Dica
Para acessar a página de produto relevante a partir do formulário de produto no backend, clique no botão inteligente Ir para o site no topo do formulário.
Para gerenciar itens de mídia individuais, clique no item na página do produto e role para baixo até a seção Imagem do editor do site. Você pode então Substituir ou Remover a imagem ou vídeo e Reordenar os itens. Use o (seta dupla esquerda) ou (seta dupla direita) para mover a mídia para a primeira ou última posição, e o (seta esquerda) ou (seta direita) para movê-los uma posição.
Para ajustar o layout da seção de imagens e vídeos, vá para Área de imagens e defina o tamanho das imagens e a Posição. Em seguida, navegue até a seção Imagens e use as seguintes opções para personalizar esta seção:
Imagem principal: Clique em Substituir para alterar a imagem principal do produto.
Nota
Não é possível usar um vídeo como item de mídia principal.
Mídia extra: Adicionar mais imagens ou vídeos (incluindo via URL) ou Remover tudo itens de mídia.
Exibição: Escolha entre os seguintes layouts quando você usar mais de um item de mídia:
Carrossel: Esta opção permite que os visitantes naveguem de uma imagem para a próxima usando o (seta esquerda) ou (seta direita). Mostrar Miniaturas na (Esquerda) ou na (Inferior) e adaptar o Arredondamento dos cantos das imagens.
Grade: Este layout exibe itens de mídia em um layout quadrado. Ajuste o número de Colunas e defina o Espaçamento entre as imagens na grade, se necessário.
Corte automático: Escolha um tamanho para cortar/aparar imagens e adequá-las ao layout da página. Isso é útil ao projetar o Mobile layout.
Zoom ao clicar: Habilite o zoom da imagem quando os visitantes clicarem em uma imagem.
Layout da página e exibição de informações do produto¶
Para personalizar o layout das páginas de produtos, acesse qualquer página de produto, clique em Editar no canto superior direito e navegue até a aba Estilo. Em seguida, vá para a configuração Largura da página e escolha a opção Regular ou Largura total.
Dica
Você pode escolher uma largura diferente para a página da loja.
Selecione quais informações do produto aparecem nas páginas de produtos usando as opções disponíveis na seção Detalhes do produto. Você pode configurar botões, definir como os atributos são exibidos, organizar a página usando recursos de personalização de página e adicionar conteúdo usando blocos de construção.
Atributos¶
Escolha como os atributos de produto são exibidos na seção Especificação da página do produto:
Nenhum: Não mostra os detalhes.
Rodapé da página: Mostra os detalhes no final da página.
Em acordeão: Mostra uma tabela recolhível diretamente abaixo das opções de pedido.
Nota
A seção de especificação é exibida apenas quando as variantes de produto estão ativadas e pelo menos um atributo foi definido para o produto.
Dica
Crie categorias de atributos para estruturar melhor esta seção.
Use o tipo de exibição de atributo Imagem para mostrar imagens de variantes de produto na página do produto.
Opções de organização da página e recursos adicionais¶
Ative ou desative as seguintes opções para ativar ou desativar recursos em todas as páginas de produto:
Separadores: Organiza a página e melhora a clareza visual.
Indicação de impostos: Indica se o preço inclui ou exclui IVA.
Tags: Exibe as tags criadas no backend nas páginas de produto e permite que os clientes filtrem produtos por essas tags.
Termos e condições: Exibe um link para seus termos e condições.
Avaliações: Permite que usuários do portal logados enviem avaliações de produtos. Para adicionar uma avaliação, os usuários devem navegar até a seção Avaliações de clientes no final da página e clicar no ícone (mais). Eles podem então selecionar uma classificação usando os ícones (estrela) e deixar um comentário. A classificação (estrela) é exibida diretamente abaixo do nome do produto.
Barra de pesquisa: Exibe uma barra de pesquisa que pode ser mostrada ou ocultada independentemente da página da loja.
Faixa (ou distintivo): Destaca um produto específico.
Dica
É possível ativar recursos adicionais e exibir informações previamente configuradas no backend:
Click & Collect: Mostrar o local de retirada do pedido e a disponibilidade de entrega na página do produto e permitir que os clientes selecionem o ponto de retirada desejado.
Descrição: Exibe uma descrição de produto específica para e-commerce logo abaixo do nome do produto.
Embalagens: Oferece diferentes tipos de embalagens.
Documentos: Adicione documentos relevantes, como manuais do usuário ou outros materiais de suporte.
Produtos alternativos: Sugira produtos similares e personalize a seção.
Mostrar Quantidade Disponível: Exiba a quantidade de produto disponível quando a quantidade cair abaixo de um limite especificado.
Mensagem de Produto Esgotado: Exiba uma mensagem personalizada para produtos que estão fora de estoque.
Ser notificado quando voltar ao estoque: Os clientes podem inserir seu endereço de e-mail para receber uma notificação quando o item voltar ao estoque.
Campos extras da página do produto: Para habilitar campos extras específicos para a página do produto, habilite o modo de desenvolvedor. Em seguida, acesse , selecione o site relevante, navegue até a aba Campos extras da página do produto e, em Campo, clique em Adicionar uma linha para adicionar quantos campos adicionais forem necessários, por exemplo, o número do código de barras do produto.
Blocos de construção¶
Use blocos de construção para adicionar conteúdo e elementos de design a todas as páginas de produtos ou a uma específica. Para isso, navegue até qualquer página de produto ou até a relevante e clique em Editar no canto superior direito. Em seguida, na aba (mais) Blocos, selecione um bloco de construção e arraste e solte:
na área azul na parte superior ou inferior da página do produto para torná-lo disponível em todas as páginas de produtos, ou
na área azul de bloco de construção abaixo do título do produto ou abaixo das opções de pedido para exibi-lo apenas para o produto atual.
Nota
Esses blocos de construção não aparecem na página da loja.
Veja também