Tutorial- Como colocar contagem regressiva no blog?

10:21

xaveiro coração

Este é o primeiro tutorial do blog, por isso queria que fosse muito original!... Vou ensinar como colocar uma contagem regressiva no blog, o que pode ser muito útil, para blogs, que vão fazer um concurso,sorteio, ou aniversário! Vamos fazer então!

Clique em continuar lendo e veja o tutorial! ↓↓


Colocar uma contagem regressiva no blog é muito fácil, muito fácil mesmo! Primeiro vá em design > adicionar um Gadget > HTML/JavaScript.
Depois coloque o seguinte código, COMPLETO ! ↓↓


<script language="JavaScript1.2">
function setcountdown(theyear,themonth,theday) {
yr=theyear;mo=themonth;da=theday
} setcountdown(2009,10,05)


var occasion="Data Especial"
var message_on_occasion="É hoje"


var countdownwidth='510px'
var countdownheight='200px'
var countdownbgcolor='#ccffe1'
var opentags='<font face="Verdana" size="2" color="#000000">'
var closetags='</font>'



var montharray=new Array("Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec")
var crosscount=''

function start_countdown(){
if (document.layers)
document.countdownnsmain.visibility="show"
else if (document.all||document.getElementById)
crosscount=document.getElementById&&!document.all?document.getElementById("countdownie") : countdownie
countdown()
}

if (document.all||document.getElementById)
document.write('<span id="countdownie" style="width:'+countdownwidth+'; background-color:'+countdownbgcolor+'"></span>')

window.onload=start_countdown


function countdown(){
var today=new Date()
var todayy=today.getYear()
if (todayy < 1000)
todayy+=1900
var todaym=today.getMonth()
var todayd=today.getDate()
var todayh=today.getHours()
var todaymin=today.getMinutes()
var todaysec=today.getSeconds()
var todaystring=montharray[todaym]+" "+todayd+", "+todayy+" "+todayh+":"+todaymin+":"+todaysec
futurestring=montharray[mo-1]+" "+da+", "+yr
dd=Date.parse(futurestring)-Date.parse(todaystring)
dday=Math.floor(dd/(60*60*1000*24)*1)
dhour=Math.floor((dd%(60*60*1000*24))/(60*60*1000)*1)
dmin=Math.floor(((dd%(60*60*1000*24))%(60*60*1000))/(60*1000)*1)
dsec=Math.floor((((dd%(60*60*1000*24))%(60*60*1000))%(60*1000))/1000*1)
//if on day of occasion
if(dday<=0&&dhour<=0&&dmin<=0&&dsec<=1&&todayd==da){
if (document.layers){
document.countdownnsmain.document.countdownnssub.document.write (opentags+message_on_occasion+closetags)
document.countdownnsmain.document.countdownnssub.document.close()
}
else if (document.all||document.getElementById)
crosscount.innerHTML=opentags+message_on_occasion+closetags
return
}
//if passed day of occasion
else if (dday<=-1){
if (document.layers){
document.countdownnsmain.document.countdownnssub.document.write(opentags+"Occasion already passed! "+closetags)
document.countdownnsmain.document.countdownnssub.document.close()
}
else if (document.all||document.getElementById)
crosscount.innerHTML=opentags+"Já passou"+closetags
return
}
//else, if not yet
else{
if (document.layers){
document.countdownnsmain.document.countdownnssub.document.write(opentags+dday+ " days, "+dhour+" hours, "+dmin+" minutes, and "+dsec+" "+occasion+closetags)
document.countdownnsmain.document.countdownnssub.document.close()
}
else if (document.all||document.getElementById)
crosscount.innerHTML=opentags+dday+ " dias, "+dhour+" horas, "+dmin+" minutos, e "+dsec+" segundos para a <b>"+occasion+closetags
}
setTimeout("countdown()",1000)
}
</script>

Depois de colar o código no Gadget, no início dele você mudar o seguinte! 

<script language="JavaScript1.2">
function setcountdown(theyear,themonth,theday) {
yr=theyear;mo=themonth;da=theday
} setcountdown(2009,10,05)

var occasion="Data Especial"
var message_on_occasion="É hoje"

Mude o dia que a contagem vai terminar observação tem que ser (Ano,mês,dia). No lugar de 'Data especial', coloque algo que complete a frase! Como exemplo eu vou colocar o que eu fiz na minha contagem olhe:

(2011,08,16)- Dia do aniversário do blog!

"Para o aniversário de um ano do blog!"- Essa foi a frase que eu coloquei no lugar de Data especial! 

Por enquanto é só isso, espero que tenham gostado, deixe um comentário porque esse foi o primeiro de muitos tutoriais que eu vou colocar aqui!

Elcimar Reis. 

Você também pode gostar:

Comentários
29 Comentários

29 mil comentários

  1. Bem util, também pode servir para fazer de contagem regressiva para o fim de um concurso.
    Adorei o tutorial.

    Novo post lá no blog, entra e comenta? Concerteza irei retribuir!

    Beijos,

    Biiã.

    http://paraisodemenina.blogspot.com/

    ResponderExcluir
  2. Elcimar, gostei muito mais deste lay que vc está usando ^^ E o tutorial, excelente!
    http://meninasapeca-ms.blogspot.com/

    ResponderExcluir
  3. Obrigado gente , vocês não imaginam como estou feliz!! =D

    ResponderExcluir
  4. Eu amei o tutorial e o blog esta lindo!!
    Parabéns!

    Beijos,
    Gisele!

    ResponderExcluir
  5. Amei o tutorial, vou colocar no meu blog!
    http://thetingteens.blogspot.com/

    ResponderExcluir
  6. ELCIMAR, QUANTO À DICA DO BLOG FICOU BEM MELHOR. E QUANTO AO SEU POST, O TUTORIAL FICOU ÓTIMO.

    ABRÇS
    BRUNO JP TEIXEIRA - O PORTUGA

    ResponderExcluir
  7. Nossa vou usar quando chegar o niver do blog!

    ResponderExcluir
  8. Obrigado Taysa!!! Vindo de vc isso é muito importante!!!1 beijoos =D

    ResponderExcluir
  9. RADIO GOSPEL MUSIC LIFE

    http://crescerevencercomjesus.blogspot.com

    ResponderExcluir
  10. Elcimar help me!!!
    Eu tentei fazer isso, mas não deu certo!
    Fiz tudinho corretamente e não aparece nada! õ.Ô

    ResponderExcluir
  11. Hooy... vou tentar descobrir o erro agora mesmo!! =D

    ResponderExcluir
  12. Teen blog o problema foi resolvido! Agora tente colocar no seu blog! =D

    ResponderExcluir
    Respostas
    1. no meu também nao aparece qual seria a a correção

      Excluir
  13. Galera eu testei o tutorial no meu blog e deu certo! (^^)

    ResponderExcluir
  14. Adorei!!!
    Só queria mudar a cor do fundo, para branco. Como eu faço???
    Bjs

    ResponderExcluir
  15. Não consigo faço tudo mas não aparece no meu blog porque será?

    ResponderExcluir
  16. blz sua dica irmão visita o blog lá se quiser abraços

    ResponderExcluir
  17. valeu irmão visita a gente quando puder abraços http://tobaixandofilme.blogspot.com/

    ResponderExcluir
  18. Me ajuda ai a cor eu não gostei queria da cor do meu blog como fasso? ajuda pfv

    ResponderExcluir
  19. Olá! Como faço para trocar a fonte?

    ResponderExcluir
  20. nao consigo fazer rodar em meu blog algum pode ajudar

    ResponderExcluir
  21. Adorei seu blog, e esse post me ajudou muito para colocar a contagem no meu blog!

    ResponderExcluir