Pular para o conteúdo
GloboGlobo Docs
Instalar app
Português (Brasil)

Lista de produtos

Mostre produtos no menu como um único card, grade, lista ou carrossel.

Referência Todos os planos 3 min de leitura

Cards de produto com imagem, fornecedor, nome e preço, direto no mega menu. Use Produto único (todos os planos) para destacar um mais vendido, ou uma grade, lista ou carrossel (Growth Navigation, Pro Navigation) para novidades, mais vendidos ou uma coleção inteira.

Adicione o bloco

  1. Escolha um layout

    No painel do mega menu da pré-visualização, clique em Adicionar bloco. Clique em Adicionar produto, passe o mouse sobre um layout e clique em Selecionar.

    (1) Clique em Adicionar produto, (2) escolha um layout.

  2. Escolha os produtos

    Em Produto único, clique em Selecionar produtos em Adicionar produto e escolha um. Nos outros layouts, escolha uma Origem; em Coleção, escolha uma coleção; em Manual, escolha os produtos.

    O bloco Lista de produtos na prévia, com as configurações em Editar item.

  3. Salve e publique

    Ajuste as configurações abaixo e clique em Salvar e Publicar.

Layouts

A aba Adicionar produto lista Lookbook hotspots (hotspots de lookbook) primeiro (veja Hotspots de lookbook) e depois estes layouts:

Produto único
Um card de produto. A aba tem dois: um com a imagem acima e outro com a imagem à esquerda.
Grade de produtos, imagem acimaGrowth · Pro
Produtos em uma grade, com a imagem acima.
Carrossel de produtosGrowth · Pro
Produtos em um carrossel com setas.
Lista de produtosGrowth · Pro
Produtos um abaixo do outro, com imagem pequena à esquerda.
Grade de produtos, imagem à esquerdaGrowth · Pro
Produtos em uma grade, com imagem pequena à esquerda.

Configurações

Produto único

LarguraPadrão: 25%
Quanto da linha do mega menu o bloco ocupa: Automático ou de 8,33% a 100%.
LayoutPadrão: O layout que você escolheu
Imagem acima ou Imagem à esquerda.
Adicionar produtoPadrão: Nenhum
O produto a mostrar.
VisibilidadePadrão: Desativado
Ocultar no desktop, Ocultar no celular, Ocultar quando estiver logado, Mostrar somente quando estiver logado, Agendar publicação. Veja Configurações que todo bloco tem.

Grade, lista e carrossel de produtos

Título / LinkPadrão: Novos produtos
Título acima dos produtos e para onde ele leva, por exemplo a coleção completa.
LarguraPadrão: 75% grades · 25% lista, carrossel
Quanto da linha do mega menu o bloco ocupa.
Exibição em listaPadrão: O layout que você escolheu
Carrossel, Lista ou Grade.
Número de produtosPadrão: 6 grades · 4 lista, carrossel
Quantos produtos mostrar.
Itens por linhaPadrão: 3 grades · 1 carrossel
Somente em Grade e Carrossel: 1, 2, 3, 4 ou 6 produtos por linha.
Exibição do itemPadrão: O layout que você escolheu
Somente em Grade e Carrossel: Imagem acima ou Imagem à esquerda.
Proporção da imagemPadrão: Automático
Automático, 1:1, 4:3, 3:4, 16:9 ou 9:16. Deixa todas as imagens de produto com o mesmo formato.
OrigemPadrão: Produtos mais recentes
Produtos mais recentes (adicionados há menos tempo), Mais vendidos, Coleção (produtos de uma coleção que você escolher) ou Manual (somente os produtos que você escolher).
VisibilidadePadrão: Desativado
As mesmas opções de Produto único.

O que os compradores veem

Cada produto mostra sua imagem, fornecedor, nome e preço. Produtos com várias variantes mostram A partir de antes do menor preço, um preço original aparece riscado com um rótulo Oferta, e produtos indisponíveis mostram Esgotado.

Dicas

  • Para adicionar um botão Adicionar ao carrinho abaixo de cada produto no menu, ative Configurações > Avançado > Exibir botão Adicionar ao carrinho.
  • A reprodução automática e o loop do carrossel ficam em Configurações > Carrossel.
  • Os dados dos produtos são atualizados automaticamente, e a origem Coleção sempre mostra os produtos atuais da coleção. Se você excluir um produto ou coleção ou alterar o handle (URL) dele, escolha-o de novo.

Esta página foi útil?

Relatar um problema