Blogger

Add Particular Label Posts Widget For Blogger

After so many tutorials I came to know about a working code which works perfectly for displaying particular label posts in side widget or in the body. However, there are many benefits of this widget, if you want to display different label posts on homepage then it will attract your visitors attention and it will also attract some curiosity towards your blog’s design also. Here are the steps to be followed:

Steps To Be Followed :

Firstly, you should give a specific and unique label to your posts which you want to be shown up on another blog. 
Secondly, Paste and edit some part of the code given below in any HTML supported base.In case of Blogger you can paste it in the HTML/Javascript widget.

<style>
/* Recent posts by labels
——————————— */ 
img.label_thumb{
float:left;
margin-right:10px !important;
height:72px; /* Thumbnail height */
width:72px; /* Thumbnail width */
border: 1px solid #fff;
-webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, .4);
-moz-box-shadow: 0 1px 1px rgba(0, 0, 0, .4);
box-shadow: 0 1px 1px rgba(0, 0, 0, .4);
}
#label_with_thumbs { text-align: justify;
font: normal 18px Port Lligat Slab;
float: left;
width: 98%;
min-height: 70px;
margin: 0px 10px 2px 0px;
padding: 0;
}
ul#label_with_thumbs li {
padding:8px 0;
min-height:75px;
margin-bottom:0px;
border-bottom: 1px dotted #999999;
}
#label_with_thumbs li{
list-style: none ;
padding-left:0px !important;
}
#label_with_thumbs a:visited {
    text-decoration: none;
    color: black;}
#label_with_thumbs a:link {
    text-decoration: none;
    color: black;}
#label_with_thumbs a { text-transform: none;}
#label_with_thumbs a:hover { text-decoration: underline;}
#label_with_thumbs strong {padding-left:0px; }</style>
<script type=’text/javascript’>
//<![CDATA[
function labelthumbs(json){document.write(‘<ul id=”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=’http://3.bp.blogspot.com/-zP87C2q9yog/UVopoHY30SI/AAAAAAAAE5k/AIyPvrpGLn8/s1600/picture_not_available.png’;}
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]=”June”;monthnames[7]=”July”;monthnames[8]=”Aug”;monthnames[9]=”Sept”;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>
<script type=’text/javascript’>var numposts = 5;var showpostthumbnails = true;var displaymore = false;var displayseparator = true;var showcommentnum = false;var showpostdate = false;var showpostsummary = true;var numchars = 200;</script> 
<script type=”text/javascript” src=”/feeds/posts/default/-/Articles2Read?published&alt=json-in-script&callback=labelthumbs”></script>

Replace The Following With Your Details:

var numposts = 5 – Replace 5 with the number of post you want to show.
Articles2Read – Change it with the label of the posts of the blog.

Article written by:

Satyendra is a Biotechnologist from the city of Nawabs, Lucknow. Apart from blogging, his other interests are Indian rap knowledge, affiliate marketing, poetry, and basically anything nerdy.

Join the discussion

  1. Anonymous

    Good it's work

  2. Chidera

    How can I get more prettier and nice looking designs to achieve this? Thanks

  3. Negosyo Tayo

    Hi. Thanks for the widget. I was able to modify the font style and color. Just wondering how to modify the spacing as well? thank you.

  4. relationshiptipsng

    Hi! Thanks for the Good Work, is work for me very well my check it out on my blog: https://agrobusinessngr.blogspot.com

  5. Iskael

    thanks
    it works for me

  6. Unknown

    Not working for me. I followed step by step. Still failed. Please help.

  7. Unknown

    Can you please help me in setup these things. I did but not worked for me.

  8. froggiegirl

    Why is it only showing 25 posts for me? I set it to a max of 900 and I have 98 posts with the given tag…

    http://playstlouis.blogspot.com/p/things-to-do-indoors.html

  9. kaan acar

    thanks for this gadget is wonderful

  10. Dhar News

    Nice Its Working

  11. Dhar News

    Nice Its Working

  12. Dhar News

    Nice But More Post Link Not Available
    Please More Most Link Code

  13. Dhar News

    Nice But More Post Link Not Available
    Please More Most Link Code

  14. Previous Papers

    How to show in Mobile view

  15. Admin

    its working for me.

    Pls let me know how my blog is
    http://www.abroadplus.com

  16. Unknown

    Great! Thank you so much

  17. रवि रतलामी

    Any modification / change for RANDOM post instead of RECENT posts?

  18. Got job alerts

    It's not working why bro?
    Please reply.

  19. Rahul Kumar

    When I click that post it goes on my second bog website

  20. francis mboya

    Hi! Thanks for the Good Work, is work for me very well my check it out on my blog: https://kilimanjaroyetu.com

Leave a Reply

Your email address will not be published.

This site uses Akismet to reduce spam. Learn how your comment data is processed.

back to top