Gadget de Posts Aleatórios com Imagens no Blogger

Coloque um acessório no blog para mostrar links e imagens das postagens recentes do seu blog. Você pode configurar esse gadget escolhendo o tamanho da imagem ou se mostrará o titulo da postagem junto com o banner. Depois que colocar o gadget de banners das postagens recentes cada vez que uma pagina do seu blog for visitada será mostrado um link e imagem diferente ajudando a despertar o interesse de seus visitantes por outros posts do seu blog.

Entre na pagina layout > adicionar gadget > html/javascript e cole esse código:

<style type="text/css">
#bp_recent img{padding-bottom: 10px;}
</style>
<div id='bp_recent'></div>
<script type="text/javascript" src="http://www.acessoriosparablogs.com.br/banner-aleatorio.js"></script>
<script style='text/javascript'>
var titleLength = 150;
var imgDim = 250;
var numberOfPosts = 5;
document.write("<script src=\"http://www.dicasparablogs.com.br/feeds/posts/default?start-index="+numposts+"&max-results=5&orderby=published&alt=json-in-script&callback=bprecentpostswiththumbnails\"><\/script>");
</script>

Personalizar o Gadget de Posts Recentes com Imagens

Antes de colocar o gadget no blog você precisa colocar o endereço do seu blog neste trecho do código:
document.write("<script src=\"http://www.dicasparablogs.com.br/feeds/posts/default?start-index="+numposts+"&max-results=5

Aqui temos outras modificações que você pode fazer no gadget alterando algumas partes do código:

var numberOfPosts = 5 - Quantidade de postagens mostradas no gadget, mas além deste trecho você precisa modificar também max-results=5 que está na linha de código onde você colocou o endereço do seu blog que mostramos anteriormente, portanto para alterar o numero de postagens toque o numero 5 destes dois trechos do código e claro use o mesmo numero em ambos.

var titleLength = 150 - Isto é a quantidade de caracteres do titulo das postagens que serão exibidos, portanto se quiser mostrar somente as imagens altere esse valor para zero.

var imgDim = 250 - Tamanho das imagens, ou melhor, dizendo a largura da imagem porque o código redimensiona a imagem para a largura que você escolher, mas a altura de cada imagem dependerá do formato original dela. A razão disso é para evitar distorções na imagem.

padding-bottom: 10px - Espaço entre as imagens mostradas

Quando terminar de fazer esses ajustes é só colocar o código no seu blog e pronto. Outro detalhe interessante é que você poderá saber o numero de cliques que esse gadget recebeu nas estatísticas das campanhas do Google Analytics e procurando o item bp_recent.

Leia também:
Gadget ou Pagina com Postagens Aleatórias e Miniatura das Imagens
Personalizar Gadget Postagens Populares do Blog - Barras Coloridas
Mostrar Lista de Postagens mais Compartilhadas em Redes Sociais

Veja abaixo uma demonstração do gadget em funcionamento. Clique no link a seguir e recarregará essa pagina mostrando outras imagens e links de postagens aleatórias.

Esse gadget é recomendado para blogs com mais de 60 postagens porque devido ao funcionamento do código o gadget pode não funcionar todas as vezes em blogs com menos postagens.