Nube de etiquetas 3D para tu blog

¿Te gusta la nube de tags o etiquetas animada que tengo en este blog? Es bastante sencillo si quieres tenerla en el tuyo.

Voy a explicar cómo colocar una nube de tags en Blogger, ya que es a mi entender, el servicio de blogs más fácil de flexibilizar que hay, y a la vez, porque es el más popular. De todas formas, no debe ser muy complicado adaptar este tutorial a Wordpress.

En primer lugar, hay que ir a la configuración del blog, entrando a la pestaña Diseño y luego a la "subpestaña" llamada "Edición de HTML".


Una vez, ahí el primer paso será hacer una copia de seguridad de nuestra plantilla, para que podamos restaurarla en caso de hacer lío. Para ello, haremos clic en la opción "Decsrgar plantilla completa", como se ve en la siguiente imagen.



Luego iremos más abajo de la ventana, y tildaremos la opción "Expandir plantillas de artilugios" y buscaremos debajo, en el código de la plantilla (está en lenguaje XML) la siguiente frase:

Es posible que en nuestra plantilla no encontremos la frase exacta, pero seguro encontraremos algo similar. En mi blog por ejemplo, la frase que encuentro es "

", pero es evidente que se trata de la sección llamada "Sidebar" o barra lateral. La idea es colocar el código para la nube de tags en ésta área del blog.

Inmediatamente debajo de esa línea, coloquen el siguiente código tal cual lo pongo yo:

Luego, previsualicen el blog presionando el botón azul "Vista previa" y vean el resultado. Obtendrán una nube de tags con la configuración por defecto.

Para configurarla, y así hacerla más acorde al blog (en cuanto a colores y formas) prestaremos atención a las siguientes líneas:

• Para editar los colores de fondo: (hay que escribir los valores en HEX)
  
  new SWFObject("http://halotemplates.s3.amazonaws.com/wp-cumulus-example/tagcloud.swf", "tagcloud", "240", "300", "7", "#ffffff");
  
  
• Para cambiar los tamaños: (especificar en píxeles)
  
  new SWFObject("http://halotemplates.s3.amazonaws.com/wp-cumulus-example/tagcloud.swf", "tagcloud", "240", "300", "7", "#ffffff");
  
  
• Para ajustar el tamaño de la fuente:
  
  so.addVariable("tagcloud", "12'>");
  
  
• Para hacer el fondo transparente:
  
  Hay que quitar la doble barra ( // ) que se antepone a la línea siguiente:
  
  //so.addParam("wmode", "transparent");

Espero que les haya gustado. La página web del autor de este widget se explica casi lo mismo que aca, solo que en inglés, y no se explica cómo poner el fondo transparente.

Por cualquier consulta, envíen un comentario y con gusto les ayudaré.