Encontrei um blog com dicas bem legais para o Blogger e postarei aqui nos próximos dias todas elas.
A primeira da série é esta, um widget com as últimas postagens do blog com efeito. É bem fácil coloca-lo, é só copiar o código abaixo e colar no HTML/Javascript. Coloque o endereço de seu blog no local indicado com a cor verde e salve.
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script>
<style media="screen" type="text/css">
<!--
#spylist {
overflow:hidden;
margin-top:5px;
padding:0px 0px;
height:350px;
}
#spylist ul{
width:320px;/*largura do widget*/
overflow:hidden;
list-style-type: none;
padding: 0px 0px;
margin:0px 0px;
}
#spylist li {
width:320px;/*largura do widget*/
padding: 5px 5px;
margin:0px 0px 5px 0px;
list-style-type:none;
float:none;
height:70px;
overflow: hidden;
background:#fff url(http://dl.getdropbox.com/u/708209/scriptabufarhan/recentspy/post.jpg) repeat-x;/*aqui o fundo do widget*/
border:1px solid #ddd;
}
#spylist li a {
text-decoration:none;
color:#4B545B;
font-size:11px;
height:18px;
overflow:hidden;
margin:0px 0px;
padding:0px 0px 2px 0px;
}
#spylist li img {
float:left;
margin-right:15px;
background:#EFEFEF;
border:0;
}
.spydate{
overflow:hidden;
font-size:10px;
color:#0284C2;
padding:2px 0px;
margin:1px 0px 0px 0px;
height:15px;
font-family:Tahoma,Arial,verdana, sans-serif;
}
.spycomment{
overflow:hidden;
font-family:Tahoma,Arial,verdana, sans-serif;
font-size:10px;
color:#262B2F;
padding:0px 0px;
margin:0px 0px;
}-->
</style>
<script language="JavaScript">
imgr = new Array();
imgr[0] = "http://i43.tinypic.com/orpg0m.jpg";
imgr[1] = "http://i43.tinypic.com/orpg0m.jpg";
imgr[2] = "http://i43.tinypic.com/orpg0m.jpg";
imgr[3] = "http://i43.tinypic.com/orpg0m.jpg";
imgr[4] = "http://i43.tinypic.com/orpg0m.jpg";
showRandomImg = true;
boxwidth = 3005;
cellspacing = 6;
borderColor = "#232c35";
bgTD = "#000000";
thumbwidth = 70;
thumbheight = 70;
fntsize = 12;
acolor = "#666";
aBold = true;
icon = " ";
text = "comments";
showPostDate = true;
summaryPost = 40;
summaryFontsize = 10;
summaryColor = "#666";
icon2 = " ";
numposts = 10;
home_page = "http://NOMEDOSEUBLOG.blogspot.com/";
limitspy=4
intervalspy=4000
</script>
<div id="spylist">
<script src="http://dl.getdropbox.com/u/1367826/recentpostthumbspy-min.js" type="text/javascript"></script>
</div>
Créditos: Abu Farhan
Boa noite Elke adorei sua dica só um comentário gostaria de saber si for possível é claro ingeri minhas postagem antigas nesse código Javascript.
ResponderExcluirpoderia trocar o link do Blog por outro link das postagem? agradecido desde já e uma boa noite.
Oi...
ResponderExcluirTentei colocar o código, mas não aparecem as figuras das postagens. Só aquela imagem cinza, que indica não haver imagens.
O que pode estar acontecendo?
muito show esse script
ResponderExcluirvlw
... js perfeito e é um "show" seu blog, Parabéns.
ResponderExcluirBoa tarde, Elke!
ResponderExcluirRecentemente criei o Click Amigo (meu segundo blog). Estava procurando uma maneira de colocar, na side bar os posts recentes do Quiosque Azul (meu primeiro blog). Ficou fantástico! Muito obrigado pela ajuda!
Depois tentei fazer no Quiosque Azul o mesmo processo. Funcionou, mas infelizmente deu problema no meu menu de abas ( = deixou de funcionar). Ainda sou um verdadeiro aprendiz da arte de blogar e acredito que isso deve ter ocorrido devido a chamada que tenho, neste blog, para a biblioteca JQuery. Talvez um conflito de 'scripts', não? (meio perdido...*rs!).
Felicidades + Saúde + Paz!
Grande abraço, Renato
quando utilizei esse código a função leia mais nas postagens parou de funcionar, o que pode ter dado errado?
ResponderExcluirvaleu vei me ajudou muito
ResponderExcluirMUITO BOM.....
ResponderExcluirisso so funciona pra sites que
ResponderExcluirtem feed o meu blog nao tem
e nao ta dando pra criar por
causa do template que da um erro
na hora de criar
Muito filé, esse matou a paú.. show...show...
ResponderExcluirvaleu e tudo de bom, somos abençoados por existir pessoas assim como vc...
parabens!!!!
Como faço para aumentar a largura do widget?
ResponderExcluir@Glauco Félix Teixeira Landim para as imagens aparecerem é preciso que vc suba as mesmas direto no editor do Blogger (onde vc escreve). Beijos
ResponderExcluir@Luciano Isso é conflito de script. Tente outro código para o leia mais. Beijos
ResponderExcluirmuito bom
ResponderExcluirVlw cara, mto perfeito!
ResponderExcluirAmeiiii...
ResponderExcluirDá um baita visual ao Blog!!!
Configurei pra ficar como eu queria e está funcionando perfeitamente!
Abração.
Tudo de bom esse post.
ResponderExcluirOi rainha !
ResponderExcluirAqui não funciona mais no meu blog!