martes, 4 de octubre de 2011

Nube de Etiquetas Animadas en Blogger


Hoy voy a mostrarles como insertar una nube de etiquetas animadas en blogger.  Como pueden ver en la parte derecha la estoy estrenando.  Este tipo de widget estaba disponible sólo para WordPress, pero gracias al post de una chica llamada Amanda Kennedy podemos traerlo a nuestro blogger.

Lo primero que debemos hacer es ir al escritorio de nuestro blog en la sección "Plantilla".

Luego Hacer Clic en Edición de Html.

Una vez tengamos en frente el código Html buscamos la siguiente linea:

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


Inmediatamente después de esta linea (o donde lo necesitemos) pegamos lo siguiente:

<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://sites.google.com/site/bloggerustemplatus/code/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://sites.google.com/site/bloggerustemplatus/code/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>



Luego podemos guardar y ver la vista previa del blog, y nos debe aparecer nuestra nube animada.

Tenia semanas buscando como hacer esto, pero cada uno de los procedimientos que realizaba ninguno tenia éxito.  Pero gracias a este ya puedo disfrutarlo y lo comparto con ustedes.

Intenten colocarlo y me comentan como les fue, o si conocen algún otro procedimiento que también funcione pueden compartirlo.

8 comentarios:

technology XXI dijo...
Este comentario ha sido eliminado por el autor.
Anónimo dijo...

Excelente también tenia tiempo buscándolo...

technology XXI dijo...

Excelente aporte de verdad muchas gracias :)

fbervel dijo...

Super facíl, muchas gracias, desde ya lo pongo en mi blog. ;)

Lcdo. Simón Guzmán dijo...

Espero que te haya servido, dame el link para ver como quedo

Victor Miranda Alcántara dijo...

muchas gracias llevava tiempo buscándolo mira como a quedado: http://gamezox33.blogspot.com.es/

Simón Guzmán dijo...

Quedo muy bien

Isabel Andara dijo...

Gracias.. Quedó perfecto en mi blog.
Si lo quieres ver, te paso el enlace: http://desdemiescritorioo.blogspot.com/
Nuevamente, gracias!

Publicar un comentario

Twitter Facebook Google Plus Favorites

 
Design by Free WordPress Themes | Distribuida por: Free Blogger templates