Hello Guys,
इस Post में मैं आपको अपने Blog पर Recent Post Widget कैसे लगाते है, वो Share करने वाला हूँ।
Recent post का मतलब हुआ कि सबसे नया Post। दोस्तो जब आप ये Widget अपने Blog पर लगाएंगे तो इस Widget में आपको अपने Blog पर का सबसे Latest Post Show होगा।

दोस्तो, कई बार ऐसा होता है कि आपके पुराने post पर visitors आते है तो उन्हें पता नही चल पाता कि आपके blog का सबसे latest post कोन सा है। इसके लिए उन्हें आपके mainpage पर जाना पड़ेगा। पर जब ये widget आपके blog पर होगा तो वो आसानी से आपके latest post को देख के पढ़ सकेंगे।

Style #1 :

<br />
<div class="recentpoststyle">
<br />
<script type="text/javascript"><br />
function showlatestposts(e){for(var t=0;t<posts_no;t++){var r,s=e.feed.entry[t],n=s.title.$t;if(t==e.feed.entry.length)break;for(var a=0;a<s.link.length;a++)if("alternate"==s.link[a].rel){r=s.link[a].href;break}n=n.link(r);var i="... read more";i=i.link(r);var l=s.published.$t,o=l.substring(0,4),u=l.substring(5,7),c=l.substring(8,10),m=new Array;if(m[1]="Jan",m[2]="Feb",m[3]="Mar",m[4]="Apr",m[5]="May",m[6]="Jun",m[7]="Jul",m[8]="Aug",m[9]="Sep",m[10]="Oct",m[11]="Nov",m[12]="Dec","content"in s)var d=s.content.$t;else if("summary"in s)var d=s.summary.$t;else var d="";var v=/<\S[^>]*>/g;if(d=d.replace(v,""),document.write('
<li class="recent-post-title">'),document.write(n),document.write('</li>
<div class="recent-post-summ">
'),1==post_summary)if(d.length<summary_chars)document.write(d);else{d=d.substring(0,summary_chars);var f=d.lastIndexOf(" ");d=d.substring(0,f),document.write(d+" "+i)}document.write("</div>
"),1==posts_date&&document.write('<div class="post-date">
'+m[parseInt(u,10)]+" "+c+" "+o+"</div>
")}}<br />
</script><br />
<script type="text/javascript"><br />
var posts_no = 5;var posts_date = true;var post_summary = true;var summary_chars = 80;</script><br />
<script src="/feeds/posts/default?orderby=published&alt=json-in-script&callback=showlatestposts"><br />
</script><a style="font-size: 9px; color: #CECECE;margin-top:10px;" href="https://www.abhinavajmods.com/2017/04/recent-post-widget.html" rel="nofollow">Recent Posts Widget</a><br />
<noscript>Your browser does not support JavaScript!</noscript><br />
<style type="text/css"><br />
.recentpoststyle {counter-reset: countposts;list-style-type: none;}<br />
.recentpoststyle a {text-decoration: none;color: #49A8D1;}<br />
.recentpoststyle a:hover {color: #000;}<br />
.recentpoststyle li:before {content: counter(countposts,decimal);counter-increment: countposts;float: left;z-index: 1;position:relative;font-size: 15px;font-weight: bold;color:#fff;background:#69B7E2; margin:13px 5px 0px -6px;line-height:30px;width:30px;height:30px;text-align:center;-webkit-border-radius:50%;-moz-border-radius:50%;border-radius:50%;}li.recent-post-title{margin-bottom: 5px;padding: 0;}<br />
.recent-post-title a {color: #444;text-decoration: none;font: bold 13px "Avant Garde",Avantgarde,"Century Gothic",CenturyGothic,AppleGothic,sans-serif;}<br />
.post-date {font-size: 11px;color: #999;margin:5px 0px 15px 32px;}<br />
.recent-post-summ {border-left:1px solid #69B7E2; color: #777; padding: 0px 5px 0px 20px; margin-left: 10px; font: 15px Garamond,Baskerville,"Baskerville Old Face","Hoefler Text","Times New Roman",serif;}<br />
</style></div>
<br />

Style #2 :

<br />
<script type="text/javascript"><br />
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/AVvXsEhArZ2vPRPPdGQT-EC2xPaikI8kIvVmiAbPyGBjjtu7Hf8o4Pul8kHH3TbxBahA-bUnzdH7ODP8zKnW2DiOpzSJq9DIDMKWAgOl_w1GNe98G-rMPlJSeSIlLpKIoMvXOQy1P2mLNL8PdwYe/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>
")}<br />
</script><br />
<script type="text/javascript"><br />
var posts_no = 5;<br />
var showpoststhumbs = true;<br />
var readmorelink = true;<br />
var showcommentslink = true;<br />
var posts_date = true;<br />
var post_summary = true;<br />
var summary_chars = 40;</script><br />
<script src="/feeds/posts/default?orderby=published&alt=json-in-script&callback=showlatestpostswiththumbs"></script><br />
<a style="font-size: 9px; color: #CECECE; margin-top: 10px;" href="https://www.abhinavajmods.com/2017/04/recent-post-widget.html" rel="nofollow">Recent Posts Widget</a><br />
<noscript>Your browser does not support JavaScript!</noscript><br />
<link href='http://fonts.googleapis.com/css?family=Oswald' rel='stylesheet' type='text/css'/><br />
<style type="text/css"><br />
img.recent-post-thumb{padding:2px;width:65px;height:65px;float:left;margin:0px 10px 10px;border: 1px solid #69B7E2;}<br />
.recent-posts-container {font-family:'Oswald', sans-serif;font-size:12px;}<br />
ul.recent-posts-container li{list-style-type: none; margin-bottom: 10px;font-size:12px;float:left;width:100%}<br />
ul.recent-posts-container {counter-reset: countposts;list-style-type:none;padding:0;}<br />
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%;}<br />
.recent-posts-container a{text-decoration:none;}<br />
.recent-post-title {margin-bottom:5px;}<br />
.recent-post-title a {font-size:12px; text-transform: uppercase; color: #2aace3;}<br />
.recent-posts-details {margin: 5px 0px 0px 92px;font-size:11px;}<br />
.recent-posts-details a{color: #777;}<br />
</style><br />

अपने Blog में Recent Post Widget कैसे लगायें

आप दोनों में से जो widget add करना चाहते हैं उसके नीचे का code copy कर लें।
Code Copy करने के लिए आप Code वाले box में click करें और Keyboard से Ctrl+A button दबाएं।

Step 1 : अपने Blogger Account में login करें

Step 2 : Layout में जाएं और sidebar में Add A Gadget पर click करें

Step 3 : अब एक Popup Window खुलेगा उसमे HTML/JavaScript पर click करें

Step 4 : अपने जो code copy किया उसे paste करें

Step 5 : Save पर click करें

Thats It :-)

Also Read : Responsible Back To Top Button For Blogger
Also Read : A2JM Social Icons Widget For Blogger
Also Read : New Post को 1 मिनट के अंदर Search Engine में कैसे लाएं ( Fast Indexing Trick )

अगर आपको हमारा ये post पसन्द आया तो please share जरूर करें।
अपने सुझाव और परेशानी हमसे comment करके पूछें। हमारे blog पर visit करने के लिए thanx, हमेशा visit करते रहें।