Recent Posts By Label Code For Blogger

Step 1: In your Blogger Dashboard click > Template as shown in below image.

In your Blogger Dashboard click > Design > Edit Html check Expand

Step 2: Find the following piece of code in your blogs Html : (Click + F for a search bar to help find the code

]]></b:skin>

Step 3. Copy and paste the following code Directly Above

/*** Recent Labels Gadget Css ***/ 
img.label_thumb{ 
float:left; 
padding:5px; 
border:1px solid #8f8f8f; 
background:#D2D0D0; 
margin-right:10px; 
height:55px; 
width:55px; 
} 
img.label_thumb:hover{ 
background:#f7f6f6; 
} 
.label_with_thumbs { 
float: left; 
width: 100%; 
min-height: 70px; 
margin: 0px 10px 2px 0px; 
adding: 0; 
} 
ul.label_with_thumbs li { 
padding:8px 0; 
min-height:65px; 
margin-bottom:10px; 
} 
.label_with_thumbs a {} 
.label_with_thumbs strong {}

Step 4. Find the following piece of code in your blogs Html : (Click + F for a search bar to help find the code

</head>

Step 5. Copy and paste the following code Directly Above </head>

<script type='text/javascript'> 
//<![CDATA[ 
function labelthumbs(json){document.write('<ul class="label_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://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgBEwDS3B90cuWw7nyOoEKpjiu0W10pw-S8eLokGMOsQoDj6vGSz4xTlvpdp60Z1nz__xA6_LS_W4MQHpCA5Wpuq2TLO6_474eC7bbYm-6_GTpxECuLgksBPSQtE-bHHktl8mBz1Fsnie5S/';} 
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]="Feb";monthnames[3]="Mar";monthnames[4]="Apr";monthnames[5]="May";monthnames[6]="Jun";monthnames[7]="Jul";monthnames[8]="Aug";monthnames[9]="Sep";monthnames[10]="Oct";monthnames[11]="Nov";monthnames[12]="Dec";document.write('<li class="clearfix">');if(showpostthumbnails==true) 
document.write('<a href="'+posturl+'" target ="_top"><img class="label_thumb" src="'+thumburl+'"/></a>');document.write('<strong><a href="'+posturl+'" target ="_top">'+posttitle+'</a></strong><br>');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('');document.write(postcontent);document.write('');} 
else{document.write('');postcontent=postcontent.substring(0,numchars);var quoteEnd=postcontent.lastIndexOf(" ");postcontent=postcontent.substring(0,quoteEnd);document.write(postcontent+'...');document.write('');}} 
var towrite='';var flag=0;document.write('<br>');if(showpostdate==true){towrite=towrite+monthnames[parseInt(cdmonth,10)]+'-'+cdday+' - '+cdyear;flag=1;} 
if(showcommentnum==true) 
{if(flag==1){towrite=towrite+' | ';} 
if(commenttext=='1 Comments')commenttext='1 Comment';if(commenttext=='0 Comments')commenttext='No Comments';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">More »</a>';flag=1;;} 
document.write(towrite);document.write('</li>');if(displayseparator==true) 
if(i!=(numposts-1)) 
document.write('');}document.write('</ul>');} 
//]]> 
</script>

Step 6. Save your template, we have added the Css to style the gadget and the script to make the gadget work.Now we just have to add the gadget code to your sidebar in a Html/Javascript gadget.

Step 7. Click back to your Design Page > Click Add A Gadget > Choose Html/Javascript from the pop up menu :

Step 8. Copy and paste the code below into the Html/Javascript gadget.

<script type='text/javascript'>var numposts = 3;var showpostthumbnails = true;var displaymore = false;var displayseparator = false;var showcommentnum = false;var showpostdate = false;var showpostsummary = true;var numchars = 80;</script> 
<script type="text/javascript" src="/feeds/posts/default/-/LABEL?orderby=updated&alt=json-in-script&callback=labelthumbs"></script>

NOTE - You must add the name of the label you want to to the above code. Replace LABEL in green (bod) with your label name.

If your label have the combination of two words then add %20 between the label.

Example: If you label name is Computer Tricks then  in the you have to write

Computer%20Tricks

Save and you are done. Best of luck for your blog.