Los usuarios de blogger envidiamos una cosa que los de Wordpress pueden tener, cono solo instalar un plugin, Una nube de tags o etiquetas en movimiento, formando una esfera y que al pasar el mouse se mueve con un efecto 3D.

Gracias a Amanda de BloggerBuster podemos tener ese mismo efecto siguiendo una serie de pasos para nada difíciles, pero que a algunos puede marear.

Este efecto es una mezcla de javascript con animación flash reproduciendo un plugin original de WP.

Ante todo, siempre descargar la plantilla por cualquier inconveniente

Primer paso:

Ir a Edición>>Edición de HTML y sin expandir artilugios, buscamos el el siguiente código:

<b:section class=’sidebar’ id=’sidebar’ preferred=’yes’>

Nota, es muy posible que no encuentren este código textualmente como está acá, este codigo es de plantillas standar´s de blogger. Si ustedes tiene  plantillas modificadas como yo o tienen más de una sidebar. En mi caso 3, tienen que buscar la palabra “Sidebar” hasta encontrarse con un código que diga:

b:section id=’Nombre de la sidebar’

Que puede ser por ejemplo lsidebar o rsidebar, etc. Solo es cuestión de probar.

Una vez encontrado el código, agregamos el siguiente código debajo:

<b:widget id=’Label99′ locked=’false’ title=’Labels’ type=’Label’><b:includable id=’main’><b:if cond=’data:title’><h2><data:title/></h2></b:if><div class=’widget-content’><script src=’http://halotemplates.s3.amazonaws.com/wp-cumulus-example/swfobject.js’ type=’text/javascript’/><div id=’flashcontent’>Blogumulus by <a href=’http://www.roytanck.com/’>Roy Tanck</a> and <a href=’http://www.bloggerbuster.com’>Amanda Fazani</a></div><script type=’text/javascript’>var so = new SWFObject(“http://halotemplates.s3.amazonaws.com/wp-cumulus-example/tagcloud.swf”, “tagcloud”, “240″, “300″, “7″, “#ffffff”);// uncomment next line to enable transparency//so.addParam(“wmode”, “transparent”);so.addVariable(“tcolor”, “0×333333″);so.addVariable(“mode”, “tags”);so.addVariable(“distr”, “true”);so.addVariable(“tspeed”, “100″);so.addVariable(“tagcloud”, “<tags><b:loop values=’data:labels’ var=’label’><a expr:href=’data:label.url’ style=’12′><data:label.name/></a></b:loop></tags>”);so.addParam(“allowScriptAccess”, “always”);so.write(“flashcontent”);</script><b:include name=’quickedit’/></div></b:includable></b:widget>

Ahora, ya tendríamos puesta la nube. Pero nos faltaría adecuarla para que combine perfectamente con nuestra plantilla, en cuanto a tamaño y colores.

Por defecto, la nube tiene estas características:

• Ancho 240px
• Alto 300px;
• Color de fuente: Blanco
• Color de Fondo: Gris
• Tamaño de la fuente: “12″ 

Para cambiar el alto y el ancho, simplemente cambiar los siguientes valores:

var a
fin = new SWFObject (
“http://halotemplates.s3.amazonaws.com/wp-cumulus-example/tagcloud.swf”,
“tagcloud”, “240“, “300“, “7″ , “# FFFFFF”);

Rojo: Ancho

Verde fluor feo: Altura

Para cambiar el color de fondo:

var a
fin = new SWFObject (
“http://halotemplates.s3.amazonaws.com/wp-cumulus-example/tagcloud.swf”,
“tagcloud”, “240″, “300″, “7″ , “# FFFFFF“);

Agregando el código del color que queramos.

Para Cambiar el color de la fuente: 

so.addVariable(“tcolor”, “0x333333“); 

Solo cambiar los numeros 333333, dejar el 0x sin cambiar.

Tamaño de la Fuente:

so.addVariable(“tagcloud”, “<tags><b:loop values=’data:labels’ var=’label’><a expr:href=’data:label.url’ style=’12′><data:label.name/></a></b:loop></tags>”);

style=’12′: Tamaño de la fuente.

Velocidad:

so.addVariable(“tspeed”, “100″);

Cambian el 100 por la que quieran (120 no queda nada mal). O pueden ponerle 1000 y probar que sucede =)

Esto es todo. Si hicieron todo bien, le dan a vista previa y ya tendría que estar ahí andando. Como verán a la derecha, si se toman el tiempo, pueden integrarla perfectamente. Y es adictivo pasarse un buen rato jugando con ella. Es normal

Cualquier pregunta o duda solo escriban.

Y por último, una ves creada, pueden moverda a cualquier lugar como cualquier otro widget, desde ‘elementos de la pagina’ 

Saludos