Fuegos artificiales en Blogger

Fuegos artificiales en Blogger: Estaba esperando estar más próximo a las fiestas de fin de año para traer este gadget para Blogger. Se trata de un código java script que hace que en la pantalla se vean fuegos artificiales.

Ideal para las fiestas de fin de año o cualquier otro acontecimiento que quieras festejar.



El código es el siguiente:

<script type="text/javascript"> //<![CDATA[ var bits=100; // cuantos bits var intensity=7; // que tan "poderosa" es la explosión. (recomendado entre 3 y 10) var speed=20; // rapidez (a menor numero, mas rapido) var colours=new Array("#03f", "#f03", "#0e0", "#93f", "#0cc", "#f93"); //azul rojo verde purpura cyan, naranjo var dx, xpos, ypos, bangheight; var Xpos=new Array(); var Ypos=new Array(); var dX=new Array(); var dY=new Array(); var decay=new Array(); var colour=0; var swide=800; var shigh=600; function write_fire() { var b, s; b=document.createElement("div"); s=b.style; s.position="absolute"; b.setAttribute("id", "bod"); document.body.appendChild(b); set_scroll(); set_width(); b.appendChild(div("lg", 3, 4)); b.appendChild(div("tg", 2, 3)); for (var i=0; i<bits; i++) b.appendChild(div("bg"+i, 1, 1)); } function div(id, w, h) { var d=document.createElement("div"); d.style.position="absolute"; d.style.overflow="hidden"; d.style.width=w+"px"; d.style.height=h+"px"; d.setAttribute("id", id); return (d); } function bang() { var i, X, Y, Z, A=0; for (i=0; i<bits; i++) { X=Math.round(Xpos[i]); Y=Math.round(Ypos[i]); Z=document.getElementById("bg"+i).style; if((X>=0)&&(X<swide)&&(Y>=0)&&(Y<shigh)) { Z.left=X+"px"; Z.top=Y+"px"; } if ((decay[i]-=1)>14) { Z.width="3px"; Z.height="3px"; } else if (decay[i]>7) { Z.width="2px"; Z.height="2px"; } else if (decay[i]>3) { Z.width="1px"; Z.height="1px"; } else if (++A) Z.visibility="hidden"; Xpos[i]+=dX[i]; Ypos[i]+=(dY[i]+=1.25/intensity); } if (A!=bits) setTimeout("bang()", speed); } function stepthrough() { var i, Z; var oldx=xpos; var oldy=ypos; xpos+=dx; ypos-=4; if (ypos<bangheight||xpos<0||xpos>=swide||ypos>=shigh) { for (i=0; i<bits; i++) { Xpos[i]=xpos; Ypos[i]=ypos; dY[i]=(Math.random()-0.5)*intensity; dX[i]=(Math.random()-0.5)*(intensity-Math.abs(dY[i]))*1.25; decay[i]=Math.floor((Math.random()*16)+16); Z=document.getElementById("bg"+i).style; Z.backgroundColor=colours[colour]; Z.visibility="visible"; } bang(); launch(); } document.getElementById("lg").style.left=xpos+"px"; document.getElementById("lg").style.top=ypos+"px"; document.getElementById("tg").style.left=oldx+"px"; document.getElementById("tg").style.top=oldy+"px"; } function launch() { colour=Math.floor(Math.random()*colours.length); xpos=Math.round((0.5+Math.random())*swide*0.5); ypos=shigh-5; dx=(Math.random()-0.5)*4; bangheight=Math.round((0.5+Math.random())*shigh*0.4); document.getElementById("lg").style.backgroundColor=colours[colour]; document.getElementById("tg").style.backgroundColor=colours[colour]; } window.onscroll=set_scroll; function set_scroll() { var sleft, sdown; if (typeof(self.pageYOffset)=="number") { sdown=self.pageYOffset; sleft=self.pageXOffset; } else if (document.body.scrollTop || document.body.scrollLeft) { sdown=document.body.scrollTop; sleft=document.body.scrollLeft; } else if (document.documentElement && (document.documentElement.scrollTop || document.documentElement.scrollLeft)) { sleft=document.documentElement.scrollLeft; sdown=document.documentElement.scrollTop; } else { sdown=0; sleft=0; } var s=document.getElementById("bod").style; s.top=sdown+"px"; s.left=sleft+"px"; } window.onresize=set_width; function set_width() { if (typeof(self.innerWidth)=="number") { swide=self.innerWidth; shigh=self.innerHeight; } else if (document.documentElement && document.documentElement.clientWidth) { swide=document.documentElement.clientWidth; shigh=document.documentElement.clientHeight; } else if (document.body.clientWidth) { swide=document.body.clientWidth; shigh=document.body.clientHeight; } } window.onload=function() { if (document.getElementById) { set_width(); write_fire(); launch(); setInterval('stepthrough()', speed); }} //]]> </script>

Para agregarlo: muy sencillo, vás a diseño, agregar un nuevo gadgets, HTML/JavaScript y pegas el código. Si aún te quedan dudas puedes leer: cómo agregar gadgets a blogger.

Si lo deseas también puedes modificar algunas cosas como la intensidad de los fuegos artificiales, su velocidad e inclusive los colores. Para este último punto puedes ver códigos de colores RGB para obtener los distintos códigos de colores.

Y si en estas fiestas en tu país nieva, aquí el gadget de nieve para el blog.

Es todo, espero les guste.

Botón de Facebook para Blogger

Hace tiempo que Facebook es la red social más importante del mundo y por ello es importante que incorpores en tu blog un botón para que todos aquellos que les gusta lo que escribes pueda recomendar tu post o blog en Facebook.

Antes de comenzar te recomiendo que compartas este post en Facebook, usando el botón de arriba para probar como funciona. Luego sigue con el siguiente paso.



Para agregar el botón de Facebook a blogger es muy sencillo.

Sólo hay que ir a Diseño, Edición HTML (marcar casilla expandir artilugios) y buscar la siguiente línea:

<div class='post-body entry-content'>
Para buscar un código rápidamente puedes usar ctrl+F

y justo debajo agregar:

<b:if cond='data:blog.pageType == "item"'><div style='float:right; padding:5px;'><a href='http://www.facebook.com/sharer.php' name='fb_share' type='box_count'>Compartir</a><script src='http://static.ak.fbcdn.net/connect.php/js/FB.Share' type='text/javascript'/></div></b:if>

Luego guada los cambios y listo!

Ahora los visitantes podrán compartir tus entradas en Facebook con un sólo clic!

El gadget instalado quedará como se muestra a continuación:



Igualmente lo puedes ver en funcionamiento en este mismo blog.

Espero les guste este nuevo gadget! y gracias por visitar PCZEROS!