Início
> contagem regressiva blogger
> contagem regressiva html
> contagem regressiva pronta
> contágem rergessiva para página de vendas
> gadget de contagem regressiva
> widget de contagem regressiva
Como criar uma contagem regressiva para uma data no Blogger
Opa beleza com vocês? Esse é mais um artigo do Blogger Profissional.
Hoje vou te ensinar como criar um bloco de contagem regressiva para uma data, dentro do blogger.
Muito utilizado em páginas de venda, a contagem regressiva gera uma sensação de escassez, faz seu cliente pensar que se não comprar agora ele pode perder essa oportunidade.
Existem vários sites que te dão um código pronto apenas para copiar e colar dentro do seu site, mais geralmente eles sempre vêm com uma marca d’água do criador por cima, ou um link em baixo.
Mais eu criei um código JavaScript que funciona dentro do blogger sem erro.
Para criar um bloco de contagem regressiva dentro do blogger, basta você copiar e colar esse código abaixo onde você quer adicionar.
<div id="contagem"></div><script language="JavaScript">var datadoevento = new Date("Jun 28, 2020 21:27:00");var dataagora = new Date();var mensagemquandochegar = "Vagas Esgotadas ... ";if (dataagora >= datadoevento){ document.getElementById("contagem").innerHTML = mensagemquandochegar; }else { diferenca_tempo = Math.floor(((datadoevento - dataagora).valueOf()) / 1000); diferencadetempo(diferenca_tempo); }function diferencadetempo(diferenca_tempo) {if (diferenca_tempo <= 0) { document.getElementById("contagem").innerHTML = mensagemquandochegar; return; }contador = segundos(diferenca_tempo, 86400, 100000) + " Dias " + segundos(diferenca_tempo, 3600, 24) + " Horas " + segundos(diferenca_tempo, 60, 60) + " Minutos e " + segundos(diferenca_tempo, 1, 60) + " Segundos para <b>INAUGURAÇÃO</b>"; document.getElementById("contagem").innerHTML = contador; setTimeout("diferencadetempo(" + (diferenca_tempo - 1) + ")", 1000); }function segundos(secs, num1, num2) { num = ((Math.floor(secs / num1)) % num2).toString();if (num.length < 2) s = "0" + num; return "<b>" + num + "</b>";} </script>
Pode copiar esse código dentro de um Gadget, numa Página estática, em um Post ou direto no HTML do Blogger.
Para adicionar a sua própria data, modifique a variável ("Jun 28, 2020 21:27:00") pela ("Sua nova data"), importante lembrar que a data só vai funcionar se estiver nesse mesmo formato [Mês dia, ano hora:minuto:segundo] *O mês precisa ser uma sigla das três primeiras letras em inglês.
Para modificar a mensagem que vai aparecer quando o contador chegar em zero, substitua onde está escrito Vagas Esgotadas.
E para modificar o texto na frente do contador, antes de chegar o dia, substitua onde está escrito INAUGURAÇÃO.
Só funciona um contador por página... Se você adicionar mais que isso pode dar erro em algum deles.
Espero ter te ajudado.
Deixe seu feedback a baixo, junto com o link do seu site onde está usando esse contador.
Se você gostou desse conteúdo e quer ver mais, acompanhe nosso trabalho no YouTube, no Instagram e nesse Blog.
Nos vemos na próxima, até lá.
Nenhum comentário:
Postar um comentário
Deixe um comentário com seu Feedback sobre este Conteúdo.