Nube de entiquetas que se mueve en 3D para blog de blogger


Si queremos que las etiquetas de nuestro blog estén en una nube de tres dimensiones en movimiento deberemos hacer lo siguiente:



1) Vamos a Diseño
2) Edición HTML
3) Buscamos <b:section class='sidebar' id='sidebar' preferred='yes'> (tecleamos Ctrl + F para buscar más rápido)
4) Una vez localizado pegaremos justo después el siguiente código:



<b:widget id='Label99' locked='false' title='Etiquetas' type='Label'>
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content'>
&lt;object type="application/x-shockwave-flash" data="http://halotemplates.s3.amazonaws.com/wp-cumulus-example/tagcloud.swf" width="250" height="200" allowscriptaccess="always" &gt;
&lt;param name="movie" value="http://halotemplates.s3.amazonaws.com/wp-cumulus-example/tagcloud.swf" /&gt;
&lt;param name="bgcolor" value="#ffffff" /&gt;
&lt;param name="flashvars" value="tcolor=0x000000&amp;mode=tags&amp;distr=true&amp;tspeed=100&amp;tagcloud=&lt;tags&gt;
<b:loop values='data:labels' var='label'>
<a expr:dir='data:blog.languageDirection' expr:href='data:label.url' style='12'><data:label.name/></a>
</b:loop>
&lt;/tags&gt;" /&gt;
&lt;p&gt;Blogumulus by &lt;a href='http://www.roytanck.com/'&gt;Roy Tanck&lt;/a&gt; and &lt;a href='http://www.bloggerbuster.com'&gt;Amanda Fazani&lt;/a&gt;&lt;/p&gt;
&lt;/object&gt;
</div>
<b:include name='quickedit'/>
</b:includable>
</b:widget>




Si queremos modificar el tamaño tan solo debemos cambiar el 250 y 200 por los valores que queramos.

Clicamos en vista previa y si todo está bien guardamos la plantilla.


Fuente: bloggerbuster.

32 comentarios:

  1. Excelente tu informacion. Me estas dando una mano increible.

    COmo hago para identificar una url de imagen para poner un banner?

    ResponderEliminar
  2. Hola

    Pues aqui otro problema conmigo!!

    Resulta que el priemr codigo que dices busequemos me aaprece perfectamente en mi blog borrador, es mas el truco funciono perfecto, pero cuando fui a mi blog ORIGINAL la frase primera a buscar no se encuentra, NO EXISTE me sale.

    Eh de aclarar que la palntilla con la que hice la prueba esta vez no fue la misma a la del blog original.

    Espero tu ayuda!!

    Buenas Vacaciones!!

    ResponderEliminar
  3. Es posible ponerla como la de la imagen? esque me salen las letras negras y el fondo blanco, yo lo quiero alreves...

    ResponderEliminar
  4. @ Diego Botana. Hola Diego, me alegro de verdad que te vaya bien este blog para tus proyectos. Si seleccionas una imagen con el raton -> clic derecho -> copiar ruta del enlace.

    @ µðn SC µØ. Me temo que en tu plantilla hay algo que no funciona correctamente y por eso siempre te pone problemas. ¿Por que no pruebas a cambiar de plantilla? Me es practicamente imposible decirte que es lo que ocurre con tu plantilla.

    @ Swol-.-. No es posible como imagen, esta es solo en 3D. Para imagen ya tenemos el gadget original de blogger. Para cambiar el fondo mira la parte del codigo que pone:

    var so = new SWFObject("http://halotemplates.s3.amazonaws.com/wp-cumulus-example/tagcloud.swf", "tagcloud", "240", "300", "7", "#ffffff");

    Prueba a cambiar donde pone #ffffff"


    Un saludo a los tres ;)

    ResponderEliminar
  5. Hola Ana. Revisa los pasos por favor, ya que funciona correctamente y en este mismo blog puedes ver el resultado.

    Un saludo y si tienes problemas no dudes en decirle y te ayudaré en lo que pueda.

    ResponderEliminar
  6. Este comentario ha sido eliminado por el autor.

    ResponderEliminar
  7. Hola. Si has empleado el codigo de otra pagina no puedo ayudarte. Si coges el codigo de este blog si puedo ayudarte por se el codigo que es.

    Para modificar el fondo debes cambiar el #ffffff que aparece en la siguiente parte del codigo:

    var so = new SWFObject("http://halotemplates.s3.amazonaws.com/wp-cumulus-example/tagcloud.swf", "tagcloud", "240", "300", "7", "#ffffff");


    Para cambiar el color de las letras debes cambiar el 3333333 del siguiente codigo:

    so.addVariable("tcolor", "0x333333");


    Para saber los codigos de colores busca arriba en el buscador.

    Un saludo y gracias por tu consulta.

    ResponderEliminar
  8. Hay un pequeño problema, no funciona con acentos, la ñ,... es decir, signos especiales del español y que en inglés no existen.

    Sabéis si hay alguna forma de solucionarlo?

    Gracias

    ResponderEliminar
  9. Hola NCH. Tienes razón, muestra los nombres de las etiquetas pero si pulsas sobre ellas no reacciona. No sé cómo se puede solucionar. Si me entero de algo lo diré por aquí. De todas formas no queda otra que no poner acentos.

    Un saludo y gracias por comentar.

    ResponderEliminar
  10. buenas quiero he estado mirando esto y va de puta madre jejeje pero en otro blog nuevo que he echo he puesto un fondo en el blog de color verde este es el blog wwwfumacondios.blogspot.com y te agradeceria que me lo pusieras transparente el fondo de la nube, en su dia ya me hiciste mas o menos lo mismo con agregar a favoritos que ya mismo te lo estoy pidiendo para este nuevo blog jejeje si estas muy atabalado y no puedes hacermelo podrias hacer un post explicando como poner transparentes los gadgets, gracias

    ResponderEliminar
  11. ¡¡¡Goyu Goyu...!!! Lee la norma 4) por favor.

    Respecto al color de fondo tienes que cambiar el #ffffff que aparece en la siguiente parte del codigo:

    var so = new SWFObject("http://halotemplates.s3.amazonaws.com/wp-cumulus-example/tagcloud.swf", "tagcloud", "240", "300", "7", "#ffffff");

    Saludos.

    ResponderEliminar
  12. hostia quiero que soy un novato que te cagas spammmmmm que es eso tio perdon para la proxima vez no pondre la url juer vaya fallo

    ResponderEliminar
  13. lo de cambiar el fondo ya se que es ese codigo lo que nose es que poner para que salga transparente

    ResponderEliminar
  14. No pasa nada goyu. Para que sea "transparente" debes poner el mismo color que haya de fondo en la sidebar. El color debe ir como código, por ejemplo #00000

    Saludos "novato" jajaja.

    ResponderEliminar
  15. es lo que pasa ser novato jejejje yo a ti te entiendo lo que me quieres decir pero tu a mi no, te has liado con la ley del spam y no la has leido bien, a todo el blog le he puesto una imagen jpg de fondo, la plantilla era toda blanca pero al pòner la imagen de fondo en css todo es transparente sidebar,main,header o sea todo menos, le voy a poner un verde claro pa disimular de mientras que estoy solucionandolo

    ResponderEliminar
  16. jajaja. Deberías haber mencionado que tienes una imagen de fondo. Lamentablemente sólo te queda disimularlo con un color parecido, puesto que sólo puedes ponerle color y no una imagen de fondo. Al menos no sé cómo se puede hacer. Lamento no poder ayudarte.

    ResponderEliminar
  17. pues si miras el blog he puesto agregar favoritos el que me hiciste tu que era para una columna marron ahora lo he puesto en este sin cambiar nada y poom transparente y me lo hiciste tu jejjejej es curioso cuando he puesto el gadget de favo. y he visto que me quedaba bien transparente me ha alegrado el dia

    ResponderEliminar
  18. Eso es porque esa imagen (.png) que te creé la creé con fondo transparente. Por eso sólo aparecen las letras y no tiene fondo.

    El gadget de las etiquetas 3D es diferente a eso. Sólo pueda variar el color con un código de color.

    ResponderEliminar
  19. Gracias destructor. Bienvenido al blog. Muchas gracias por tu comentario y por tu visita.

    ResponderEliminar
  20. Increíble!!

    Me estás ayudando a retocar mis dos páginas y con una facilidad pasmosa, pues lo había intentado con otros y era imposible!!!Esto de las etiquetas lo había intentado varias veces y me era imposible y con esta secuencia...A LA PRIMERA!!!!

    Mil gracias,

    ResponderEliminar
  21. Gracias de nuevo "elquegrita". Me alegro que mi blog te esté sirviendo para diseñas los tuyos.

    Un saludo amigo.

    ResponderEliminar
  22. Hola ¿porque sólo me aparece una de las entradas?? :( Es decir, si se mueve y todo pero solo aparece una...

    ResponderEliminar
  23. Hola. ¿Tienes más etiquetas a parte de la que comentas?

    ResponderEliminar
  24. mil gracias..me sirvio demasiado..estaba buscando esta forma de presentar las etiquetas.
    saludos

    ResponderEliminar
  25. Hola tengo una consulta. Una vez se ha montado el Gadget, si quiero modificar el tamaño o el color ¿Donde lo puedo encontrar? o ¿como puedo hacer para modificarlo? si no me aparecen los valores ni de tamaño ni de color y ya los he buscado con artilugios expandidos y sin estos tambien.
    Agradezco la colaboracion

    ResponderEliminar
  26. Amigo mio acabo de hacer la publicacion pero lamentablemente solo me aparece Blogumulus By ETC, and more.
    Imagina dime si es que tengo que comenzar a hacer etiquedas de aqui en adelante es que saldran o que? Si es mi blog que tiene problemas.?

    ResponderEliminar
  27. No encuentro <b:section ... en mi plantilla. Cómo puedo hacer?

    ResponderEliminar
  28. Yo uso blogger y a mí lo de <b:section class='sidebar' id='sidebar' preferred='yes' no me aparece por ningún lado

    ResponderEliminar
  29. He visto que algunos han tenido problemas para que aparezca la nube
    Prueben corrigiendo el código con lo siguiente

    donde dice:

    http://halotemplates.s3.amazonaws.com/wp-cumulus-example/tagcloud.swf

    Y

    http://halotemplates.s3.amazonaws.com/wp-cumulus-example/swfobject.js

    cambien poniendo lo siguiente:


    http://sites.google.com/site/bloggerustemplatus/code/tagcloud.swf

    y

    http://sites.google.com/site/bloggerustemplatus/code/swfobject.js

    Pueden ver el resultado en www.serpadrehoy.blogspot.com

    Saludos

    ResponderEliminar
  30. Pues yo tengo un problema, solo puedo acceder a esas etiquetas si estoy dentro de mi cuenta, sino no me funciona :S

    Saludos

    ResponderEliminar