05 julio 2016

CÓMO PONER UN SLIDESHOW EN EL BLOG

Hace unos días alguien me preguntaba por un tutorial para crear un slideshow pero al ir a responder me di cuenta de que era un poco largo para hacerlo en un comentario, así que pensé que podía publicarlo en el blog por si a alguien más le resulta útil.

Para quien no sepa de lo que hablamos, un slideshow es una presentación de imagenes que se van sucediendo una tras otra. Podéis ver un ejemplo en mi página de la tienda.



Poner un slideshow en el blog es muy sencillo, como siempre, lleva algo más de tiempo personalizarlo a nuestro gusto y adecuarlo a la estética de nuestra página. Por supuesto que hay muchos tipos o estilos de slideshows y cada uno de ellos acepta modificaciones así que yo sólo os voy a hablar del que uso: slideshow con jquery.

El jquery es, por decirlo de forma sencilla, una biblioteca con lenguajes de programación para crear páginas dinámicas. Si os gusta trastear con vuestros blogs es interesante saberlo ya que algunos códigos nos piden que tengamos jquery implementado en nuestra página. Y hacerlo es así de fácil:

PLANTILLA >> EDITAR HTML >> CONTROL+F (para que se nos abra el buscador) >> buscamos /b:skin >> copiamos esto justo detrás sin las rayas rojas //:



<//script src='http://ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.min.js' type='text/javascript'/>;


Ahora vamos a instalar nuestro código HTML. Vamos a DISEÑO >> añadir HTML en el lugar que queramos, en mi caso debajo de la cabecera y copiamos el enlace que podemos descargarnos en este botón:




 Sustituimos lo que está en rojo (URL, URL_IMAGEN Y TÍTULO) y repetimos esta línea tantas veces como imágenes queramos que tenga nuestro slideshow:



Después sólo nos queda trastear con el estilo para cambiar el tipo y tamaño de la letra, el color, la enmarcación de nuestra galería y todo lo que se nos ocurra.

Este es mi slideshow pero con jquery podéis encontrar un montón de estilos, todos ellos personalizables, en este enlace. Una vez que hayáis seleccionado el tipo de slideshow que queréis y lo hayáis modificado a vuestro gusto sólo tenéis que descargar el código y llevarlo a vuestra página.







Sígueme en:



http://eepurl.com/bct2DT

9 comentarios:

  1. ¡Hola, Rosana! Pues está muy bien saberlo,porque no tenemos un slideshow en nuestro blog, y como en tu tienda, en la nuestra también estaría muy bien. A ver si tenemos un huequito e investigamos más. ¡Muchas gracias por tus conocimientos!

    Muchos besos de las dos.

    J&Y

    ResponderEliminar
  2. Muchas gracias por estas clases de programación para dummies, menos mal que alguien nos lo explica sencillito...

    ResponderEliminar
  3. Hola Rosana...a mi me encanta trastear en la apariencia de mi blog...y sabes? me encanta como lo explicas!!!
    Voy a ojear a conciencia esta sección tuya, además de que me encanta tu blog, apariencia y contenidos por supuesto!!!
    Un abrazo.

    ResponderEliminar
  4. Hola Rosana, yo los usaba en mis épocas de Joomla, pero con el blogger ando super perdida... Además hace años que no cojo un manual de CSS, me quedé en el HTML de los 90... Aunque este verano tengo pensado ponerme las pilas y tu blog ma hace que coja más ganas jejeje por cierto, he encontrado un blog que te deja probar el código en directo, quizás te sea útil.

    Para no ponerte el enlace te digo lo que debes poner en la barra de búsqueda de Google: probar código - código todo código :)

    ¡Saludos!

    ResponderEliminar
  5. Así es como conocí tu Blog,Rosana,por los Tutoriales,jajajaja.
    Esto del slideshow lo tengo pensao,pero al final entre una cosa y otra,no lo hago nunca! Me lo voy a apuntar en grande,jajaja,a ver si así me pongo a ello.
    Gracias!! Se te dan muy bien estos Tutos,sección fija ya!jajajaja ;)
    Besitos! :)

    ResponderEliminar
  6. Muchas gracias por el tutorial!!!
    Me lo dejaré apuntado para cuando pueda porque esta semana ya desconecto que tengo que ponerme a darle duro a la opo....
    XOXO

    ResponderEliminar
  7. Gracias por compartir la información.
    Besos.

    ResponderEliminar
  8. Hola Como estas? me gustaría probar el slideshow pero el link de descarga esta caído, Podrías volverlo a subir? gracias de antemano.

    ResponderEliminar
    Respuestas
    1. Hola, yo lo tengo implementado en esta página y me funciona ---> http://mamichufletashop.blogspot.com.es/

      Un saludo!

      Eliminar

Related Posts Plugin for WordPress, Blogger...