O widget de Posts Recentes desenvolvido por (sempre eles!) Hans do Beautiful Beta e Ramani do Hackosphere é um velho conhecido de quem usa o Blogger. Esta é uma adaptação feita por Anhvo acrescentando as imagens dos posts miniaturizadas. Em suas navegadas, o Cidão encontrou este widget no blog da Marianne.
A instalação é muito simples, e o widget é bastante customizável.
A) Preparação
- Inicialmente você precisa escolher algumas imagens - 5 no total. Essas imagens serão usadas de maneira rotativa quando seus posts não possuírem imagens publicadas. Faça o upload das imagens em seu site de hospedagem preferido. Recomendo o álbum Picasa de sua conta do Google. Anote o endereço das imagens "upadas".
- Hospede o arquivo JavaScript utilizado no Widget em seu site de hospedagem preferido. Baixe-o pelo link a seguir:
recentposts_thumb.js
B) Instalação
- Na Guia "Layout", em "Elementos de Página", adicione um gadget HTML/JavaScript;
- Coloque o título que preferir para seu widget;
- Copie o código a seguir e cole no box:
<script language="JavaScript"> imgr = new Array(); imgr[0] = "http://ENDEREÇO-IMAGEM-1"; imgr[1] = "http://ENDEREÇO-IMAGEM-2"; imgr[2] = "http://ENDEREÇO-IMAGEM-3"; imgr[3] = "http://ENDEREÇO-IMAGEM-4"; imgr[4] = "http://ENDEREÇO-IMAGEM-5"; showRandomImg = true; tablewidth = 230; cellspacing = 2; borderColor = "transparent"; bgTD = "transparent"; imgwidth = 40; imgheight = 40; fntsize = 12; acolor = "#333"; aBold = true; icon = " "; text = "comentários"; showPostDate = false; summaryPost = 50; summaryFontsize = 5; summaryColor = "#666"; icon2 = " "; numposts = 8; home_page = "http://SEU-BLOG.blogspot.com/"; </script> <script src="http://endereço-do-arquivo-java-script/recentposts_thumb.js" type="text/javascript"></script>
C) Explicação dos ítens e customização
Esse Widget utiliza uma tabela formada pela thumb da imagem, título do post, data do post, número de comentários e sumário do post. A customização, portanto, será dos ítens da tabela.
Nas primeiras linhas você deve colocar o endereço das imagens que você hospedou.
showRandomImg = true;: nos posts onde não há imagens publicadas, o local da tabela destinado às imagens será preenchido pelas imagens hospedadas de forma rotativa.
tablewidth = 230;: escolha a largura para a sua tabela.
cellspacing = 2;: determine o espaço entre as células da tabela.
borderColor = "transparent";: defina a cor da borda da tabela - observação: essa borda é externa, ela aparecerá como se fosse um "background" do container dos dados. Optei por "transparent" que se adapta melhor a qualquer cor de template.
bgTD = "transparent";: escolha a cor de background dos dados da tabela - observação: esse background é interno. Também optei por "transparent", o que não irá interferir na cor do template.
imgwidth = 40;: coloque a largura que deseja para as miniaturas das imagens.
imgheight = 40;: escolha a altura para as miniaturas das imagens.
fntsize = 12;: determine o tamanho da fonte em pixels para o título dos posts, data e número de comentários.
acolor = "#333";: escolha a cor da fonte para o titulo dos posts, data e número de comentários.
aBold = true;: true para fonte do título em negrito, false para fonte normal.
icon = " ";: não faço a mínima idéia para que serve... :o (sério, mea culpa, não estudei o arquivo JS tão profundamente para entender esses "icons")
text = "comentários";: escolha o texto que você quer que apareça após o número de comentários.
showPostDate = false;: true para mostrar a data do post, false para omitir.
summaryPost = 50;: defina o numero de caracteres que você quer mostrar como resumo do post. Se quiser que apareça apenas o título, defina "0" (zero) para esse ítem.
summaryFontsize = 5;: tamanho da fonte em pixels para o resumo do post.
summaryColor = "#666";: determine a cor da fonte para o resumo do post.
icon2 = " "; : Hãn??
numposts = 8;: escolha quantos posts você deseja mostrar no Widget.
home_page = "http://SEU-BLOG.blogspot.com/"; : substitua com o endereço do seu blog.
No final há a chamada para o arquivo JavaScript. Coloque o endereço de hospedagem de seu arquivo.
O Cidão fez uma adaptação no arquivo JS e você pode usar esse Widget também para substituir o tão procurado Widget de Artigos Recentes por Categoria que eu publiquei no Blog a La Carte e que usava Yahoo Pipes (e que demorava trocentos minutos para carregar).
Vá até o Chronicles & Tales Unlimited (Red) e confira!
Comentários: 45
Rô, o icon é para colocar um caractere especial, veja no meu blog, é um ponto e uma seta.
Cidão: Aaaahhh! É pra usar tipo um bullet?? Dããããã prá Rô... ahahahahaha
Valeu, Cidão!
ba ta loco tchê, esse blog é mto bom. hehe
Adoro seus posts! Mta fácil de fazer as dicas e bem explicado. :)
Rô,
Você acha possível fazer um widget neste mesmo estilo para os posts mais votados?
Beijos!
Melo: Obrigada!! :)
Nani: O Widget é baseado nos feeds do Blogger. Portanto, é possível ter o widget com os posts e com os marcadores (também seria possível com os comentários, mas como não há imagens, não há utilidade).
Uma curiosidade: O que você considera como posts mais votados?
Abraços!
Rô,
desculpa, troquei os nomes: eu queria dizer post mais comentados...
Valeu!
Nani O Widget de Posts mais Comentados já usa um script (Yahoo Pipes), que dá possibilidade de usar as thumbs. Não tenho certeza, mas acredito que uma mudança na pipe poderia te dar um widget como você deseja.
Eu tenho uma certa experiência com Yahoo Pipes, parei de "fuçar" porque os scripts demoram muito a carregar e os leitores se desinteressaram.
O único problema que tenho para desenvolver isso prá você agora é que minha agenda tumultuou um pouco com essa quebra de conexão. Preciso me organizar e pagar "minhas dívidas" :o (estou com um monte de templates e tutoriais atrasados).
Mas pode deixar que coloco na lista e assim que as coisas estiverem "em dia" eu vou checar isso prá você.
Abração!
Rô,
É que essas pipes demoram para carregar no blog, certo? E esse widget de recentes carrega super rápido (pelo menos no meu blog).
Pode colocar no final da sua lista, não há problema algum!
Você é demais...
A diferença é a seguinte, Nani: os widgets que usam yahoo pipes dependem de um script hospedado no Yahoo. Imagine milhares de pessoas no mundo todo utilizando o mesmo arquivo do mesmo servidor do Yahoo para as centenas de pipes que são criadas!
No caso desse widget, você pode hospeda-lo em um servidor com menos acesso e além disso você estará carregando o endereço do SEU ARQUIVO e não um endereço utilizado por milhares de pessoas.
O ideal mesmo seria que alguém que "manje" de JavaScript criar um script que faça a mesma função da pipe de Mais Comentados. Difícil é encontrar algum fera em JS disposto a ajudar os blogspoteiros.. hehe
"Inda" faço um curso e aprendo de vez a escrever JavaScript!! ;) (não gosto de depender dos outros... uhauhauhauha)
Olá Rô!
Cheguei aqui através da Márcia para instalar o widget para posts recentes.Já instalei (espero ter acertado!).Se me permite uma pergunta:no meu blog que é sobre crochet, tenho vários " passo a passo" e queria por junto ao link uma foto do trabalho que vou explicar em vez de ser apenas uma lista.Será possível?
Já tentei através do adicionar miniaplicação - adicionar imagem (já as tenho reduzidas), mas como tenho de por uma de cada vez ficam muito espaçadas depois na página.
Parabéns pelas suas excelentes dicas e muito agradecida pela atenção
bjs
Nélia
Nélia (Magia do Crochet): Não sei se entendi bem. Acho que você está falando da lista de links que você tem na sidebar, né?
Bem, há duas maneiras que dá pra fazer isso.
1) Uma delas dá um certo trabalho inicial pra você modificar os posts, mas depois é automática. Você teria que adicionar um novo marcador (pode ser com o nome passo a passo, por exemplo) a todos os posts que deseja para essa lista. E a imagem que você deseja ao lado do link teria que ser a primeira imagem do post (não precisa redimensionar, o widget - semelhante ao de posts recentes - redimensiona).
Depois, você adiciona o Widget Vertical de Posts Recentes por Categoria do Cidão e aí cada post novo que você fizer (nesse marcador) já vai sendo adicionado à lista.
2) Construir você mesma sua lista de links adicionando um gadget HTML/JavaScript. Nesse caso a construção da lista de links deve ser feita da seguinte maneira ( troque todos os sinais "[" por < e todos os "]" por > ):
[ul]
[li] [a href='http://endereço-do-post-1'][img src='endereço-da-hospedagem-de-sua-imagem-1' vertical-align='middle'/]Título para o link 1 [/a][/li]
[li] [a href='http://endereço-do-post-2'][img src='endereço-da-hospedagem-de-sua-imagem-2' vertical-align='middle'/]Título para o link 2 [/a][/li]
[li] [a href='http://endereço-do-post-3'][img src='endereço-da-hospedagem-de-sua-imagem-3' width='15px' height='15px' vertical-align='middle'/]Título para o link 3 [/a][/li]
[/ul]
Repita quantas vezes forem necessárias entre [li] e [/li] e no final feche a lista com [/ul]
Se alguma das imagens não estiver redimensionada, você pode redimensiona-la nessa lista como está no exemplo da imagem 3 (width para largura e height para altura).
Espero ter ajudado.
Bem-vinda e um abração!
Rô
Muito agradecida pela atenção e pela rapidez!
Agora vou "meditar" nas 2 maneiras para ver qual a que consigo fazer melhor!
Depois venho dizer
bjs
Nélia
Olá Rô, o bloggersphera muito me ajuda. Este hack era tudo que precisava em meu blog. Entretanto, achei que a formatação do (0 comentários) - (Data) não está a contento. Queria diminuir a letra e colocar a data na linha de baixo. Tem como?
Abraços,
Fraude Urnas Eletrônicas: É necesário mexer no arquivo JavaScript para isso. Eu tenho feito novas versões desse script (como o widget por categorias que já conta com 3 versões). Pretendo fazer várias outras e publicar todas em um artigo só.
Até agora as versões disponíveis são:
1) Original do Anhvo - posts recentes com thumbs : recentposts_thumb.js
2) Posts Recentes com thumbs versão 2 - sem o texto "comentários": recentposts-v2-thumbs.js
3) Posts Recentes por Categoria - feito pelo Cidão: tagposts_thumb1.js
4) Posts Recentes por Categoria na Horizontal versão 1: rec-posts-by-label.js
5) Posts Recentes por Categoria na Horizontal versão 2 - sem o texto "comentários" : rec-posts-by-label-v2.js
Aguarde um pouco e faço uma versão da maneira que você deseja.
Abraços!
Querida Jô, adorei o resumão. Sugiro, inclusive, que você publique um artigo com estas especificações todas. Acredito que facilitaria para várias pessoas.
Testei a versão do Posts Recentes com thumbs, entranto não agradei. Prefiro o padrão. Infelizmente é excluído somente a palavra comentários. No caso de artigos com 0 comentários e data a situação ficou assim: - (04 mar 09).
Aguardo, pacientemente, outras atualizações.
Não sei o motivo, mas o Bloggershera não oferece a opção de acompanhar a discussão do post. Porque?
Abraços!
Fraude Urnas Eletrônicas: Pretendo, sim, fazer um post com todos os scripts que tenho traduzido, modificado e adaptado e colocarei o link para esse post no menu. Acredito que isso facilitará para o usuário.
Em breve farei a versão que você solicitou.
Os comentários do BloggerSPhera podem ser acompanhados, desde que você esteja logado com uma conta do Blogger.
( Veja imagem )
Eu desabilitei os comentários "qualquer um, por incluir comentários anônimos. Estava havendo uma frequência muito grande de comentários anônimos com dúvidas, mas o comentarista não deixava nem mesmo o nome do blog, o que me fazia gastar um tempo desnecessário.
Um grande abraço!
Muito bom isso Rô. Estou pensando em dar uma "repaginada" no meu blog e acho que vou acrescentar esse Hack.
abraços
Oi Jean Carlo! Logo vou colocar um post com todas as versões para esse widget e você pode escolher a que ficará melhor em seu blog. :)
Grande abraço!
O Jacascript Host não quer voltar. Você tem um backup desse arquivo JS? Por sorte eu tinha o java do resumo automático, senão meu blog estaria totalmente desconfigurado agora.
Além do Skydrive, sabe de outro serviço bom para upload?
Beijos!
Otto: Já substituí o link.
O SkyDrive também está com problemas.
Tente o Ning ou o DropBox.
Abração!
Boa Noite Rô!
Achei muito interessante o "Posts Recentes com Imagem". Há alguns dias testei e ficou muito bom, mas agora não aparece mais. Existe algum outro recurso para que possa dar certo? Ou o site que está com problema pode voltar a funcionar a qualquer momento?
Mais uma vez quero te agradecer pelas explicações. Tenho aprendido muito.
Que Deus te abençoe!
George
George: O link para baixar o arquivo já foi substituído. Faça o download e hospede em seu site de hospedagem. Assim terá o widget funcionando novamente.
Abraços!
Oi Rô! Tudo bem?
Há tempos tudo que tinha arquivo java no meu blog sumiu.... Resumo dos posts, hoje eles aparecem inteiros e no final a seguinte frase: Continue Lendo... Antes ele aparecia um resumo e quando clicava nesta frase aparecia inteiro.
Posts recentes com imagens (thumbs) a mesma coisa. Não aparece mais! Voce pode me ajudar? Como conserto isso?
Obrigada!
Bjos
Rô mudei o arquivo de java de lugar. Coloquei no Dropbox, os posts recentes com imagens voltaram. Dá uma olhadinha lá quando puder, mas o "Resumo dos post's", continua com defeito...
Li com calma tudo aqui e descobri o erro de um, será que o outro é a mesma coisa? Se for, me ajuda aonde achar o arquivo?
Obrigada sempre!
Bjos
Rô,
Muito obrigado! Você é muito atenciosa!
Que Deus te abençoe grandemente!
George
Claudinha: Parece que você já resolveu a maioria, né?
Estou substituindo todos os links. Fique de olho nos que você usa. Bjs!
Olá George! Obrigada! :)
Rô, tudo bem, primeiramente adorei o blog, acompanho os teus feeds e estou usando suas dicas ate! my problem, estou desenvolvendo uma customização e esse gadget não esta mostrando a primeira imagem dos meus posts, ja quebrei a cabeça e não consigo resolver... se tiver um tempinho por favor me ajuda!
desde ja te agradeço por tudo, e esperando mais tutoriais bacanas!
Help!!!
Olá Rô
Este Sript hospedado pode ser usado para o Widget de post recentes por categoria com Thumbs do Cidão?
pois lá e no blog da marianne os scrips estão com banda excessiva, não sendo possivel a leitura e salvamento
Oi Douglas! Obrigada!
Bem, é difícil checar sem ver o código no template, e você não deixou o link. Posso dar um chute - se você hospeda as imagens fora do blogger, não tenho certeza de que o widget funcione, ok?
Central Fitness: Não, o Widget por Categorias tem uma pequena modificação no Script. Devo ter uma cópia dele aqui, logo disponibilizo também para download no 4shared.
Abraços!
Consegui no novo layout.
Rô, têm como tirar ou omitir , o "comentários(0)" ??
o melhor site com certeza...seu blog é demais e me ajudou muito
Parabéns pelo blog, fiz o teste desse scripte saiu tudo certíssimo, só precisei customizar mesmo.
Abraço!
muito bem..!! tenho varios videos postados em meu blog,até esses dias as imagens em miniaturas estavem normal no blog, hoje esta o fundo preto e a opção do play para iniciar o video.já fui na sessão para escolher miniaturas de video e está tudo ok, só no blog que não aparece mais, poderia me ajudar. Valeu.
Olá, Rô!
Sou nova por aqui, mas desde já dou os parabéns! Muito interessante seu blog!
Então... meu blog é esse: www.parafusopreso.blogspot.com
Estou enfrentando problemas com os thumbs, pois as imagens dos meus posts não estao aparecendo nos thumbs, e sim as 5 imagens que upei para os posts sem foto.
Também gostaria de saber como tirar (0 comentários).
Podes me ajudar?
Grata!
Simplesmente não apareceu nada!
Oi...
Uma pergunta...existe como alterar este hack e ao invés de posts recentes ele mostrar posts ANTIGOS aleatóriamente?
Se isso for possível e vc puder me informar como eu agradeço..
Forte abraço
Olá Rô tudo bem?
Estou tentando colocar este recurso no meu blog mas com o template ja esta pré definido para magazine naum sei oq eu faço.
http://gustavojuliao.blogspot.com
queria por o com labels
mas atualmente estou usando o recent post mas só aparece o ultimo e eu queria q mostrasse varios.
obrigado desde já
tou com problema com ele, aki funciona perfeito mas em outros pcs nao tem funcionado nao percebo pk ...
badboynuno17: Esse hack usa JavaScript. Se o navegador do computador não estiver com Java habilitado, não vai aparecer.
Gustavo: Pelo que vi você conseguiu resolver o problema, parabéns!
Seu Noca: Tem como mostrar posts antigos, mas não do tipo "random" (seria um outro script para isso).
Mariana: Procure refazer os passos. Esse widget raramente dá problemas.
Thiana: Você está usando imagens upadas pelo Blogger?
Herbert: O script foi desenvolvido para imagens. Não estou certa de que funcione perfeitamente para vídeos (nunca testei).
Rafael e Conto do Espelho: Obrigada! :D
Central Fitness: É necessário retirar do script. Veja o post do Widget em forma de lista. Naquele eu retirei os comentários.
Abraços, pessoal!
Oi, Rô.
Instalei e deu certinho, mas tenho uma dúvida: só se pode "upar" 5 imagens???
Programei o widget pra 10 postagens recentes e apenas as mesmas 5 imagens ficam "rodiziando", mesmo eu tendo imagens em cada post.
Como posso então colocar as imagens correspondentes em cada um???
Beijo.
oi linda... passando outra vez aqui...
Tem como usar esse widget na horizontal?
por que vejo que, em todos os blogs de dicas, essa lista só aparece na vertical
pode me responder?
ahh!! aproveitando o comentário, quero te perguntart como colocar um efeito ou pelo menos uma linha abaixo de cada título dos postes rencentes ?;;;
por aqui no meu blog de test:" http://desejos-do-coracao.blogspot.com/ " os links ficam sem nada pra separar um link do outro...
tem, como vc me ajudar?
bay , Jeff
TEM COMO FAZER ALGUMA ADPTAÇÃO PARA COLOCAR OUTROS FEEDS ?
tipo pra colocar feeds de outros sites ?
se tiver ensina
Jefft LouisPublicou um post sobre...ERA UM VEZ UM TEMPLATE
Sr. Rô não vou lhe deixar em paz até vc lê minha postagem e me dá uma resposta, embora seja essa resposta negativa, mas ficarei feliz por vc ter lido, apesar de minhas perspectivas serem totalmente positivas... já estou escrevendo o 5º quinto comentario com esse e vc está ignorando...
insistirei com vc: ou vc me responde ou tire o seu site do ar por enquanto estiver no ar estarei lhe importunando para chegarmos a um diálogo..
blz...!!!!
Bay, Jefft Louis
Oi Ro!
Estou desde ontem tentando instalar o template coralina I.. mas dá sempre erro. Sempre diz que a formatação é inadequada... que os elementos xml não estão fechados corretamente.
Queria muito trocar o meu template por esse... mas ta dificl.
Será que dava pra vc me ajudar a resolver esse problema?
Em primiro Parabens pelo excelente Blog!
Uso a template Carolina I.
instalei a widget de Posts Recentes e estou tendo um probleminha.
ela esta funcionando mais no meu blog ele aparece uma coluna inteira e todas as minhas gadjet ficam alinhadas abaixo da nova widget de Posts Recentes.
se puder me ajudar agradeco.
meu blog ainda em desenvolvimento.
http://presencadideus.blogspot.com/#
Postar um comentário
Para deixar o link da sua última postagem coloque este código:
Feed dos Comentários<em><strong>Seu nome</strong> publicou um post sobre.. <a href="seu-link-do-último-post">Título do Post</a></em>
Quando você estiver testando algum hack e tiver dúvidas sobre ele, informe:
1 - O endereço do blog onde você está testando (ou instalando o hack);
2 - O navegador que você está usando (Firefox, Opera, IExplorer, etc).
Leia sobre a política de Comentários!
Eu gosto de conhecer meus leitores! Se você usar OpenId ou perfil fechado, assine o comentário com seu nome e me deixará muito contente!
Bem-vindos e obrigada pela visita!
Blog This!