Skip to main content
O bloco Summary mostra ao comprador o que ele vai pagar: uma linha de total com economias opcionais, mais as tags de desconto aplicadas. Ele resume os totais e economias do carrinho logo acima do botão de checkout, para que os compradores vejam o valor final antes de confirmar.
Bloco Summary exibindo subtotal, economias e descontos aplicados antes do checkout

Comportamento

  • Os tokens de economia recolhem graciosamente. Se uma célula referencia {{savings}} ou {{pre_savings_price}} mas o carrinho não tem economia, essa célula recorre a apenas {{total_price}}, então os compradores nunca veem “$0.00 off” ou um preço riscado igual ao total. Se você combinar {{cart_item_count}} e {{savings}} na mesma célula, a contagem de itens também é removida no fallback sem economias — coloque-os em células separadas para evitar isso.
  • As tags de desconto aparecem apenas quando Show discount codes está ativado e o carrinho tem descontos para listar. Isso inclui tanto descontos baseados em código quanto automáticos.

Configurações

As células de texto suportam os tokens {{cart_item_count}}, {{total_price}}, {{pre_savings_price}} e {{savings}}.

Posicionamento e limites

  • Região: parte inferior.
  • Máximo: 2 por estado do carrinho — o carrinho com itens e o carrinho vazio recebem cada um sua própria cota.
  • Estado: tanto carrinho com itens quanto vazio.
  • Adicionado a novos carrinhos por padrão. Não bloqueado, então você pode removê-lo ou ocultá-lo.

Template personalizado

Suporta um template personalizado na sua aba Code, que substitui o markup nativo deste bloco pelo seu JSX. Estas são as props que ele recebe.
Como savings pode ser dinheiro ou porcentagem, não construa sua própria frase em torno dele presumindo um dos dois. {props.savings} sozinho é seguro; You saved ${props.savings} não é.

Design

Estilize este bloco com sua seção Design no painel de configurações. Essas são sobreposições por bloco que se aplicam por cima do seu design global e recorrem a ele quando estão em branco. O que são configurações de design? Saiba mais aqui: Configurações de design.