Hotspots
O que você vai aprender
- Pra que serve esta section
- Como funciona no celular vs no desktop
Pra que serve
Cria uma imagem "clicável" estilo "shop the look": você posiciona pontos (hotspots) sobre a imagem, e cada ponto abre um mini card com foto, título, preço e um botão de compra rápida do produto marcado ali. Bom pra fotos de ambiente ou lookbook onde você quer vender múltiplos produtos da mesma cena.
Aceita vários grupos de hotspot (um grupo = uma imagem com seus próprios pontos), organizados em colunas.
No desktop, passar o mouse sobre o ponto já mostra o preview; no celular, o toque abre direto um modal de compra rápida (não o card flutuante).
Como adicionar
- No Editor de temas, clique em Adicionar section
- Escolha Hotspots
- Adicione um Grupo de hotspot por imagem, e posicione os pontos sobre os produtos
Blocos aceitos
- Grupo de hotspot (
_hotspot-group)
Como configurar
| Configuração | Pra que serve |
|---|---|
| Colunas | Quantos grupos (imagens) aparecem lado a lado no desktop. |
| Cor do hotspot / Cor interna | Cores do ponto clicável sobre a imagem. |
| Espaçamento vertical (Popover) | Espaço entre o título e o preço dentro do card que abre. |