Rss

07 octubre 2011

Tutorial [Blogger]: Slideshow para Blog (Mostrar contenido destacado)





Este es otro pedido de tutorial y es para Pashis, quien me lo pidió en la Cbox, quería saber como poner el
slideshow que tengo en mi blog, (el de arriba de las entradas) y aquí esta:







Primero hay que colocar los scripts:
Diseño>> Edición de HTML y antes de </head> pegamos el siguiente código:

Código (da clic para ver el código)


Ahora los estilos, antes de  ]]></b:skin> pegamos esto:
Código (da clic para ver el código)


Por último, pegamos el código que nos mostrará las imágenes, guardamos y ahora nos vamos a Elementos de página >>> Añadir HTML/Javascript
<div id='featured'>

<a href='URL del enlace'><img rel='foto1' src="URL de la imagen" style='width:490px; height:238px;'/></a>
<span class='orbit-caption' id='foto1'>DESCRIPCIÓN.</span>

<a href='URL del enlace'><img rel='foto2' src="URL de la imagen" style='width:490px; height:238px;'/></a>
<span class='orbit-caption' id='foto1'>DESCRIPCIÓN</span>

<a href='URL del enlace'><img rel='foto3' src="URL de la imagen" style='width:490px; height:238px;'/></a>
<span class='orbit-caption' id='foto1'>DESCRIPCIÓN.</span>

<a href='URL del enlace'><img rel='foto4' src="URL de la imagen" style='width:490px; height:238px;'/></a>
<span class='orbit-caption' id='foto1'>DESCRIPCIÓN.</span>


</div>

Sustituimos lo que tenemos en rojo con las url de las imagenes, las direcciones y las descripciones, que queramos, para que queden como el slideshow que esta en este blog.
Guardamos y listo, tenemos nuestro slideshow!!


Slideshow perteneciente a ciudadblogger.com


Espero que les sea de ayuda, cualquier duda, sugerencia, queja o pedido en el cbox o dejen un comentario en las entradas.

See ya!!



Fuente: ciudad blogger

5 Comentarios:

Elaine dijo...

como se hace para que el slider solo aparezca en la pagina de inicio, y no cuando clickas sobre entradas y tags¿¿?

FLAV dijo...

Hola, quisiera que el slideshow estuviera solo en una entrada del blog. Es posible?.
Muchas gracias

CID_VII dijo...

Hola, he probado muchos slideshow y este es el que realmente buscaba. Muchas gracias por compartir el código, pero me gustaría unirme a la pregunta de Elisa para que el slideshow solo se vea en la pagina principal. Saludos!

agustin dijo...

no consigo que me visualice las imagenes
no entiendo el enlace si que funciona y el titulo tambien pero las imagenes (las tengo en picassa) no

Hiro Jung dijo...

Hola! Para quienes quieran solo el slide en una entrada o para que se les haga más fácil, pueden checar este otro slide q es más fácil de poner :D
http://hirock-gamer2.blogspot.mx/2012/03/tutorial-blogger-slideshow-de-picasa.html

 

Este sitio se ve mejor en Google Chrome y Mozilla. Gracias por tu Visita. Si quieres ayudarme y ayudar al blog, da clic en los anuncios. No olvides Comentar y Seguirme! Gracias!!
ir arriba