30 de mayo de 2013

Personalizando tu blog (Ep2)- Slideshow

¡Hola Bloggeras! ¿Cómo están? ¡Espero que muy bien!
En el día de hoy les traigo el segundo episodio de Personaliza tu blog, aprenderemos como se pone un Slideshow en plantillas actualizadas y antigüas de Blogger, espero que les guste el tutorial, si tienen dudas comenten!. Besos


Haz click en "Leer esta nota completa" para ver los códigos del slider

Primero carga la última versión de jQuery y el script desde Google antes del cierre de </body>:





Ahora, añade los estilos justo antes de ]]></b:skin>  en las plantillas antiguas de Blogger o en Diseño/Avanzado/Añadir CSS en el Diseñador de las nuevas plantillas Blogger:


Habrás notado que las dimensiones del slider son 560px de ancho por 280px de alto. Puedes modificar dichas dimensiones a tu gusto, así como otras propiedades que estimes conveniente.


Puedes poner el slider en la columna principal, justo antes de los artículos. En las plantillas viejas de Blogger, esto es justo bajo <div id='main-wrapper'>, y en las nuevas bajo de <div class='main-outer'>


 Nota: Este código con condicionales mostrará el slider sólo en la página principal, con 5 diapositivas. Puedes quitar o añadir más, aunque no es recomendable tener más de 6 porque puede retardar demasiado la carga de tu blog. Para el código de cada diapositiva, tienes que modificar: (1) el enlace que dirige al post que quieras destacar; (2) el título (title) de dicho post; (3) El enlace directo (URL) a la imagen que quieras poner, que debe ser acorde a las dimensiones del slider (560×280 en este caso).

Info: CB

4 comentarios:

  1. Muchísimas gracias por el Slidershow!!

    ResponderEliminar
  2. Hola :) Quisiera saber si el Jquery es obligatorio , y donde puedo descargarlo , si tiene virus o algo asi :) , Gracias

    ResponderEliminar
  3. HOLA MUY BUENO EL TUTO PERO TENGO UN PROBLEMA NO USO PLANTILLAS DE BLOGGER Y NO ME SALEN NINGUNO DE ESTOS CÓDIGOS QUE PUEDO HACER

    -< div id='main-wrapper' >
    -< div class='main-outer' >

    ResponderEliminar

¡ATENCIÓN: LEE LO SIGUIENTE ANTES DE COMENTAR!

*Si vas a comentar, puedes usar tu cuenta de Google, OpenID, Nombre/Web, y Anónimo
*No Insultar
*No hagas SPAM, Números telefónicos ni Emails
No dejes enlaces a otros blogs, números telefónicos ni correos electrónicos.

¡Gracias!
Att: Staff Club Bloggeras

Categorías

- AgusSweet' -Karii ♥ -SuzettStronger♥' 'Bloggeras' "Personaliza tu Twitter" adelanto Adele aniversario avisos awards BA Bases Bella Thorne bg Biblioteca Blends Blogger Bloggera Del Mes Britney Spears By *.* Memii By Angie By AriiCa'' By Bale By Cata By Deanase By Fatiima By Nievely By Paaz By ProdigyApple By Sweet Perfect By Vale By Venusita By: Ana Laura-JBMFC By: Ayee♥ By: Emii By: Venusita By:Ali♥ By:Leslye Diaz Cyrus Cami Carteles celulares Chicas Color Complementos Concurso coral Crea renders Cursores Demi Lovato Descargas Diana Gu' diseño Ecodesigners Entrega de Pedidos escritoras Especial Famosos Facebook Famosos Flash fonts Foro Fotos GIF gratis Header header psd Header PSD Ariana Grande header psd Demi Lovato hellow iconos Imágenes Imagenes PNG IsOnee Jessie J Katy Perry Laura layout blogger Magazine Manchas Maquillaje Marceliita ♥ Max Rodriguez Me Presento AriiCa'' Me Presento Deanase Me Presento Fatiima Me Presento Paulaah Mega Regalo Mickey Miika♥ Miley Cyrus Minnie Musica navidad NickTVUP Noticias Nueva Coweb Olivia Holt Pack Pandita Para tu blog Para tu Pc Pequeñas Mentirosas Personalizando tu blog PhotoPack photoscape photoshop PhotoshopHQ Piensa verde Pngs Por Cris*-*-* Portadas Post Premades premios Presentacion Programas proximamente Proyecto Verde PSC PSD Psd GomezLove Recursos Regalazos Regalos Reglas Retos rush-designs.fangalaxy.org saarah´ SaaRaH´ Me presento Regalazos samii Keller Screenshots shara marie Sicóloga Rossana Sidebar skins Sofía Dreamer sorpresas Styles Team telenovelas Textos PNG Texturas Themes Tips Tips. Moda Top Tutoriales TV twitter v-blog Vacaciones Video Tutorial videoblog Videos Vídeos votaciones voten por IsOnee para Bloggera del Mes. wallpapers walls Wordpress

LinkWithin

Related Posts Plugin for WordPress, Blogger...