Beautiful recent post widgets for blogger (With Thumbnails)

Nmaskar, Aj ham apkeliye ek Bohat hi Badiya Recent Post Widgets Laye hain.Recent post Widgets ek fayedemand widgets hain- Phele to a apki blog ka sundarta badhate hain. Aur is ke jariye apki blog readers badihi asnise apka recent post dhund sakti hain.Isi bat ko dhiyan mai rakhkar main apke liye a widgets laya hu.Ummed hain ki is tutorial ko pura padhneke bad ap jarur jamjgaye honge ki kaise recent post widgets Blogger pe add karte hain.

(Aur padiye: Kaise Blogger pe facebook page pluging karte hain? )

Beautiful recent post widgets for blogger (With Thumbnails)

Recent Post widgets ko kaise add kare ?

1. Ap Blogger.com pe jakar login hogaye.
2. Jis Blog par a widgets install karna chate hain usko select kare.

Right sidebar mai layought optins par click kare

3. Right sidebar mai layout optins par click kare. (upar Image ki jaisa) 

Add new Gadget par click kare

4. Apke samne Layout section khul gayega ab Add new Gadget par click kare.(upar Image ki jaisa)

HTML/JavaScript par click kare

 5. Ab apke samne ek new window open hoga. Isme ap HTML/JavaScript par click kare(Upar image ki jaisa).

Title ke box par title daliye(Example: Recent Post), Aur content ki jaga niche digaye code co paste karke Save button par click kare

6.Ap title ke box par title daliye(Example: Recent Post), Aur content ki jaga niche digaye code co paste karke Save button par click kare.  Bas hogaye !! (Upar Image ki jaisa).

<script type="text/javascript">
function showlatestpostswiththumbs(t){document.write('<ul class="recent-posts-container">');for(var e=0;e<posts_no;e++){var r,n=t.feed.entry[e],i=n.title.$t;if(e==t.feed.entry.length)break;for(var o=0;o<n.link.length;o++){if("replies"==n.link[o].rel&&"text/html"==n.link[o].type)var l=n.link[o].title,m=n.link[o].href;if("alternate"==n.link[o].rel){r=n.link[o].href;break}}var u;try{u=n.media$thumbnail.url}catch(h){s=n.content.$t,a=s.indexOf("<img"),b=s.indexOf('src="',a),c=s.indexOf('"',b+5),d=s.substr(b+5,c-b-5),u=-1!=a&&-1!=b&&-1!=c&&""!=d?d:"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi-V-b4Ki2_G9AKQ-vM7SscUmekjRXXom62edkiJ9Xjdp5QiD-IvzVzBvO2azFV_dy99mjqon_GoyaYhJFxAWSC077SaTJjllR2KbfPhgBQKPLJCU0LJQajh4ij5Rb8lI9uemb14c79b5Pg/s1600/no-thumb.png"}var p=n.published.$t,f=p.substring(0,4),g=p.substring(5,7),v=p.substring(8,10),w=new Array;if(w[1]="Jan",w[2]="Feb",w[3]="Mar",w[4]="Apr",w[5]="May",w[6]="Jun",w[7]="Jul",w[8]="Aug",w[9]="Sep",w[10]="Oct",w[11]="Nov",w[12]="Dec",document.write('<li class="recent-posts-list">'),1==showpoststhumbs&&document.write('<a href="'+r+'"><img class="recent-post-thumb" src="'+u+'"/></a>'),document.write('<div class="recent-post-title"><a href="'+r+'" target ="_top">'+i+"</a></div>"),"content"in n)var A=n.content.$t;else if("summary"in n)var A=n.summary.$t;else var A="";var k=/<\S[^>]*>/g;if(A=A.replace(k,""),1==post_summary)if(A.length<summary_chars)document.write(A);else{A=A.substring(0,summary_chars);var y=A.lastIndexOf(" ");A=A.substring(0,y),document.write(A+"...")}var _="",$=0;document.write('<br><div class="recent-posts-details">'),1==posts_date&&(_=_+w[parseInt(g,10)]+" "+v+" "+f,$=1),1==readmorelink&&(1==$&&(_+=" | "),_=_+'<a href="'+r+'" class="url" target ="_top">Read more</a>',$=1),1==showcommentslink&&(1==$&&(_+=" <br> "),"1 Comments"==l&&(l="1 Comment"),"0 Comments"==l&&(l="No Comments"),l='<a href="'+m+'" target ="_top">'+l+"</a>",_+=l,$=1),document.write(_),document.write("</div>"),document.write("</li>")}document.write("</ul>")}
</script>
<script type="text/javascript">
var posts_no = 5;
var showpoststhumbs = true;
var readmorelink = true;
var showcommentslink = true;
var posts_date = true;
var post_summary = true;
var summary_chars = 40;</script>
<script src="/feeds/posts/default?orderby=published&alt=json-in-script&callback=showlatestpostswiththumbs"></script>
<a style="font-size: 9px; color: #CECECE; margin-top: 10px;" href="http://helplogger.blogspot.com/2014/11/5-cool-recent-post-widgets-for-blogger.html" rel="nofollow">Recent Posts Widget</a>
<noscript>Your browser does not support JavaScript!</noscript>
<link href='http://fonts.googleapis.com/css?family=Oswald' rel='stylesheet' type='text/css'/>
<style type="text/css">
img.recent-post-thumb{padding:2px;width:65px;height:65px;float:left;margin:0px 10px 10px;border: 1px solid #69B7E2;}
.recent-posts-container {font-family:'Oswald', sans-serif;font-size:12px;}
ul.recent-posts-container li{list-style-type: none; margin-bottom: 10px;font-size:12px;float:left;width:100%}
ul.recent-posts-container {counter-reset: countposts;list-style-type:none;padding:0;}
ul.recent-posts-container li:before {content: counter(countposts,decimal);counter-increment: countposts;z-index: 1;position:absolute; left: 0px; font-size: 13px;font-weight: bold;color: #fff;background: #69B7E2;line-height:25px;height:25px;width:25px;text-align:center;-webkit-border-radius: 50%;-moz-border-radius: 50%;border-radius: 50%;}
.recent-posts-container a{text-decoration:none;}
.recent-post-title {margin-bottom:5px;}
.recent-post-title a {font-size:12px; text-transform: uppercase; color: #2aace3;}
.recent-posts-details {margin: 5px 0px 0px 92px;font-size:11px;}
.recent-posts-details a{color: #777;}
</style>

Code Provide by : HelpLogger

Agar is tutorial apko pasand ate hain to ap is ko share karsakte hain.
Is tutorial ko leke agar apke man me koievi sawal ho to ap niche comment kar sakte hain.Ap haamere facebook page par vi hamse contact karsakte hain.Click here to go to our facebook.
Jaih Hind, Bande Mataram !