Son muchas etiquetas... y se veia mal una lista tan larga e interminable en el blog. Así que averigué como poner una nube 3d the TAGS (o etiquetas, es lo mismo) y quedó así. La verdad se ve mejor y ocupa menos espacio, ademas de ser más interactivo, la vi en el blog de stev y nunca pude configurar una. Hasta ahora.Si tu tienes un blog, voy a colocar la forma de poner las dos versiones de etiquetar entradas que hay en mi blog... la nube normal y la nube 3D.
Para colocar la nube normal (esquina inferior derecha del blog) basta ir a 'Personalizar' --> 'Diseño' --> 'Elementos de la página'
Luego debes colocar 'añadir gadget' y seleccionas "Etiquetas".
Ahora aparecerá la configuración de las Etiquetas y aquí pueden colocar la opción Nube. Guardan y quedará listo. Pueden configurarla como más lo deseen. Para cambiar el color de los hipervínculos también se cambian en 'Diseño' --> 'Fuentes y Colores'.
Para agregar la Etiqueta 3D con movimiento debemos editar el HTML del blog, siguiendo los siguientes pasos.[Paso 1] Nos situamos en nuestro panel de Blogger "Edición Html" y sin expandir las plantillas de artilugios localizamos esta línea de código:
<b:section class="'sidebar'" id="'sidebar'" preferred="'yes'"></b:section>
[Paso 2] Justo a continuación (debajo de la línea) pegamos el código para que la nube de etiquetas se muestre al principio de nuestra sidebar (una vez instalado el elemento podremos luego moverlo como cualquier otro gadget):
-------------------------------------------------------------------------------------
<b:widget id='Label50' locked='false' title='Nube de etiquetas' 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", "0x333333");
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>
-------------------------------------------------------------------------------------
Para cambiar las características de la nube, se deben editar los siguientes parámetros en el HTML, si han cerrado la edición tendran que abrir las plantillas de artilugio esta vez.
Cambiar el ancho (240px) y el alto (300px) de la nube:
var so = new SWFObject("http://halotemplates.s3.amazonaws.com/wp-cumulus-example/tagcloud.swf", "tagcloud", "240", "300", "7", "#ffffff");
Cambiar el color de fondo de la nube (#ffffff):
var so = new SWFObject("http://halotemplates.s3.amazonaws.com/wp-cumulus-example/tagcloud.swf", "tagcloud", "240", "300", "7", "#ffffff");
Cambiar el color del texto (333333 manteniendo delante el 0x tal cual está):
so.addVariable("tcolor", "0x333333");
Cambiar el tamaño del texto (12):
so.addVariable("tagcloud", "
Con esto ya estará todo listo y podrán disfrutar de su nube de tags. Espero les haya servido de utilidad, y puedan usar estos recursos. Saludos!!
Fuente: El escaparate de Rosa
No hay comentarios:
Publicar un comentario