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.















Publicado por
























Etiquetas: