Documentação / Etiquetas / Conteúdo e aparência

Conteúdo e aparência

Tudo o que a etiqueta mostra e como ela se parece — com pré-visualização ao vivo à direita, então dá para acertar o visual antes de publicar.

Tipo de etiqueta

TipoQuando usar
TextoO caso mais comum. Você escreve o texto (podendo usar tags dinâmicas, abaixo).
Imagem personalizadaUm selo em PNG/JPG que você mesmo enviou (arte do designer).
Modelo12 selos prontos que já vêm com o módulo (fita, círculo, canto dobrado…). O caminho mais rápido para um resultado bonito.

Texto com tags dinâmicas

No texto da etiqueta você mistura texto fixo com tags que o módulo substitui pelos dados reais de cada produto. Escreva uma vez, serve para a loja inteira. Por exemplo, -{SAVE_PERCENT} exibe -30%, -15%… calculado produto a produto.

TagO que mostra
{NAME}Nome do produto
{PRICE}Preço atual
{REGULAR_PRICE}Preço original (sem desconto)
{SAVE_PERCENT}Percentual de desconto (ex.: 30%)
{SAVE_AMOUNT}Valor economizado em reais
{SALE_ENDS}Dias restantes da promoção
{SKU}Código SKU
{QTY}Quantidade em estoque
{STOCK_STATUS}Situação do estoque
{RATING}Nota média de avaliação
{BRAND | 1}Marca(s) do produto
{CATEGORY | 1}Categoria(s) do produto
{BR}Quebra de linha

O número depois da barra limita a quantidade: {CATEGORY | 1} mostra só a primeira categoria. Há ainda tags de cálculo ({CALC:...}) e formatação ({FORMAT:...}) para casos avançados — se precisar, a equipe da Pixel Partners ajuda a montar.

Posição

  • Na imagem — a etiqueta fica sobreposta à foto (o mais usado), ancorada em um dos 9 pontos (Esquerda/Centro/Direita × Superior/Centro/Inferior);
  • Antes do título — acima do nome do produto, fora da imagem.

Promoção costuma ficar bem em Esquerda Superior; Frete Grátis em Direita Superior.

Estilo

Ative Definir estilos personalizados para liberar os controles: cor de fundo e do texto (com transparência), tamanho/estilo/ peso da fonte e espaçamento entre letras, tamanho da etiqueta, borda e cor da borda, sombra, opacidade, espaçamento interno, margem e rotação em graus (útil para selos em diagonal). Há ainda um campo de CSS personalizado, opcional, para ajustes finos.

Produtos → Etiquetas — pré-visualização
PROMOÇÃO
Um selo em diagonal com rotação. As telas podem variar conforme a versão.

Animação (opcional)

Dê movimento ao selo para chamar atenção — chacoalhar, deslizar, pulsar — com controle de duração, número de repetições (ou infinito) e atraso antes de começar.

Use com moderação: animação demais polui a página e distrai da compra.

Link (opcional)

Em Link da etiqueta, transforme o selo em um link clicável (ex.: levar para a categoria “Ofertas”), com a opção de abrir em nova janela.

Documentação do Etiquetas · escrita com base na versão 2.1.3. As telas ilustradas podem variar conforme a versão instalada na sua loja.