5

Blogumus: un flash animado (Nube de etiqueta)

Una forma bonita de colocar una nube de etiquetas en forma que se mueve en forma circular la encontré en http://www.bloggerbuster.com, y me pareció espectacular.........
Para lograrlo se debe buscar la siguiente linea:
    <b:section class='sidebar' id='sidebar' preferred='yes'>
Luego pegan este trozo de código:
<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(&quot;http://halotemplates.s3.amazonaws.com/wp-cumulus-example/tagcloud.swf&quot;, &quot;tagcloud&quot;, &quot;240&quot;, &quot;300&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>
Personalización de Blogumus
  En esta instalación por defecto, Blogumus incluye los siguientes variables:
    * Width is set to 240px (Ancho está ajustado a 240px)
    * Height is set to 300px; (Altura se establece en 300px;)
    * Background color is white (Color de fondo es de color blanco)
    * Test color is grey (Prueba de color es gris)
    * Font size is "12" (Tamaño de la fuente es "12")
Si prefiere hacer su widget más amplio, más corto, cambiar el esquema de color, etc, tendrá que hacerlo por la edición de diversas partes del código. Voy a ir a través de estas opciones en el orden en que aparecen en el código widget. Edición de anchura y altura Las variables de anchura y la altura se encuentran en esta línea de la secuencia de comandos:
    var so = new SWFObject("http://halotemplates.s3.amazonaws.com/wp-cumulus-example/tagcloud.swf", "tagcloud", "240", "300", "7", "#ffffff");
La anchura (actualmente 240) se destaca en rojo, mientras que la altura (300px por defecto) se destaca en azul.  Estos valores numéricos especificar la anchura y altura en píxeles, por lo que estos pueden alterar de que prefiera. Edición de color de fondo Puede cambiar el color de fondo de blanco a cualquier otro color por alterar el valor hexadecimal en la misma línea:
    var so = new SWFObject("http://halotemplates.s3.amazonaws.com/wp-cumulus-example/tagcloud.swf", "tagcloud", "240", "300", "7", "#ffffff");
Por ejemplo, si usted prefiere un fondo de color rojo brillante, puede sustituir # ffffff con # FF0000. El texto está ajustado a la pantalla como gris oscuro (valor hexadecimal # 333333). Usted puede modificar esta variable en la línea siguiente:
    so.addVariable("tcolor", "0x333333");
Tenga en cuenta que "TColor" Flash es una variable y no incluye el habitual hash símbolo de códigos de color hexadecimal. Asegúrese de sustituir sólo a los números! Ajustar el tamaño de la fuente El máximo tamaño de la fuente de las etiquetas se especifica en esta línea:
    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>");
Puede modificar esto para asegurarse de etiquetas se muestran en una mayor o menor fuente, si lo prefiere cambiar por "12" a una mayor o menor número. Mientras que cualquiera de estos cambios, usted debería ser capaz de vista previa de su widget y tener la certeza de que su nueva elección de color, dimensiones y antecedentes son adecuados para sus necesidades.

Si existe algún enlace o Link malo, avísame

5 Comentarios:

Patán dijo...

Fuí a tu blog a ver como quedó y está bastante bien.

Recursos para tu blog - Ferip - dijo...

Vine e verte!
No pude comentar arriba.
Todo bien???
Un abrazo!

Ya empecé a trabajar...

Sol dijo...

Excelente herramienta, muy original a la hora de mejorar nuestros sitios.
Saludos

Patán dijo...

Gracias a ti marisol por la visita

Patán dijo...

Feri. que gusto saber de ti.....

Déjame tu comentario......

 
ir arriba