Vamos aprender a colocar um slideshow destacar sua postagens mais populares ou aquelas para as quais voce queira chamar a atencao do leitor. Fica bem bonito e e muito facil de configurar e gerenciar. Voce pode ver o slideshow em acao AQUI.Dentro do script abaixo, voce podera alterar o tamanho das imagens de acordo com as medidas do seu template, mudar a cor do background, da exibicao, cor e formato das bordas.A velocidade da exibicao tambem pode ser alterada.Vamos la: Codigos/Script <script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'/><script type='text/javascript'>//<![CDATA[/* ------------------------------------------------------------------------s3SliderDevelopped By: Boban Karisik -> http://www.serie3.info/CSS Help: Meszaros Robert -> http://www.perspectived.com/Version: 1.0Copyright: Feel free to redistribute the script/modify it, aslong as you leave my infos at the top.-------------------------------------------------------------------------- */(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) + 1currNo = (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><style type='text/css'>#s3slider {background: #000000;border: 5px inset #584536;width: 550px;height: 200px;position: relative;overflow: hidden;}#s3sliderContent {width: 550px;position: absolute;top:-14px;padding: 0px;margin-left: 0;}.s3sliderImage {float: left;position: relative;display: none;}.s3sliderImage span {position: absolute;left: 0;font: 20px Trebuchet MS, sans-serif;padding: 10px 0px;width: 550px;background-color: #000;filter: alpha(opacity=80);-moz-opacity: 0.8;-khtml-opacity: 0.8;opacity: 0.8;color: #fff;display: none;bottom: 0;text-align:center;}.clear {clear: both;}</style>Para mudar as cores do background, largura, formato e cor das bosdas, procure o codigo: background: #000000; (veja tabela de cores AQUI) border: 5px inset #584536; 5px e a largura da borda inset e o formato, pode ser double, outset, solid, dashed #584536 e o codigo da cor Borda dottedBorda dashedBorda solidBorda doubleBorda grooveBorda ridgeBorda insetBorda outset Para mudar o velocidade de slideshow, altere o valor 4000 Para mudar o tamanho das imagens mude: width: 550px; (largura) height: 200px; (altura) width: 550px; (largura) Como inserir o script e as imagens acima da area de postagem: 1. Faca o login no Blogger e no seu painel clique em Layout 2. Clique na aba Editar HTML 3. Encontre a tag </head> 4. Copie codigo do script e cole- ANTES da tag </ head> Salve o modelo Agora volte para a pagina Layout e clique em "Adicionar um gadget" Escolha um gadget HTML/JavaScript e coloque dentro dele o seguinte codigo: <div id="s3slider"><ul id="s3sliderContent"><li class="s3sliderImage"><a href="SEU-LINK-AQUI"><img style="width:550px;height:200px;" src="http://2.bp.blogspot.com/_DCJ4PAWLOdE/S9bpWEzM6nI/AAAAAAAAEQ8/VXC4YJTouPk/s320/Foto1.jpg" /><span>Texto: Titulo do post </span></a></li><li class="s3sliderImage"><a href="SEU-LINK-AQUI"><img style="width:550px;height:200px;" src="http://2.bp.blogspot.com/_DCJ4PAWLOdE/S9bpa1jmhmI/AAAAAAAAERA/ylF-itO90M0/s320/Foto2.jpg" /><span>Texto: Titulo do post</span></a></li><li class="s3sliderImage"><a href="SEU-LINK-AQUI"><img style="width:550px;height:200px;" src="http://2.bp.blogspot.com/_DCJ4PAWLOdE/S9bpczWGpSI/AAAAAAAAERE/ekpedS9Hb_k/s320/Foto3.jpg" /><span>Texto: Titulo do post</span></a></li><li class="s3sliderImage"><a href="SEU-LINK-AQUI"><img style="width:550px;height:200px;"