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. nao consigo fazer rodar em meu blog algum pode ajudar

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

    ResponderExcluir

Já curtiu?

+ Lidas