ASÍ LO HICE: Marquesina con Imágenes/Links

¡Hola a todos! Mediante la Iniciativa My Best Friend Blogger, conocí a Helena, la autora del Blog "Basado en Hechos Reales". Si pasan a visitarla, tiene un blog muy muy bonito. Justo por eso se nos ocurrió inaugurar en conjunto esta sección llamada "Así lo hice": para poder acercar a nuestros lectores los secretos que vamos aprendiendo para mejorar las apariencias de los blogs.

En esta primera entrada, quiero contarles cómo hice la marquesina que esta bajo el título del blog. Se ven imágenes miniatura de los distintos libros leídos, y si las clickean, lleva directamente a la reseña de dicha lectura.

Para conseguirlo, lo que tuve que hacer fue lo siguiente:
1- Ir a la sección "Diseño" del Blog.
2 - Clic en "Agregar un gadget" en Cross Column. Seleccionar Gadget HTML/JavaScript.
3- Insertar el siguiente código (con las modificaciones que explicaré más abajo)

<marquee behavior="scroll" direction="left" onmouseout="this.start()" onmouseover="this.stop()" scrollamount="8" width="100%">
<a href="URL DE ENLACE 1" target="_blank"><img height="240" src="URL DE IMAGEN 1"width="160" /></a>
<a href="URL DE ENLACE 2" target="_blank"><img height="240" src="URL DE IMAGEN 2"width="160" /></a>
<a href="URL DE ENLACE 3" target="_blank"><img height="240" src="URL DE IMAGEN 3"width="160" /></a>
</marquee>

4-Aceptar.

¿Qué es lo que hay que modificar en el código?

• Donde marqué LEFT en color anaranjado, no es necesario modificar. Es la dirección en que se mueven las imágenes. El mío va para la izquierda y por eso dice left, pero también puede cambiarse por up, down o right.
• URL DE ENLACE: Se trata del link a donde quieres que te lleve la imagen al hacerle clic. En mi caso, el link de la reseña de cada libro.
• URL DE IMAGEN: La dirección de la imagen miniatura del libro. En mi caso, subí todas las imágenes a Photobucket, un sitio de alojamiento gratuito para imágenes (y videos creo), que tiene un sistema de carga bastante sencillo, y con sólo subirlo en nuestra carpeta nos brinda un enlace directo a la imagen.

Puede agregar más líneas copiando y pegando esas tres, una por cada imagen/link.

También podría modificarse el tamaño de las imágenes, cambiando los valores height y width de cada línea.

Creo que eso fue todo por ahora. Espero haber sido clara y que la entrada les resulte útil.

En el caso de que algo no se entienda o me haya faltado información, no duden en comentar!

También Los invito a pasar por http://basado-hechos-reales.blogspot.com/ donde Helena nos comenta en esta ocasión cómo modificó la plantilla de su blog que me encanta!

Nos leemos,

B-