<center> <a href="http://tutorialesbloogerkiradober.blogspot.com.es /" target="_blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi3BUZ_ethXFMNWOFOVMUg0XNDXwbV7wZTICHumyjVNzknI8F2R1qBl6xuyzrgeNz48LKTVazHrLPMQTM7yj_R0wb__4A3vYnDK1h3TV7FMhTqDGB4rq76L5lfXVWbkkNsv_ItOIVRliNs/s1600/549.jpg"/></a></center>  

Ahora para instalarlo tienes que seguir los sigientes pasos:

1º Entramos en Diseño

                                                               

2º Añadir un gadget

                                                         

3º Buscamos el elemento  HTML/Javascript

                                                                               

4º Copias el contenido de este codigo que te dejo a continuacion en el interior.

<div align="center">

</marquee>

</div>

Esto que vemos no es más que un pasatiempo de esos que surgen a raíz de algo que vemos y decidimos probar, el resultado es una pequeña galería que podemos añadir al footer o alguna página estática.

No hay límite de imágenes y aunque en el ejemplo el borde es de color gris en cualquier blog las imágenes se mostrarán con el borde que tengamos definido para las imágenes de los post, si no tuviéramos borde entonces se mostraría tal y como vemos en el ejemplo.

/* SLIDESHOW start Ayudadeblogger*/
    #slider-holder{width:900px;height:200px;overflow:hidden;margin-left:-20px; margin-right:10px; padding:0} #s3slider{width:900px;height:660px;position:relative;overflow:hidden}
    #s3sliderContent{width:900px;position:absolute;top:0;margin-left:0}
    .s3sliderImage{float:left;position:relative;display:none}
    .s3sliderImage span{position:absolute;left:0;font-weight:700;font-size:12px;color:#fff;height:45px;width:900px;background-color:#4e4d3c;filter:alpha(opacity=70);-moz-opacity:0.7;-khtml-opacity:0.7;opacity:0.7;display:none;bottom:0;padding:10px}
    .s3sliderImage span a.featured-title:link,.s3sliderImage span a.featured-title:visited{color:#FFF;font-size:14px;padding:0 0 2px}
    .s3sliderImage span a.featured-title:hover{color:#999}
    .s3sliderImage span a:link,.s3sliderImage span a:visited{color:#888}
    .s3sliderImage span a:hover{color:#555} 

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.js' type='text/javascript'/>
<script type='text/javascript'>
<!--//--><![CDATA[//><!--
(function($){
    $.fn.s3Slider = function(vars) {  
        var element     = this;
        var timeOut     = (vars.timeOut != undefined) ? vars.timeOut : 4000;
        var current     = null;
        var timeOutFn   = null;
        var faderStat   = true;
        var mOver       = false;
        var items       = $("#" + element[0].id + "Content ." + element[0].id + "Image");
        var itemsSpan   = $("#" + element[0].id + "Content ." + element[0].id + "Image span");
        items.each(function(i) {
            $(items[i]).mouseover(function() {
               mOver = true;
            });
            $(items[i]).mouseout(function() {
                mOver   = false;
                fadeElement(true);
            });
        });
        var fadeElement = function(isMouseOut) {
            var thisTimeOut = (isMouseOut) ? (timeOut/2) : timeOut;
            thisTimeOut = (faderStat) ? 10 : thisTimeOut;
            if(items.length > 0) {
                timeOutFn = setTimeout(makeSlider, thisTimeOut);
            } else {
                console.log("Poof..");
            }
        }
        var makeSlider = function() {
            current = (current != null) ? current : items[(items.length-1)];
            var currNo      = jQuery.inArray(current, items) + 1
            currNo = (currNo == items.length) ? 0 : (currNo - 1);
            var newMargin   = $(element).width() * currNo;
            if(faderStat == true) {
                if(!mOver) {
                    $(items[currNo]).fadeIn((timeOut/6), function() {
                        if($(itemsSpan[currNo]).css('bottom') == 0) {
                            $(itemsSpan[currNo]).slideUp((timeOut/6), function() {
                                faderStat = false;
                                current = items[currNo];
                                if(!mOver) {
                                    fadeElement(false);
                                }
                            });
                        } else {
                            $(itemsSpan[currNo]).slideDown((timeOut/6), function() {
                                faderStat = false;
                                current = items[currNo];
                                if(!mOver) {
                                    fadeElement(false);
                                }
                            });
                        }
                    });
                }
            } else {
                if(!mOver) {
                    if($(itemsSpan[currNo]).css('bottom') == 0) {
                        $(itemsSpan[currNo]).slideDown((timeOut/6), function() {
                            $(items[currNo]).fadeOut((timeOut/6), function() {
                                faderStat = true;
                                current = items[(currNo+1)];
                                if(!mOver) {
                                    fadeElement(false);
                                }
                            });
                        });
                    } else {
                        $(itemsSpan[currNo]).slideUp((timeOut/6), function() {
                        $(items[currNo]).fadeOut((timeOut/6), function() {
                                faderStat = true;
                                current = items[(currNo+1)];
                                if(!mOver) {
                                    fadeElement(false);
                                }
                            });
                        });
                    }
                }
            }
        }
        makeSlider();
    };
})(jQuery);
//--><!]]></script>
<script type='text/javascript'>
$(document).ready(function() {
$(&#39;#s3slider&#39;).s3Slider({
timeOut: 4000
});
});
</script>

<div id='slider-holder'>
<div id='s3slider'>
<ul id='s3sliderContent'>
<li class='s3sliderImage' style='display: list-item;'>
<a href='https://www.blogger.com/blogger.g?blogID=7639838625886183004#editor/target=post;postID=6998880464736570415;onPublishedMenu=allposts;onClosedMenu=allposts;postNum=1;src=link'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEik5dDoJ2YxhF77_6U0yCA0Z98JpgonKnsuYXJdEPDk-_wHUprXV_jGLie3vk7SIUokXtAjJQMXd4CcjrYh_M83v5d-sQbY7xsepWfNso01G7vG9gopqQxj_0r_LpDARoJJJzlledNG4Bx8/s1600/7BA_600x300.jpg' style='width: 600px; height: 300px;'/></a>
<span style='display: block;'>
<a class='featured-title block' href='https://www.blogger.com/blogger.g?blogID=7639838625886183004#editor/target=post;postID=6998880464736570415;onPublishedMenu=allposts;onClosedMenu=allposts;postNum=1;src=link'>formulario de contactos de blogger</a><br/>
formulario de contactos de blogger en una pagina
</span>
</li>
<li class='s3sliderImage' style='display: none;'>
<a href='https://www.blogger.com/blogger.g?blogID=7639838625886183004#editor/target=post;postID=3063257186668154408;onPublishedMenu=allposts;onClosedMenu=allposts;postNum=3;src=link'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhVNqYmOmKvauszHJtAqy5xLQLBbYBSoZM9mJkMOjk568uAzoIj9O_cECEqyxV4ZA9AdexJFne5F8IuZ59d_6318jc2n3rC8VhRcP3aCXgis6BI-ztz8NQMyjF1sitzTPNl7lVaiILPI87G/s1600/419_600x300.jpg' style='width: 600px; height: 300px;'/></a>
<span style='display: none;'>
<a class='https://www.blogger.com/blogger.g?blogID=7639838625886183004#editor/target=post;postID=3063257186668154408;onPublishedMenu=allposts;onClosedMenu=allposts;postNum=3;src=link'>caja de aviso sencilla </a><br/>
caja de aviso sencilla para tu blog 
</span>
</li>
<li class='s3sliderImage' style='display: none;'>
<a href='https://www.blogger.com/blogger.g?blogID=7639838625886183004#editor/target=post;postID=9066327521844465093;onPublishedMenu=allposts;onClosedMenu=allposts;postNum=2;src=link'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjdw8mZvsFz4SROR7-iFBnhy7-AaPTCqNYegkFKCAA-Z65GkirQ5vdiz9cbR4oMgZ3asGNbmo_kILx4mC9yb9FjSdoomMQbi2VBDHjBTImproOsRJ2lf-nsEZgyyHSud5cpwP1cxoX2vZd2/s1600/850_600x300.jpg' style='width: 600px; height: 300px;'/></a>
<span style='display: none;'>
<a class='featured-title block' href='https://www.blogger.com/blogger.g?blogID=7639838625886183004#editor/target=post;postID=9066327521844465093;onPublishedMenu=allposts;onClosedMenu=allposts;postNum=2;src=link'>Slideshow para la parte inferior de tu blog </a><br/>
Slideshow para la parte inferior de tu blog ?.....
</span>
</li>
<li class='s3sliderImage' style='display: none;'>
<a href='https://www.blogger.com/blogger.g?blogID=7639838625886183004#editor/target=post;postID=7792332674002187739;onPublishedMenu=allposts;onClosedMenu=allposts;postNum=4;src=link'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh6861BnspyY2Hhz1WK6gp1AF8V63UaP3rm0X3WD4vrJQQgAWozJEHr2H40s232ET7aEZVTUygXY2Ags_Wo4Z4iVNBHJLsIkr0DDmwHxavb_bvbDSuub9rqnWygczOFmx0OLD24RdKUpPjj/s1600/ani-matrix_600x300.jpg' style='width: 600px; height: 300px;'/></a>
<span style='display: none;'>
<a class='https://www.blogger.com/blogger.g?blogID=7639838625886183004#editor/target=post;postID=7792332674002187739;onPublishedMenu=allposts;onClosedMenu=allposts;postNum=4;src=link'>buscador de Google sólo de imágenes</a><br/>
buscador de Google sólo de imágenes
</span>
</li>
<li class='s3sliderImage' style='display: none;'>
<a href='https://www.blogger.com/blogger.g?blogID=7639838625886183004#editor/target=post;postID=515691632471568827;onPublishedMenu=allposts;onClosedMenu=allposts;postNum=9;src=link'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhjCe_iwz8EJ0a0uXTOggEPUOca3OZYkE-UtXGX8I4niS_eohXjJ_C5IipAED0HVQ5MMC3axF0xkHJkYRhvKcC_slvQci-0LTppVWs-hmgKFlo5M89yxfJ4Uy2K5QgL-UhU8vJVHgamfUDh/s1600/caveira+de+fogo+quebrando+guitarra+577_600x300.jpg' style='width: 600px; height: 300px;'/></a>
<span style='display: none;'>
<a class='https://www.blogger.com/blogger.g?blogID=7639838625886183004#editor/target=post;postID=515691632471568827;onPublishedMenu=allposts;onClosedMenu=allposts;postNum=9;src=link'>Imagen que aparece </a><br/>
Imagen que aparece con efecto deslizante...
</span>
</li>
<li class='clear s3sliderImage'/>
</li></ul>
</div>
</div>

Fuente:  Ayudadeblogger

Fecha:31/12/2016

Publicado por: