Widget últimas postagens personalizado para Blogger

Que tal mostrar as últimas postagens do seu blog usando um widget? Com imagem ou sem imagem, com data de publicação ou não, com número de comentários ou não, com resumo das postagens ou não, com outras opções e além de tudo você pode escolher entre mostrar as últimas postagens do geral ou de uma categoria específica. Personalize como você quiser!

Se você entender a linguagem CSS, você poderá ajustar e configurar facilmente esse widget como quiser!  

DEMONSTRAÇÃO

Vamos inserir o código no blog





<script>
//<![CDATA[
function showrecentpostswiththumbs(json) {document.write('<ul class="recent_posts_with_thumbs">'); for (var i = 0; i < numposts; i++) {var entry = json.feed.entry[i];var posttitle = entry.title.$t;var posturl;if (i == json.feed.entry.length) break;for (var k = 0; k < entry.link.length;k++){
if(entry.link[k].rel=='replies'&&entry.link[k].type=='text/html'){var commenttext=entry.link[k].title;var commenturl=entry.link[k].href;}
if (entry.link[k].rel == 'alternate') {posturl = entry.link[k].href;break;}}var thumburl;try {thumburl=entry.media$thumbnail.url;}catch (error)

{
s=entry.content.$t;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!="")){
thumburl=d;} else thumburl='https://dl-web.dropbox.com/get/cb_online/sem_imagem.gif?w=cfac64d6';
}

var postdate = entry.published.$t;var cdyear = postdate.substring(0,4);var cdmonth = postdate.substring(5,7);var cdday = postdate.substring(8,10);var monthnames = new Array();monthnames[1] = "Jan";monthnames[2] = "Fev";monthnames[3] = "Mar";monthnames[4] = "Abr";monthnames[5] = "Maio";monthnames[6] = "Jun";monthnames[7] = "Jul";monthnames[8] = "Ago";monthnames[9] = "Set";monthnames[10] = "Out";monthnames[11] = "Nov";monthnames[12] = "Dez";document.write('<li class="clearfix">');


if(showpostthumbnails==true)
document.write('<a title="'+posttitle+'" href="'+posturl+'"><img class="recent_thumb" src="'+thumburl+'"/></a>');
document.write('<h4><a title="'+posttitle+'" href="'+posturl+'">'+posttitle+'</a></h4>');

    if ("content" in entry) {
      var postcontent = entry.content.$t;}
    else
    if ("summary" in entry) {
      var postcontent = entry.summary.$t;}
    else var postcontent = "";
    var re = /<\S[^>]*>/g;
    postcontent = postcontent.replace(re, "");


if (showpostsummary == true) {

      if (postcontent.length < numchars) {
         document.write('<p>'+postcontent+'</p>');
         }else {
         postcontent = postcontent.substring(0, numchars);
         var quoteEnd = postcontent.lastIndexOf(" ");
         postcontent = postcontent.substring(0,quoteEnd);
         document.write('<p>'+ postcontent + ' [...]</p>');}
}

var towrite='';var flag=0;
document.write('<p class="creditx">');

if(showpostdate==true) {towrite=towrite+ cdday +'/'+monthnames[parseInt(cdmonth,10)]+'/'+cdyear;flag=1;}

if(showcommentnum==true)
{
if (flag==1) {towrite=towrite+' | ';}
if(commenttext=='0 Comments') commenttext='0 Comentários';
if(commenttext=='0 Comentários') commenttext='0 Comentários';
if(commenttext=='1 Comment') commenttext='1 Comentário';
if(commenttext=='1 Comentário') commenttext='1 Comentário';
commenttext = '<a href="'+commenturl+'" target ="_top">'+commenttext+'</a>';
towrite=towrite+commenttext;
flag=1;
;
}

if(displaymore==true)
{
if (flag==1) towrite=towrite+' | ';
towrite=towrite+'<a href="'+posturl+'" class="url" target ="_top">Leia mais</a>';
flag=1;
;
}

document.write(towrite);

document.write('</p></li>');
if(displayseparator==true)
if (i!=(numposts-1))
document.write('<hr/>');
}document.write('</ul>');

}
//]]>
</script>

<style type='text/css'>
img.recent_thumb{padding:2px;width:65px;height:50 85px;border:0;float:left;margin:0 10px 0 0; border: 1px solid #ccc;}
.recent_posts_with_thumbs {font-family: Arial, sans-serif;width: 100%;min-height: 100px;padding: 0;font-size:14px;}
ul.recent_posts_with_thumbs li {list-style: none;clear: both;padding:8px 0;}
.recent_posts_with_thumbs a {text-decoration:none; }
.recent_posts_with_thumbs strong {font-size:10px;}
.recent_posts_with_thumbs h4 {font-size: 12px;padding: 2px 0 0 0;margin:0;}
li.clearfix p{padding: 0;margin:3px 0;font-size: 11px;}
.creditx {font-size: 12px;}
</style>

<script style='text/javascript'>
var numposts = 5;
var showpostthumbnails = true;
var displaymore = true;
var displayseparator = true;
var showcommentnum = false;
var showpostdate = false;
var showpostsummary = true;
var numchars = 85;
</script>

<scriptsrc='http://likenettutoriais.blogspot.com.br//feeds/posts/default/?orderby=published&alt=json-in-script&callback=showrecentpostswiththumbs'></script>

[]= largura (ajuste a largura de acordo com o layout do blog/site)
[]= Altura  (ajuste a altura de acordo com o layout do blog/site)
[]= Troque por a URL do seu site/blog
[]= Quantidade de caracteres do resumo (Padrão: 85)
[]=  Número de Postagens (Exemplo: 5):