Widget Vanessa S.
Widget Posts Recentes com Efeito Rotativo no Blogger
Você já viu aqui neste post, como incluir um widget que lista suas postagens recentes na sidebar.
O widget foi desenvolvido pelo Blogger Tricks, porém, eu consegui editar o widget original adicionando a ele um outro efeito, o que resultou em um widget com as últimas postagens do blog com efeito rotativo em forma de um pequeno slide onde mostra a lista de seus ultimos posts publicados no blog.
Se você quiser conferir o efeito veja aqui.
Se você quiser inclui-lo também em seu blog, vá no menu “layout” ? Clique em “Adicionar gadget” ? Escolha tipo ‘HTML/Javascript’.
Copie e cole o código abaixo:
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script>
<style type="text/css">
#spywrapper {/*container geral*/
margin-top:5px;
padding:0px 0px;
height: 100%;
overflow: hidden;
position: relative;
}
#spywrapper ul{
width:auto;
overflow:hidden;
text-align:left;
padding: 0px auto 0;
margin:0px auto 0px;
}
#spywrapper li {
width:auto;
padding: 5px;
margin:0px 0px 6px 0px;
overflow: hidden;
background: #000; /*edite a cor de fundo*/
border:1px solid #B22222; /*edite cor da borda*/
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
}
#spywrapper li a {
text-decoration:none;
color:#fff; /*cor da fonte dos titulos*/
font-size:13px; /*Tamanho da fonte*/
text-align:justify;
height:30px;
overflow:hidden;
margin:0px 0px;
padding:0px 0px 5px 0px;
}
#spywrapper li img {
float:left;
margin-right:20px;
margin-top:5px;
margin-bottom:5px;
}
</style>
<script language="JavaScript">
imgr = new Array();
imgr[0] = "http://3.bp.blogspot.com/-CWrZRsSmrk4/UCnHxw68iRI/AAAAAAAAALE/zmJehc16px0/s1600/icon.jpg";
imgr[1] = "http://3.bp.blogspot.com/-CWrZRsSmrk4/UCnHxw68iRI/AAAAAAAAALE/zmJehc16px0/s1600/icon.jpg";
imgr[2] = "http://3.bp.blogspot.com/-CWrZRsSmrk4/UCnHxw68iRI/AAAAAAAAALE/zmJehc16px0/s1600/icon.jpg";
imgr[3] = "http://3.bp.blogspot.com/-CWrZRsSmrk4/UCnHxw68iRI/AAAAAAAAALE/zmJehc16px0/s1600/icon.jpg";
imgr[4] = "http://3.bp.blogspot.com/-CWrZRsSmrk4/UCnHxw68iRI/AAAAAAAAALE/zmJehc16px0/s1600/icon.jpg";
showRandomImg = true;
boxwidth = 300;
cellspacing = 6;
bgTD = "#000000";
thumbwidth = 50;
thumbheight = 50;
asize = 1;
acolor = "#8B8989";
aBold = true;
text = "comentarios";
summaryPost = 40;
summaryFontsize = 13;
summaryColor = "#fff";
numposts = 10;
home_page = "ENDEREÇO-DO-SEU-BLOG";
limitspy=4
intervalspy=4000
</script>
<div id="spywrapper">
<script src="http://mundoblogger.webs.com/scripts/posts-recentes-rotativo.js"></script>
</div>
Você pode personalizar o widget de acordo com as cores do seu template para dar mais destaque e uma boa aparência.
Marquei as partes editaveis no código para facilitar, agora é só usar a imaginação.
Este widget só funciona no Blogger.
[alerta]Lembrando que, a funcionalidade deste script pode variar de acordo com o template.
Templates que possuem muitos scripts, acabam gerando “conflitos” entre si, por isso alguns arquivos javascript dão erro pra alguns, mas funcionam perfeitamente para outros.
Caso este script não funcione em seu blog, faça uma avaliação de quais realmente são mais necessários.
Para melhor entendimento, leia esta dica: “Por que alguns scripts não funcionam no meu blog”.
Só ative este recurso se você não estiver usando nenhum outro efeito com scriptaculous ou prototype, pois quando usados juntamente com o JQuery, no mesmo template, entram em conflito.[/alerta]
Artigo atualizado em ago/2012.
Oi, o widget está funcionando direito. Mas as imgens das postagens não estão aparecendo. Quando ponho o link de outro blog no código, as imagens aparecem.
Eu nao sei ver qual o tipo de script para dizer onde está a incompatibilidade. Será que tem solução?
Abraço.
Como vc pode verificar, isso não aconteceu no blog de testes que eu usei(veja blog Demo). Se tiver ocorrendo algum conflito de script só vc poderá saber, pois tem que ver quais os scripts que vc tem no seu template. Sendo assim, lamento, mas não tenho como te ajudar, de qualquer forma agradeço pelo comentário.
@Lina
Não sei o que pode ter acontecido, pq eu verifiquei no blog de testes está aparecendo normalmente. Lamento,mas não tenho como te ajudar.
Não ta dando certo!!! Eu modifiquei as cores pra ficar igual ao do meu template, isso deu certo, mas as imagens que aparecem não são as das postagens, são as imagens que aparecem nos favicon do bloguer não foi modificado. Eu já tentei mexer no lugar onde as imagens estão, mas não consegui. Já reinstalei e continuou o erro. O que eu faço?
Também não sei o que acontece, fiz do jeito que foi explicado, e no meu não aparece absolutamente nada.
Leia o aviso que tem no final do post que fala a respeito de conflitos de scripts, pode ser que seja isso. Lembrando que este widget só funciona no Blogger ok?
Quero agradecer, pelas dicas e por tudo o que pôe à dispusição dos blogueiros, coluquei esta minipulação e está muito bom.
oi, fiz tudo certinho mas não aparece nada, só os créditos,preciso retirar ou mudar algum outro código além de colocar o endereço do meu blog? não tenho nenhum template diferente, só o do blogger mesmo…grata Rahyssa
http://casa-cute.blogspot.com/
O meu não deu certo, que pena. Adorei o eleito.
O meu não ficou com efeito rotativo, fora isso tá legal, mas oque será que aconteceu?
Czar Download
Sim, esse link são os créditos do widget e não podem ser retirados.Afinal de contas, me deu trabalho personalizá-lo completamente e disponibiliza-lo para vcs, então nada mais justo que os créditos se mantenham no widget.
o unico defeito deste script e porque fika "BY mundoblogger" ai fika chato -.-
Como faz para os links abrirem em outra página (href)??
Muito Bom! Vou usar!
muito legal esse tutorial parabens^^
tem como aumenta a largura dele?
Oii, bom eu tentei colocar no blog mais eu não sei o qe é a parte CONTAINER GERAL…. me explica??
GeeH
Valeu pela dica 😉
Dica: para retirar os comentários procure a tag ".spycomment" e adicione dentro das conchetes: "display: none;"
eu fui adicionar este widget no Tumblr, e tbm queria ocultar os comentários, tentei via CSS ja que não entendo de JS, por sorte deu certo. fica a dica!!!
Bjos Clau, se cuide =D
Eu gostaria de ter, mas gerou conflito.
Valeu =D
Não consegui colocar esse aplicativo em meu blog!
Outra dica que funfo legal no meu blog.
VLW Clau
um abaço e sucesso pra vc e seu site. XD
@clau quem quiser modificar a parte do numero de posts e so modificar isso limitspy=4
onde 4 e o numero de posts no meu esta 2
@Matheus Rezende:
Tente alinhar as medidas em #spywrapper{
como faço para alinhar ele esta muito para o lado direito e queria que ficasse no centro
@Kakashi e so ver a cor do texto onde diz os comentarios e mudar para a cor do background do seu template
se seu template for branco mude a cor para branco
Não ta funcionando pow q faço ? em
@Os passatempo da Carracita:
Pode ser conflito de scripts no seu template.
Este widget utiliza script da biblioteca JQuery, e muitas vezes ele conflita com outros scripts já instalados.
De inicio achei que o erro seria causado pelo fato do script estar hospedado no Google Sites, visto que em blogs que possuem domínio próprio, scripts hospedados no Google Sites NÃO funcionam, mas não é o seu caso.Acredito eu que seja a 1ª opção mesmo.
Achei este widget interessante para colocar no meu blog, mas sei o que corre errado. Depois de salvar não funciona, não aparecem os posts.
Experimentei o outro script de postagens recentes com imagens e este funcionou direitinho. Terá mesmo algum erro no script ou estou a esquecer de fazer uma alteração para alem do endereço do blog?
Clau, eu estou procurando um widget ultimos posts/mais vistos que nem do site eu maquio -> http://www.eumaquio.com/
Qdo puder posta?? please, please, please.
tudo bem, vou dar uma fusada e fazer uns testes se eu conseguir eu posto um comentario aqui lol
seu blog é muito massa e tem me dado muitas dicas
bjs gata
@Kakashi:
Não há como retirar. Esse widget funciona a base de script, somente quem tem um conhecimento bem avançado e souber editar arquivos javascript que poderia tentar retirar o que vc quer. Infelizmente não poderei te ajudar, sorry.
como eu tiro os comentários (deixando só a imagem e o titulo do blog)
Ai, que alívio!
Voltou a funcionar, Clau.
Clau, não sei o q aconteceu…
O widget não está aparecendo mais…
O código está lá, mas os títulos dos posts não aparecem…
Help…
Bjinhossssssssss
Dead Again:
Obrigada pelo comentário! O seu blog tb está de parabéns, adoro ir lá pegar umas discografias..=)
Carla:
Q bom q gostou…é pra usar mesmo…=)
.::Clau::.
Uau!
Adorei esse widget!!!!
Já tah lá no bloguinho… kkkkk…
Show, Clau!
Bjinhosssssssss
Só passei mesmo para dar os parabéns pelo ótimo blog…….muito bom seu trabalho ^^