Pular para o conteúdo
GloboGlobo Docs
Instalar aplicação
Português (Portugal)

Lista de produtos

Mostre produtos no menu como um único cartão, grelha, lista ou carrossel.

Referência Todos os planos 3 min de leitura

Cartões de produto com imagem, fornecedor, nome e preço, diretamente no mega menu. Use Single product (produto único, todos os planos) para destacar um best-seller, ou uma grelha, lista ou carrossel (Growth Navigation, Pro Navigation) para novidades, mais vendidos ou uma coleção inteira.

Adicionar o bloco

  1. Escolha um esquema

    No painel do mega menu da pré-visualização, clique em Add block (adicionar bloco). Clique em Add product, passe o rato sobre um esquema e clique em Select.

    (1) Clique em Add product, (2) escolha um esquema.

  2. Escolha os produtos

    Para Single product, clique em Select products em Add product e escolha um. Para os outros esquemas, escolha uma Source (origem); para Collection escolha uma coleção, para Manual escolha os produtos.

    O bloco Product list na pré-visualização, com as definições em Edit Item.

  3. Guarde e publique

    Ajuste as definições abaixo e clique em Save e Publish.

Esquemas

O separador Add product lista primeiro Lookbook hotspots (consulte Lookbook com pontos interativos) e depois estes esquemas:

Single product
Um cartão de produto. O separador tem dois: um com a imagem em cima e outro com a imagem à esquerda.
Product grid image aboveGrowth · Pro
Produtos numa grelha, com a imagem em cima.
Product carouselGrowth · Pro
Produtos num carrossel com setas.
Product listGrowth · Pro
Produtos uns por baixo dos outros, com uma imagem pequena à esquerda.
Product grid image leftGrowth · Pro
Produtos numa grelha, com uma imagem pequena à esquerda.

Definições

Single product

WidthPredefinição: 25%
A parte da linha do mega menu que o bloco ocupa: Auto ou de 8,33% a 100%.
LayoutPredefinição: O esquema que escolheu
Image above (imagem em cima) ou Image left (imagem à esquerda).
Add productPredefinição: Nenhum
O produto a mostrar.
VisibilityPredefinição: Desativado
Hide on desktop, Hide on mobile, Hide when logged in, Only show when logged in, Schedule publishing. Consulte Definições comuns a todos os blocos.

Grelha, lista e carrossel de produtos

Title / LinkPredefinição: New products
Título por cima dos produtos e para onde leva, por exemplo a coleção completa.
WidthPredefinição: 75% grelhas · 25% lista, carrossel
A parte da linha do mega menu que o bloco ocupa.
List viewPredefinição: O esquema que escolheu
Carousel, List ou Grid (carrossel, lista ou grelha).
Number of productsPredefinição: 6 grelhas · 4 lista, carrossel
Quantos produtos mostrar.
Item(s) per rowPredefinição: 3 grelhas · 1 carrossel
Apenas Grid e Carousel: 1, 2, 3, 4 ou 6 produtos por linha.
Item viewPredefinição: O esquema que escolheu
Apenas Grid e Carousel: Image above ou Image left.
Image ratioPredefinição: Auto
Auto, 1:1, 4:3, 3:4, 16:9 ou 9:16. Dá a mesma forma a todas as imagens de produtos.
SourcePredefinição: Newest products
Newest products (adicionados mais recentemente), Best selling (mais vendidos), Collection (produtos de uma coleção que escolher) ou Manual (apenas os produtos que escolher).
VisibilityPredefinição: Desativado
As mesmas opções de Single product.

O que os clientes veem

Cada produto mostra a imagem, o fornecedor, o nome e o preço. Os produtos com várias variantes mostram From (desde) antes do preço mais baixo, um preço de comparação aparece riscado com o rótulo Sale (promoção) e os produtos indisponíveis mostram Sold out (esgotado).

Sugestões

  • Para adicionar um botão Add to cart (adicionar ao carrinho) por baixo de cada produto do menu, ative Settings > Advanced > Show add to cart button.
  • A reprodução automática e a repetição do carrossel estão em Settings > Carousel.
  • Os dados dos produtos são atualizados automaticamente e uma origem Collection mostra sempre os produtos atuais da coleção. Se eliminar um produto ou coleção ou alterar o respetivo handle (URL), volte a escolhê-lo.

Esta página foi útil?

Comunicar um problema