Ola , não conseguir arrumar meu templante anterior más trocar, ainda estou colocando a casa em ordem, devagar e testando os gadget que estava dando erro, e eu encontrei...

E na procura por algumas coisas, encontrei este slide de post recente, muito fácil de instalar porque é colocado como um gadget não precisa mexer no HTML  do Blog...


OBS: ele ter 960px de comprimento o que seria o ideal para usar, que então ele também mostraria uma lista com as postagem ao lado.
Más para mim ele ficou muito comprido então eu diminuir o comprimento dele para 500px...más assim ele não aparece a lista ao lado por estar menor...
Galera é o seguinte, por todos que eu já testei este mais prático, você não precisa ficar colocando url de post e imagem, ele vai encontrar automaticamente em seu Blog...basta colocar a URL de seu Blog.


Você acessa o painel de configuração de seu Blog , em seguida na guia Layout e adicionar um gadget, copie o código muda a url que vai estar em destaque na cor rosa... e  colar no HTML/Javascript.

Copie o código aqui
<div class="widget-content">
<style>
#slideshow {
width: 960px; /*aqui o comprimento do slide*/
margin: 5px;
padding:0;
background:#fff;
height:270px;
overflow:hidden;
border:1px dashed #3A3B4C;
box-shadow: 0px 0px 1em #3A3B4C;
-webkit-box-shadow: 0px 0px 1em #3A3B4C;
-moz-box-shadow: 0px 0px 1em #3A3B4C;
margin: 6px 8px 6px 8px;
padding: 1px 2px 1px 2px;
}
#slideshow ul {
background:transparent;
margin: 0;
padding: 0;
list-style-type: none;
}
#slideshow .slides {
width:565px;
overflow: hidden;
float:left;
color: #000;
text-shadow: #fff 1px 1px 1px, #000 -1px -1px 1px;
}
#slideshow .slides ul {
float:left;
overflow: hidden;
width:565px;
height:270px;
}
#slideshow .slides li {
display:none;
left:-99999em;
width:565px;
height:270px;
display:block;
overflow: hidden;
background:#fff;
position:relative;
z-index:1;
}
.js #slideshow .slides li {
margin: 0;
padding: 0;
list-style-type: none;
width:565px;
height:270px;
display:block;
overflow: hidden;
background:#fff;
position:relative;
z-index:1;
}
.js #slideshow .slides li .entry {
width:565px;
height: 50px;/*area inscrição*/
padding: 5px;
overflow: hidden;
position:absolute;
bottom:0;
left:0;
background:#585976;
filter:alpha(opacity=70);
-moz-opacity:0.7;
-khtml-opacity: 0.7;
opacity: 0.7;
}
#slideshow .slides li .entry p {
margin: 0;
}
#slideshow .slides li .entry h2 ,
#slideshow .slides li .entry h2 a,
#slideshow .slides li .entry h2 a:link,
#slideshow .slides li .entry h2 a:visited,
#slideshow .slides li .entry h2 a:hover,
#slideshow .slides li .entry h2 a:active  {
font-size: 20px;
line-height: 1.1em;
margin:0;
color: #000;
text-shadow: #000 1px 1px 1px, #ccc -1px -1px 1px; !important;
margin: 0;
letter-spacing:0;
border:none !important;
}
#slideshow  ul.slides-nav {
height:270px;
width:395px;
margin:0;
padding: 0;
float:right;
overflow:hidden;
}
#slideshow .slides-nav li {
display:block;
margin:0;
padding:0;
list-style-type:none;
display:block;
border-bottom: 1px dashed #3A3B4C;
border-left: 1px dashed #3A3B4C;
}
#slideshow .slides-nav li a {/*area slide menor*/
width:375px;
font-family:arial,helvetica,sans-serif;
display:block;
margin:0;
padding:7px;
list-style-type:none;
display:block;
height:12px;
color: #000;
text-shadow: #fff 1px 1px 1px, #ccc -1px -1px 1px;
font-size:10pt;
overflow:hidden;
background: #fff;
line-height:1.35em;
}
slides.ul li {
background-attachment:scroll;
background-color:transparent;
background-position:center top;
background-repeat:no-repeat;
display:block;
height:270px;
left:0;
opacity:1;
position:absolute;
top:0;
width:540px;
z-index:6;
}
.js #slideshow .slides-nav li.on a {
background: #585976;
filter:alpha(opacity=70);
-moz-opacity:0.7;
-khtml-opacity: 0.7;
opacity: 0.7;
color: #fff;
text-shadow: #000 1px 1px 1px, #ccc -1px -1px 1px;
}
.js #slideshow .slides-nav li a:hover,
.js #slideshow .slides-nav li a:active {
color:#000;
}
#slideshow .slides-nav li a img.post-thum,
#slideshow .slides-nav li a img.thumbnail {
float:left;
margin: -2px 10px 0 0;
padding:2px;
border: 1px solid #aaa;
width:70px;
height:18px;
}
.js #slideshow .slides-nav li.on a img.post-thum,
.js #slideshow .slides-nav li.on a img.thumbnail {
background:#fff !important;
}
</style>

<script language="JavaScript">
imgr = new Array();
imgr[0] = "http://3.bp.blogspot.com/_BaCxSD9NFn8/TFImJ3xTRpI/AAAAAAAABpQ/CM1uyut9_R0/s320/templatesww.png";
showRandomImg = true;
aBold = true;
summaryPost = 300; //
summaryTitle = 250; //
numposts = 10; //
home_page = "URL DO SEU BLOG";
function removeHtmlTag(strx,chop){
var s = strx.split("<");
for(var i=0;i<s.length;i++){
if(s[i].indexOf(">")!=-1){
s[i] = s[i].substring(s[i].indexOf(">")+1,s[i].length);
}
}
s = s.join("");
s = s.substring(0,chop-1);
return s;
}
function showrecentposts(json) {
j = (showRandomImg) ? Math.floor((imgr.length+1)*Math.random()) : 0;
img = new Array();
document.write('<ul class="slides-nav">');
for (var i = 0; i < numposts; i++) {
var entry = json.feed.entry[i];
var posttitle = entry.title.$t;
var pcm;
var posturl;
if (i == json.feed.entry.length) break;
for (var k = 0; k < entry.link.length; k++) {
if (entry.link[k].rel == 'alternate') {
posturl = entry.link[k].href;
break;
}
}
for (var k = 0; k < entry.link.length; k++) {
if (entry.link[k].rel == 'replies' && entry.link[k].type == 'text/html') {
pcm = entry.link[k].title.split(" ")[0];
break;
}
}
if ("content" in entry) {
var postcontent = entry.content.$t;}
else
if ("summary" in entry) {
var postcontent = entry.summary.$t;}
else var postcontent = "";
postdate = entry.published.$t;
if(j>imgr.length-1) j=0;
img[i] = imgr[j];
s = postcontent ; a = s.indexOf("<img"); b = s.indexOf("src=\"",a); c = s.indexOf("\"",b+5); d = s.substr(b+5,c-b-5);
if((a!=-1)&&(b!=-1)&&(c!=-1)&&(d!="")) img[i] = d;
//cmtext = (text != 'no') ? '<i><font color="'+acolor+'">('+pcm+' '+text+')</font></i>' : '';
posttitle = (aBold) ? ""+posttitle+"" : posttitle;
var trtd = ' <li id="post-'+i+'" class="clearfix"> <a href="#main-post-'+i+'" class=""><img height="150px" width="150px" class="post_thumbnail thumbnail thumbnail post_thumbnail" alt="" src="'+img[i]+'"/>'+posttitle+'</a> </li> ';
document.write(trtd);
j++;
}
document.write('</ul>');
}
function showrecentposts1(json) {
j = (showRandomImg) ? Math.floor((imgr.length+1)*Math.random()) : 0;
img = new Array();
document.write('<ul class="clearfix" style="position: relative;">');
for (var i = 0; i < numposts; i++) {
var entry = json.feed.entry[i];
var posttitle = entry.title.$t;
var pcm;
var posturl;
if (i == json.feed.entry.length) break;
for (var k = 0; k < entry.link.length; k++) {
if (entry.link[k].rel == 'alternate') {
posturl = entry.link[k].href;
break;
}
}
for (var k = 0; k < entry.link.length; k++) {
if (entry.link[k].rel == 'replies' && entry.link[k].type == 'text/html') {
pcm = entry.link[k].title.split(" ")[0];
break;
}
}
if ("content" in entry) {
var postcontent = entry.content.$t;}
else
if ("summary" in entry) {
var postcontent = entry.summary.$t;}
else var postcontent = "";
postdate = entry.published.$t;
if(j>imgr.length-1) j=0;
img[i] = imgr[j];
s = postcontent ; a = s.indexOf("<img"); b = s.indexOf("src=\"",a); c = s.indexOf("\"",b+5); d = s.substr(b+5,c-b-5);
if((a!=-1)&&(b!=-1)&&(c!=-1)&&(d!="")) img[i] = d;
//cmtext = (text != 'no') ? '<i><font color="'+acolor+'">('+pcm+' '+text+')</font></i>' : '';
posttitle = (aBold) ? ""+posttitle+"" : posttitle;
var trtd = '<li style="background: transparent url('+img[i]+')" id="main-post-'+i+'"><div class="entry"><h2 class="post-title"><a href="'+posturl+'">'+posttitle+'</a></h2> <p>'+removeHtmlTag(postcontent,summaryPost)+'</p></div></li> ';
document.write(trtd);
j++;
}
document.write('</ul>');
}
</script>
<script src="http://sites.google.com/site/menuhorizontal2/slidefeed/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
$slideshow = {
context: false,
tabs: false,
timeout: 7000,
slideSpeed: 1000,
tabSpeed: 1000,
fx: 'toss',
init: function() {
this.context = $('#slideshow');
this.tabs = $('ul.slides-nav li', this.context);
this.prepareSlideshow();
},
prepareSlideshow: function() {
$('div.slides > ul', $slideshow.context).cycle({
fx: $slideshow.fx,
timeout: $slideshow.timeout,
speed: $slideshow.slideSpeed,
fastOnEvent: $slideshow.tabSpeed,
pager: $('ul.slides-nav', $slideshow.context),
pagerAnchorBuilder: $slideshow.prepareTabs,
before: $slideshow.activateTab,
pauseOnPagerHover: true,
pause: true
});
},
prepareTabs: function(i, slide) {
return $slideshow.tabs.eq(i);
},
activateTab: function(currentSlide, nextSlide) {
var activeTab = $('a[href="#' + nextSlide.id + '"]', $slideshow.context);
if(activeTab.length) {
$slideshow.tabs.removeClass('on');
activeTab.parent().addClass('on');
}
}
};
$(function() {
$('body').addClass('js');
$slideshow.init();
});
</script>


<div id="slideshow" class="clearfix">
<div class="slides">
<script language="JavaScript">
document.write("<script src=\""+home_page+"feeds/posts/default/?max-results="+numposts+"&orderby=published&alt=json-in-script&callback=showrecentposts1\"><\/script>");
</script></div>
<div class="slides-nav">
<script language="JavaScript">
document.write("<script src=\""+home_page+"feeds/posts/default/?max-results="+numposts+"&orderby=published&alt=json-in-script&callback=showrecentposts\"><\/script>");
</script>

</div>
</div>
</div>

<script src='http://sites.google.com/site/menuhorizontal2/slidefeed/jquery.cycle.js' type='text/javascript'/></script>


Destaquei também onde esta marcado comprimento do slide caso queira mexer no comprimento.
 Qualquer dúvida só me perguntar ..um grande beijo ....

                                             

                                                     solTamalyn

30 comentários:

  1. Muito legal essa dica, slide das postagens fica muito bem no blog e o melhor que ele chama a atenção das pessoas. Sol beijos.

    ResponderExcluir
    Respostas
    1. Obrigada Lucimar por sempre estar prestigiando beijos...
      Eu gosto de slide e este é muito bom...

      Excluir
  2. mais o link com o codigo não esta fucionando

    ResponderExcluir
    Respostas
    1. Ieadmsg eu troquei de template ontem , e esta dando erro nos link...tenho que ver o porque ...obrigada p0ela visita agora esta normal colocar o código aqui...no post

      Excluir
  3. Muito bom,Sol.

    Mas meu blog já lotou.

    Beijos e linda sexta e fim de semana

    Donetzka

    ResponderExcluir
    Respostas
    1. Olá minha querida Done, meu carneiro machucar meus dedos com uma cabeçada .esta dificil para digitar ,,beijos passarei em seu Blog hoje minha amiga.

      Excluir
  4. Adorei Sol

    bjs

    tudoqueeuseiegosto.blogspot.com.br/

    ResponderExcluir
    Respostas
    1. Linda Di que bom que gostou , bom ter você aqui querida , beijos e um grande domingo a vocÊ....irei te ver em breve,,,,,beijos

      Excluir
  5. Oi Sol,
    boa noite,
    tu está em tudo!
    Agora tu ajuda a colocar blogs mais bonito =D

    Eu enviar-lhe um grande beijo

    ResponderExcluir
    Respostas
    1. kkkkk Ariel eu encontrar este gadget para slide e achei prático e bonito....beijokas

      Excluir
  6. Vlw lindaaaaaaaaaa!^^ Mas tem como tirar a lista do lado do slide?

    ResponderExcluir
    Respostas
    1. Ola Gótica .a unica maneira de você retirar a coluna lateral é diminuindo o tamanho dele, onde esta marcado em rosa o comprimento ...beijos ..qualquer coisa só dizer !!!

      Excluir
  7. Há mas..eu tentei fazer o que vc disse, mas ainda fica o espaço em branco, no lugar da quela lista!

    ResponderExcluir
    Respostas
    1. Eu entendi, talvez ele não é compativel com seu template ..olhar este em meu Blog de test, este voce pode mudar a cor da borda e por na sidebar também.
      http://testtamalyn.blogspot.com.br/

      você encontra como colocar aqui
      http://videosdasol.blogspot.com.br/2013/08/slide-automatizado-para-blogger.html

      Excluir
  8. eu coloquei mas fiaca apagada a legenda

    ResponderExcluir
    Respostas
    1. desculpe mas isso é gadget.alguns template não aceitar o formato e dar erro .... sinto pela demora ...

      Excluir
  9. Ótima dica, no meu ficou a lista das publicações ao lado das imagens, tem alguma forma de exibir apenas as imagens?

    ResponderExcluir
    Respostas
    1. Gustavo ola bem vindo... onde esta escrito "comprimento do slide" em rosa tem o valor de 960px.. mudar para 500 então você não ter a lista ao lado .ok

      Excluir
  10. Olá obrigado pela dica, mas as imagens não estão aparecendo, aparece apenas a lista do lado o que devo fazer?

    ResponderExcluir
  11. oi aqui é o douglas funciono, más parece uma imagem branca só me ajuda urgente

    ResponderExcluir
  12. oi aqui é o douglas funciono, más parece uma imagem branca só me ajuda urgente

    ResponderExcluir
  13. oi... no meu blog n esta a entrar bem
    veja só
    www.musicasyebahhh.com

    ResponderExcluir
  14. Ola galera bom dia... eu estou um pouco sem tempo desculpe a demora , verei isto a tarde, mas o que pode estar errado é que o slide as vezes é incompativel com o seu template atual, pode tambem ter comflitos de gadgets ... tentar este por favor ... abraços...

    http://videosdasol.blogspot.com.br/2013/08/slide-automatizado-para-blogger.html

    ResponderExcluir
  15. Oi, adicionei o gadget do slide no meu blog, porém ficou o slide sem as postagens passando.. :( ja tava animado! q pena, o q pode ta acontecendo?

    www.garotolifestyle.blogspot.com.br

    ResponderExcluir
  16. Ola Narciso, bom o que pode ter acontecido é que, se eu blog estava privado para vc testar o gadget do slide, ele realmente não irá passar as imagem. beijos gostei de seu blog , seu perfil é típico de um taurino ... tambm sou de touro..qualquer coisa diz aqui abraços!

    ResponderExcluir
  17. Oi querida! que bom que vc gostou! adoro pessoas de touro! seja bem vinda ao meu blog, disponha sempre! e valeu pela dica, vou tentar novamente. ;D

    www.garotolifestyle.blogspot.com.br

    ResponderExcluir
    Respostas
    1. Oi , então espero que de tudo certo , visitarei mais vezes seu blog, um abraço!! estou sempre a disposição Narciso !

      Excluir

ŞØŁ ŦΔΜΔŁ¥Ň ЖØЖØ

༺♥༻ℒℴѵℯ༺♥༻

Só por hoje:

Não se zangue,
Não se preocupe,
Seja grato,
Trabalhe com diligência,
Seja gentil para as pessoas.

नमस्ते NAMASTÊ – O DEUS QUE HÁ EM MIM SAÚDA O DEUS QUE HÁ EM TI!

Renata Marciano

 
© Terapia Floral - 2012. Todos os direitos reservados.
Criado por: Renata Sol Tamalyn.
Tecnologia do Blogger.
imagem-logo