Crear Slideshow gratis para Blogger

Bueno, después de buscar un poco y gracias a las indicaciones de un amigo (gracias Ivan!), he encontrado una forma de añadir un slideshow con jquery a mi blog :) .

Las instrucciones las he encontrado en la siguiente dirección:
http://www.spiceupyourblog.com/2012/03/simple-stylish-jquery-image-slideshow.html

De todas formas las reescribo aquí, ya que algún paso esta desactualizado.
------------------------

En primer lugar en el apartado Plantilla, editamos el HTML.

Buscamos el código:

]]></b:skin>

Y copiamos este código justo encima:

/* Start Slider Code From http://www.spiceupyourblog.com/ */
ul.bjqs{position:relative; list-style:none;padding:0;margin:0;overflow:hidden; display:none;}
li.bjqs-slide{display:none;position:absolute;}
ul.bjqs-controls{list-style:none;margin:0;padding:0;z-index:9999;max-width:100%;}
ol.bjqs-markers{list-style:none;margin:0;padding:0;z-index:9999;}
ol.bjqs-markers li{float:left;}
p.bjqs-caption{display:block;max-width:96%;margin:0;padding:2%;position:absolute;bottom:0;background:rgba(0,0,0,0.7);color:#fff;-moz-border-radius: 6px;-webkit-border-radius: 6px;-moz-box-shadow: 4px 4px 4px #dddddd;-webkit-box-shadow: 4px 4px 4px #dddddd;}
}
/* End Slider Code From http://www.spiceupyourblog.com/ */

Después buscamos:

</head>

Y copiamos este código justo encima (los números en naranja se pueden cambiar, son el ancho y largo del slideshow):

<!-- Start Slider Code From http://www.spiceupyourblog.com/ -->
<script src='http://code.jquery.com/jquery-1.6.1.min.js' type='text/javascript'/>
<script src='http://yourjavascript.com/9921010228/basic-jquery-slider.min.js' type='text/javascript'/>
<script type='text/javascript'>
$(document).ready(function(){
$(&#39;#my-slideshow&#39;).bjqs({
&#39;width&#39; : 940,
&#39;height&#39; : 340,
&#39;showMarkers&#39; : true,
&#39;showControls&#39; : true,
&#39;centerMarkers&#39; : false
});
});
</script>
<!-- End Slider Code From http://www.spiceupyourblog.com/ -->

Guardamos la plantilla.

Ahora nos vamos al apartado Diseño y añadimos un gadget (encontré una foto ilustrativa):
http://3.bp.blogspot.com/-OioL33vVir8/UOr8-w1QTbI/AAAAAAAADx4/bxEB0cIMcWs/s1600/A%C3%B1adir+nuevo+gadget.jpg

Añadir HTML/Javascript y dentro copiamos este código (en naranja tenéis el link de las fotos, las podéis cambiar para poner vuestras fotos, siempre que coincidan con el tamaño indicado en el código anterior):

<div id="my-slideshow">
<ul class="bjqs">
<li><img title="This is a caption." src="http://1.bp.blogspot.com/-6VtyHuKWXec/T00nRHDBfKI/AAAAAAAAFwQ/FwyFSdzpq5I/s1600/slider-image1.jpg"/></li>
<li><img title="This is a another caption." src="http://1.bp.blogspot.com/-PpkbSLY_9TQ/T00nR_BmGGI/AAAAAAAAFwY/B-WYpsKXJTM/s1600/slider-image2.jpg"/></li>
<li><img title="This is a another longer caption." src="http://2.bp.blogspot.com/-iywK-OLiBio/T00nPynnhOI/AAAAAAAAFwI/Sic5_siiUb0/s1600/slider-image-3.jpg"/></li>
<li><img title="This is a another much longer caption." src="http://1.bp.blogspot.com/-07WMvWuPh28/T00nUTHpPZI/AAAAAAAAFwg/zQp89S1-5fY/s1600/slider-image4.jpg"/></li>
<li><img title="This is a another longer caption that can be the lenght of the image or even longer onto the next line." src="http://2.bp.blogspot.com/-c5hZdFVFe1E/T00nVcWvScI/AAAAAAAAFwo/t7hX91c07Xc/s1600/slider-image5.jpg"/></li>
</ul>
</div>

Espero que os guste este mini tutorial ;) .