14 de octubre de 2008

Nube de Tags Móvil

AVISO: El archivo .swf que necesita la nube ya no está alojado en el servidor, para arreglar la nube recomiendo visitar oloblogger.blogspot.com

Acabo de actualizar el blog incluyendo una nueva nube de tags móvil. Este widget sólo estaba disponible para WordPress pero gracias a Blogger Buster podemos incluirlo en nuestro blogger.

Vamos a Diseño > Edición de HTML y buscamos este fragmento de código:
<b:section class='sidebar' id='sidebar' preferred='yes'>
Y pegamos este código a continuación:
<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> Design by <a href='http://muxoyuyo.blogspot.com'>muxoyuyo</a></div>
<script type='text/javascript'>
var so = new SWFObject(&quot;http://halotemplates.s3.amazonaws.com/wp-cumulus-example/tagcloud.swf&quot;, &quot;tagcloud&quot;, &quot;165&quot;, &quot;200&quot;, &quot;7&quot;, &quot;#ffffff&quot;);
// uncomment next line to enable transparency
//so.addParam(&quot;wmode&quot;, &quot;transparent&quot;);
so.addVariable(&quot;tcolor&quot;, &quot;0x333333&quot;);
so.addVariable(&quot;mode&quot;, &quot;tags&quot;);
so.addVariable(&quot;distr&quot;, &quot;true&quot;);
so.addVariable(&quot;tspeed&quot;, &quot;100&quot;);
so.addVariable(&quot;tagcloud&quot;, &quot;<tags><b:loop values='data:labels' var='label'><a expr:href='data:label.url' style='12'><data:label.name/></a></b:loop></tags>&quot;);
so.addParam(&quot;allowScriptAccess&quot;, &quot;always&quot;);
so.write(&quot;flashcontent&quot;);
</script>
<b:include name='quickedit'/>
</div>
</b:includable>
</b:widget>
Para cambiar el tamaño de la nube, modificamos:
&amp;quot;165&amp;quot;, &amp;quot;200&amp;quot;,
Para cambiar el color del fondo, modificamos:
&amp;quot;#1D3443&amp;quot;);
En esta página podemos seleccionar un color o poner el código de fondo de nuestro propio blog, si no estamos seguros de si es o no el color que queremos, podemos ir poniendolo para que nos muestre el resultado. Código de Colores en HTML

Para cambiar el color del texto, modificamos:
&amp;quot;0xffffff&amp;quot;);
Nota: Para poder poner código HTML como texto plano en una entrada de blog de blogger es necesario poner &lt;b:widget... en vez de <b:widget... En nosetup.org podemos pegar el código html y nos lo combierte automáticamente a texto plano para su copy/paste.

10 comentarios:

  1. joeeeer, estás hecho un artista. ¡Gracias por tus consejos (y por el trabajo en la web de ´Jóvenes :-))!
    Nos vemossss

    ResponderEliminar
  2. Hola me dice que da un error en el "label99"

    ResponderEliminar
  3. Agrega las etiquetas desde Diseño > Elementos de la página > Agregar widget > etiquetas.

    Una vez las tengas, vete a Edición de HTML y busca el label, y cuando vallas a reemplazarlo en vez de poner label99, dejalo con el nombre que tengas por defecto.

    Si te sigue fallando me avisas.

    Un saludo.

    ResponderEliminar
  4. Hola a todos, estoy desesperado he probado la nube de tags de mil maneras y sigue sin verse con movimiento, me salen dos enlaces si acercas el puntero pero nada más. Me podeis ayudar, os dejo una imagen de como me quedó: http://img21.imageshack.us/img21/6930/etiqueta.jpg

    Gracias por ayudarme :-)

    ResponderEliminar
  5. Cómo puedo ayudarte?, que tipo de error te sale? al poner el código es todo correcto pero no aparece nada? Prueba a reducir el número de etiquetas, a franciscoiba ya le funciona.

    Un saludo.

    ResponderEliminar
  6. Vale! lo voy a intentar con menos etiquetas, cuántas más o menos dejo?

    ResponderEliminar
  7. Hola atodos. Antes que nada gracias por el aporte. A mi me ha funcionado. La diferencia es que tuve que seleccionar "expandir plantillas de artilugioss", si no me daba error. Espero que esto les ayude.

    ResponderEliminar
  8. la acabo de ocupar aunque en explorer da mucha lata, firefox si funciona bien al parecer, pero gracias por poner la guia para ponerla

    ResponderEliminar
  9. A ti por leerme, si necesitas más ayuda no dudes en preguntarme. Un saludo.

    ResponderEliminar