Hace tiempo descubrimos un truco muy interesante que nos permitía mostrar las etiquetas del blog en forma de nube 'flotante', que además, tenía movimiento y resultó ser una completa novedad en blogger.
En esta otra entrada voy a enseñarte a incluir una nube de enlaces en el blog, sin movimiento, pero totalmente personalizable y bastante atractiva.
La instalación es sencilla ya que únicamente requiere el uso de un gadget o elemento de página y además, los colores o tamaños podrán editarse.
Pega el código necesario:
<div id="blnub">
<a href="DIRECCION PAGINA" class="blink1">TITULO</a>
<a href="DIRECCION PAGINA" class="blink2">TITULO</a>
<a href="DIRECCION PAGINA" class="blink3">TITULO</a>
<a href="DIRECCION PAGINA" class="blink4">TITULO</a>
<a href="DIRECCION PAGINA" class="blink1">TITULO</a>
<a href="DIRECCION PAGINA" class="blink3">TITULO</a>
<a href="DIRECCION PAGINA" class="blink2">TITULO</a>
<a href="DIRECCION PAGINA" class="blink4">TITULO</a>
<a href="DIRECCION PAGINA" class="blink1">TITULO</a>
<a href="DIRECCION PAGINA" class="blink3">TITULO</a>
<a href="DIRECCION PAGINA" class="blink4">TITULO</a>
<a href="DIRECCION PAGINA" class="blink1">TITULO</a>
<a href="DIRECCION PAGINA" class="blink3">TITULO</a>
</div>
<style>
#blnub{text-align:center; padding:5px;}
#blnub a{text-decoration:none;}
#blnub a:hover{text-decoration:none; color: #CC3366;}
#blnub .blink1{font-size:14px; color:#3399CC;}
#blnub .blink2{font-size:20px; color:#3366CC;}
#blnub .blink3{font-size:16px; color:#006699;}
#blnub .blink4{font-size:15px; color:#339966;}
</style>
En cada línea reemplaza DIRECCION PAGINA por la dirección del blog, la web o el artículo al que conducirá el enlace y TITULO por el título que aparecerá en la nube.
Si deseas añadir más enlaces a la nube, inserta líneas como esta (siempre antes del cierre </div>) :
<a href="DIRECCION PAGINA" class="blink3">TITULO</a>
Teniendo en cuenta que blink3 es un estilo distinto a blink1, blink2 y blink4 por lo que puedes editar el valor 3 para cambiar el aspecto del enlace.
Puedes cambiar el color de los enlaces editando el valor hexadecimal de las líneas 'color:#3399CC;' y haciendo uso de la tabla de colores.
Guarda el gadget para terminar.
Muchas gracias por el truco, me viene bien para mi blog, me gustan tus indicaciones porque son claras.
me gusto, ya esta en mi blog :D
Muchas gracias a ti, Caiman, por el comentario y por haber instalado la nube.
Me alegra mucho que te guste, CHiCken, aunque no pude verlo en tu blog :S.
jajajja esta en la sidebar, MY BLOGGER, pero como esta entre tabs (pestañas) en donde dice Etiquetas.
Soy seguidora de tu blog. Por fin tengo mi nube!!!
Gracias
Cierto CHiCken! Gracias por instalarlo.
¡Qué bueno Concha! Y veo que has podido editar el color.