![]() |
Label Widget- ebhabe |
How to show specific label widget.
আপনার Blogger Template এ add করুন Specific Label Widget এবং এর মাধ্যমে আপনার টেম্পলেটকে আরো সুন্দর করে তুলুন। এ widget দিয়ে আপনার নির্দিষ্ট নামের Label ছবি সহ Show করতে পারবেন। সম্পূর্ণ নতুন একটি style এ post করতে পারবেন আপনার Label গুলো। চলুন এ Label Widget টি তৈরী করার ধাপগুলো দেখি।প্রথম ধাপ (First Step) :
- প্রথমে আপনার Template এর Edit এ Click করুন।
- এরপর (Ctrl+F) চেপে ]]></b:skin> টাইপ করে search করুন।
- এবার নিচের Code টি (before) ]]></b:skin> এর উপরে paste করুন।
<!--www.ebhabe.com Recent posts by labels1 start-->img.label_thumb{float:left;margin-right:10px !important;height:65px; /* Thumbnail height */width:65px; /* Thumbnail width */border: 1px solid #fff;-webkit-border-radius: 10px;-moz-border-radius: 10px;border-radius: 10px;-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 {float: left;width: 100%;min-height: 70px;margin: 0px 10px 2px 0px;padding: 0;}ul#label_with_thumbs li {padding:8px 0;min-height:65px;margin-bottom:0px;border-bottom: 1px dotted #999999;}#label_with_thumbs li{list-style: none ;padding-left:0px !important;}#label_with_thumbs a { text-transform: uppercase;}#label_with_thumbs strong {padding-left:0px; }<!--www.ebhabe.com Recent posts by labels1 end-->
দ্বিতীয় ধাপ (Second Step) :
- এবার (Ctrl+F) চেপে </head> টাইপ করে search করুন।
- এবার নিচের Code টি (before) </head> এর উপরে paste করুন।
<!--www.ebhabe.com Recent posts by labels2 start--><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;}elseif("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><!--www.ebhabe.com Recent posts by labels2 end-->
তৃতীয় ধাপ (Third Step) :
- এবার (Ctrl+F) চেপে </body> টাইপ করে search করুন।
- এখন নিচের Code টি (before) </body> এর উপরে paste করুন।
- এবার Template টি save করুন।
<!--www.ebhabe.com Recent posts by labels3 start--><script type='text/javascript'>function changeThumbSize(id,size){var blogGadget = document.getElementById(id);var replacement = blogGadget.innerHTML;blogGadget.innerHTML = replacement.replace(/s72-c/g,"s"+size+"-c");var thumbnails = blogGadget.getElementsByTagName("img");for(var i=0;i<thumbnails.length;i++){thumbnails[i].width = size;thumbnails[i].height = size;}}changeThumbSize("label_with_thumbs",70);</script><!--www.ebhabe.com Recent posts by labels3 end-->
চতুর্থ ধাপ (Fourth Step) :
- এবার আপনার Template এর Layout এ Click করুন।
- এরপর Add a Gadget এ click করুন।
- এরপর HTML /JavaScript এ click করুন।
- HTML /JavaScript এর Edit এ click করুন।
- Title Name টাইপ করুন ও Content এ নিচের Code paste করুন।
- নিচের Red Color Widget replace করে আপনার (your) Label Name টাইপ করুন।
- HTML /JavaScript টি Save করুন।
- এবার আপনার Template টি Save করুন।
<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 = 100;</script><script type="text/javascript" src="/feeds/posts/default/-/Widget?published&alt=json-in-script&callback=labelthumbs"></script>
নোট : Red Color এর Widget replace করে আপনার (your) Label Name টাইপ করতে ভুলবেন না। আশা করি Specific Label Widget টি তৈরী করতে পেরেছেন।
How To Create Specific Label Posts Widget For Blogger
ReplyDeletehttps://www.tellforceblog.com/2017/10/how-to-create-specific-label-posts.html
Sorry for my late reply. Thanks for your link.
ReplyDelete