Como adicionar um temporizador

Um temporizador exibe um relógio ao lado das ofertas do seu pacote. Escolha uma duração fixa, a meia-noite local ou um prazo personalizado, com um layout completo de blocos de dígitos ou uma barra compacta. O temporizador é um recurso visual: chegar a zero não desativa o desconto nem impede que os clientes o recebam. Se uma promoção precisar terminar, gerencie o desconto separadamente e use uma mensagem compatível com a oferta real.

Ativar o temporizador

O temporizador é configurado por oferta de pacote, no editor do pacote, portanto aparece apenas onde o widget desse pacote é exibido.

1. Abra a oferta de pacote que deseja editar.
2. Abra a aba Complementos e localize a seção Temporizador de contagem regressiva.
3. Ative o botão ao lado do título Temporizador.
4. Salve o pacote.

Assim como no restante do widget, a incorporação do app, ou bloco do app, ainda precisa estar ativada, com um pacote publicado correspondente ao produto, para que o temporizador seja exibido na loja virtual.

Escolha um layout

A configuração Layout da contagem regressiva controla a aparência do temporizador:

• Completo - um bloco maior com dígitos separados para dias, horas, minutos e segundos, além de um título e subtítulo opcionais.
• Compacto - uma única linha fina que combina uma mensagem curta com o tempo, usando o campo Título compacto.

Defina a posição

A configuração Posição determina onde o temporizador ficará:

• Acima do widget - dentro da página do produto, logo acima do pacote.
• Abaixo do widget - dentro da página do produto, logo abaixo do pacote.
• Barra fixa (superior) - fixada na parte superior da janela do navegador. Disponível apenas no layout Compacto.

Se você mudar para o layout Completo enquanto a Barra fixa estiver selecionada, a posição voltará automaticamente para Acima do widget.

Escolha um tipo de temporizador

Em Tipo de temporizador, escolha como a contagem regressiva funcionará:

• Duração fixa - faz a contagem regressiva de um número definido de minutos para cada visitante.
• Termina à meia-noite, no horário local do usuário - faz a contagem regressiva até a meia-noite no fuso horário de cada cliente, com um novo prazo diário quando a página é carregada no dia seguinte.
• Data final personalizada - faz a contagem regressiva até uma data e hora específicas definidas por você.

Duração fixa

Ao selecionar Duração fixa, defina a Duração em minutos. O valor deve estar entre 1 e 1440 minutos, ou 24 horas. A contagem regressiva usa o horário local do navegador, portanto atualizar a página não garante que o visitante receba uma nova duração completa. Em uma página já aberta, chegar a zero aplica o comportamento de expiração selecionado. Não conte com o reinício automático do relógio nessa página. Teste a expiração e um carregamento posterior da página antes de publicar sua mensagem.

Data final personalizada

Ao selecionar Data final personalizada, escolha a Data e hora finais. O editor exibe um fuso horário detectado ao lado do campo. Confira a contagem regressiva resultante nos seus mercados-alvo, especialmente se precisar de um prazo compartilhado entre fusos horários. O temporizador não é um mecanismo de aplicação para uma promoção que termina no mundo todo. Quando o prazo exibido passa, ele segue o comportamento de expiração selecionado.

Decida o que acontece quando o temporizador termina

Use Quando o temporizador terminar para controlar o estado após a expiração:

• Ocultar temporizador - a contagem regressiva desaparece.
• Mostrar zeros - a contagem regressiva continua visível, congelada em zero.
• Mostrar mensagem - a contagem regressiva é substituída por uma Mensagem de expiração escrita por você, por exemplo, "O temporizador terminou. As ofertas continuam disponíveis.".

O comportamento de expiração também é importante para a Duração fixa. Em nosso teste de um minuto, a mensagem continuou visível após chegar a zero, enquanto o desconto continuou funcionando no carrinho e no checkout.

Use a variável {{timer}}

No campo Título compacto, você pode inserir a variável {{timer}} onde quiser que o tempo atual apareça. Por exemplo:

Routine timer: {{timer}}

O app substitui {{timer}} pela contagem regressiva em andamento. O Título compacto também é reutilizado na barra fixa de adicionar ao carrinho quando Mostrar contagem regressiva na barra fixa está ativado, portanto mantenha-o curto e claro. No layout Completo, você estiliza o título, o subtítulo e os blocos de dígitos separadamente, em vez de inserir o tempo em uma única linha, portanto {{timer}} não é usado nesse layout. Para ver os outros placeholders que você pode usar nos textos do widget, consulte Variáveis de modelo.

Estilize o temporizador

Abaixo das configurações de comportamento, você pode combinar a aparência com a do seu widget:

• Aplique uma predefinição de cor ou use Combinar cantos da contagem regressiva com o widget principal para alinhar o raio dos cantos ao seu pacote.
• Abra Estilo da contagem regressiva para ajustar o fundo, o contêiner (preenchimento, borda, sombra e alinhamento) e o texto. No layout Completo, você pode estilizar individualmente o título, o subtítulo, os dígitos e os rótulos das unidades.

Definir o temporizador na posição Barra fixa deixa os cantos retos automaticamente, pois uma barra fixa no topo fica melhor alinhada às bordas. Para reutilizar a mesma contagem regressiva dentro da barra flutuante de adicionar ao carrinho, consulte Adicionar ao carrinho fixo.

Salve e teste o resultado

Salve o desconto e abra uma página de produto específica com o desconto ativo. Confira o temporizador no desktop e no celular. Para um teste rápido de expiração, use temporariamente um minuto e aguarde chegar a zero, depois restaure a duração desejada. Verifique o estado após a expiração e use Adicionar ao carrinho e o checkout para confirmar o comportamento real da oferta.

Nosso exemplo usa um temporizador compacto de 15 minutos acima das ofertas. O teste de um minuto confirmou que a mensagem do temporizador muda ao chegar a zero, mas duas bolsas de $24 ainda recebem 10% de desconto, resultando em um subtotal de mercadorias de $43.20 no carrinho e no checkout. O frete é separado. Mantenha a mensagem do temporizador consistente com esse comportamento.