Olá!
Hoje vou-vos ensinar a colocar um widget de contagem regressiva no seu blog!
1º Passo
Vá Blogger » Design » adicionar um gadget » HTML/JavaScript e cole o codigo abaixo (completo!)
<div style="color:#444444;
font-size:14px;
background:#ffffff url(Url da imagem) no-repeat center;
border:1px solid #444444;
max-height:185px;
max-width:250px;
padding:10px;
-moz-border-radius:3px;-khtml-border-radius:3px;-webkit-border-radius:3px;border-radius:3px">
<script type="text/javascript">
document.write("<span id='pageinval35' style='font-family:arial, helvetica, sans-serif; font-weight:bold;';></span>");
function countdown_load99(){var the_event="SÓ FALTAM";
var on_event="EVENTO"; //Mensagem no dia do evento
var event="EVENTO"; //Nome do evento
var yr=2011;
var mo=12;
var da=25;
var hr=00;
var min=00;
var sec=0;
var month='';
var month=new Array("Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec");var bottom_event="";var now_d=new Date();
var now_year=now_d.getYear();if (now_year < 1000)now_year+=1900;var now_month=now_d.getMonth();
var now_day=now_d.getDate();
var now_hour=now_d.getHours();
var now_min=now_d.getMinutes();
var now_sec=now_d.getSeconds();
var now_val=month[now_month]+" "+now_day+", "+now_year+" "+now_hour+":"+now_min+":"+now_sec;event_val=month[mo-1]+" "+da+", "+yr+" "+hr+":"+min+":"+sec;difference=Date.parse(event_val)-Date.parse(now_val);differenceday=Math.floor(difference/(60*60*1000*24)*1);differencehour=Math.floor((difference%(60*60*1000*24))/(60*60*1000)*1);differencemin=Math.floor(((difference%(60*60*1000*24))%(60*60*1000))/(60*1000)*1);differencesec=Math.floor((((difference%(60*60*1000*24))%(60*60*1000))%(60*1000))/1000*1);if(document.getElementById('pageinval35')){if(differenceday<=0&&differencehour<=0&&differencemin<=0&&differencesec<=1&&now_day==da){document.getElementById('pageinval35').innerHTML=on_event;}else if (differenceday<=-1){document.getElementById('pageinval35').innerHTML="Evento : "+on_event+" ... já passou";}else {document.getElementById('pageinval35').innerHTML="<center><font size='4'>"+the_event+"</font><br/> "+differenceday+" dias<br/> "+differencehour+" horas<br/> "+differencemin+" minutos<br/> "+differencesec+" segundos "+bottom_event+" para... <p/> <font size='4'><b>"+event;}
}setTimeout("countdown_load99()",1000);}countdown_load99();
// distribuição: http://www.blogandofacil.com.br
</script>
</div>
font-size:14px;
background:#ffffff url(Url da imagem) no-repeat center;
border:1px solid #444444;
max-height:185px;
max-width:250px;
padding:10px;
-moz-border-radius:3px;-khtml-border-radius:3px;-webkit-border-radius:3px;border-radius:3px">
<script type="text/javascript">
document.write("<span id='pageinval35' style='font-family:arial, helvetica, sans-serif; font-weight:bold;';></span>");
function countdown_load99(){var the_event="SÓ FALTAM";
var on_event="EVENTO"; //Mensagem no dia do evento
var event="EVENTO"; //Nome do evento
var yr=2011;
var mo=12;
var da=25;
var hr=00;
var min=00;
var sec=0;
var month='';
var month=new Array("Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec");var bottom_event="";var now_d=new Date();
var now_year=now_d.getYear();if (now_year < 1000)now_year+=1900;var now_month=now_d.getMonth();
var now_day=now_d.getDate();
var now_hour=now_d.getHours();
var now_min=now_d.getMinutes();
var now_sec=now_d.getSeconds();
var now_val=month[now_month]+" "+now_day+", "+now_year+" "+now_hour+":"+now_min+":"+now_sec;event_val=month[mo-1]+" "+da+", "+yr+" "+hr+":"+min+":"+sec;difference=Date.parse(event_val)-Date.parse(now_val);differenceday=Math.floor(difference/(60*60*1000*24)*1);differencehour=Math.floor((difference%(60*60*1000*24))/(60*60*1000)*1);differencemin=Math.floor(((difference%(60*60*1000*24))%(60*60*1000))/(60*1000)*1);differencesec=Math.floor((((difference%(60*60*1000*24))%(60*60*1000))%(60*1000))/1000*1);if(document.getElementById('pageinval35')){if(differenceday<=0&&differencehour<=0&&differencemin<=0&&differencesec<=1&&now_day==da){document.getElementById('pageinval35').innerHTML=on_event;}else if (differenceday<=-1){document.getElementById('pageinval35').innerHTML="Evento : "+on_event+" ... já passou";}else {document.getElementById('pageinval35').innerHTML="<center><font size='4'>"+the_event+"</font><br/> "+differenceday+" dias<br/> "+differencehour+" horas<br/> "+differencemin+" minutos<br/> "+differencesec+" segundos "+bottom_event+" para... <p/> <font size='4'><b>"+event;}
}setTimeout("countdown_load99()",1000);}countdown_load99();
// distribuição: http://www.blogandofacil.com.br
</script>
</div>
2º Passo
Depois de colar o gadget, no inicio do codigo vai mudar o seguinte:
background:#ffffff url(Url da imagem) no-repeat center; - onde diz url da imagem, ponha o url da imagem que quer usar para fundo!
var on_event="EVENTO"; //Mensagem no dia do evento - Onde diz evento, ponha o nome do evento
var event="EVENTO"; //Nome do evento - ponha outra vez o nome do evento
var yr=2011; - Onde diz 2011, ponha o ano em que se realiza o envento
var mo=12; - Onde está 12, ponha o mês em que se realiza o evento
var da=25; - Onde está 25, ponha o dia em que se realiza o evento
var hr=00; - Onde está 00, ponha a hora em que se realiza o evento
var min=00; - Onde está 00, ponha os minutos em que se realiza o evento
Bjs e até ao próximo post!


Sem comentários:
Enviar um comentário