lunes, 4 de junio de 2012

WIDGET DE POSTS RECIENTES CON IMAGENES PARA BLOGGER

Hay varias versiones de widgets para mostrar los últimos posts el Blogger.
Aqui les dejo una que esta en español.
Para añadir el windget, Este widget de posts recientes se añade simplemente copiando el siguiente códígo en un gadget en blanco (Diseño>Añadir un Gadget>HTML/Javascript):

<style type='text/css'>
img.recent_thumb {padding:2px;width:70px;height:
70px;border:0;float:left;margin:5px 10px 10px 0;
 border: 1px solid #ccc;}.recent_posts_
with_thumbs {float: left;width: 100%;min-height:
 100px;margin:
0px 0px 5px 0px;padding: 0;font-size:12px;}
ul.recent_posts_with_thumbs li {padding-bottom:
5px;padding-top:5px;min-height:
75px;}.recent_posts_with_thumbs a 
{text-decoration:none;}
.recent_posts_with_thumbs strong 
{font-size:10px;}
.recent_posts_with_thumbs h4 {
text-transform: uppercase;
font-size: 14px;
}
</style>
<script type='text/javascript'>
//<![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='http://www.webaholic.co.in
/other/no-image.jpg';
}
 
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]
 = "Ene";monthnames[2] 
= "Feb";monthnames[3] = "Mar";monthnames[4]
 = "Abr";monthnames[5] 
= "May";monthnames[6] = "Jun";monthnames[7]
 = "Jul";monthnames[8] 
= "Ago";monthnames[9] = "Sep";monthnames[10]
 = "Oct";monthnames[11] 
= "Nov";monthnames[12] = "Dic";document.write
('<li class="clearfix">');
 
 
if(showpostthumbnails==true) 
document.write('<img class="recent_thumb"
 src="'+thumburl+'"/>');
document.write('<b><h4><a 
href="'+posturl+'" 
target ="_top">'+posttitle+'
</a></b></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('<i>');
         document.write(postcontent);
          document.write('</i>');}
      else {
          document.write('<i>');
         postcontent = postcontent.
substring(0, numchars);
         var quoteEnd = postcontent.
lastIndexOf(" ");
         postcontent = postcontent.
substring(0,quoteEnd);
         document.write(postcontent + '...');
          document.write('</i>');}
}
 
var towrite='';var flag=0;
document.write('<br><strong>');
 
if(showpostdate==true) 
{towrite=towrite+monthnames[parseInt
(cdmonth,10)]+' - '+cdday+' - '+cdyear;flag=1;}
 
if(showcommentnum==true) 
{
if (flag==1) {towrite=towrite+' | ';}
if(commenttext=='0 Comments')
 commenttext='0 comentarios';
if(commenttext=='1 Comment') 
commenttext='1 comentario';
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">Más</a>';
flag=1;
;
}
 
document.write(towrite);
 
document.write('</strong></li>');
if(displayseparator==true) 
if (i!=(numposts-1))
document.write('');
}document.write('</ul>');
 
}
//]]>
</script>
<script style='text/javascript'>
var numposts = 5;
var showpostthumbnails = true;
var displaymore = true;
var displayseparator = true;
var showcommentnum = true;
var showpostdate = true;
var showpostsummary = true;
var numchars = 80;</script>
<script src='http:
//TUBLOG.blogspot.com
/feeds/posts/default?orderby
=published&alt=json-in-script
&callback=showrecentpostswiththumbs
'></script>
 
Para que funcione, en la última línea
 debes reemplazar “TUBLOG
por el nombre de tu blog.