Feb 1, 2016

ব্লগার ব্লগে আকর্ষনীয় Most Commented Posts Widget যুক্ত করুন!

ব্লগার ব্লগে আকর্ষনীয় Most Commented Posts Widget যুক্ত করুন!
সম্প্রতি অনেকে আমার কাছে জিজ্ঞেস করেছিলেন বিভিন্ন ব্লগে Most Commented Post Widget সম্পর্কিত পোষ্ট পাওয়া যাচ্ছে কিন্তু এর কোনটিই কাজ করছে না। তাদের প্রশ্নের ভিত্তিতে আমিও অনেক ইংরেজী ব্লগের এ ধরনের কয়েকটি Widget নিয়ে পরীক্ষা করেছিলাম। আমার ক্ষেত্রেও তাদের মত একই ফলাফল হয়েছিল অর্থাৎ এদের কোনটিই কাজ করেনি। প্রথম দিকে আমিও বিষয়টি বুঝতে পারিনি, তবে সবশেষে বিষয়টি আমার দৃষ্টিতে ধরা পড়ে। ঐ গুলি কাজ না করার প্রধান কারণ হচ্ছে ব্লগার ব্লগের বেশীর ভাগ Most Commented Posts Widget টির Scripts ব্যবহার করা হয়েছিল Yahoo Pipe Feed থেকে, কিন্তু সম্প্রতি Yahoo কোম্পানি তাদের এই Pipe Feed বন্ধ করে দেয়। যার কারনে ব্লগের Most Commented Widget টি কাজ করছিল না।
ব্লগার ব্লগে আকর্ষনীয় Most Commented Posts Widget যুক্ত করুন!
উপরের চিত্রে Most Commented Posts Widget এর ডেমো দেখতে পাচ্ছেন। এটির ব্যহ্যিক ডিজাইন আমার নিজের তৈরি নয়। এই উইজেট এর Css Style টি MybloggerTricks থেকে নেওয়া হয়েছে। আমি এটির অকার্যকর Yahoo Pipe Scripts এর পরিবর্তে Json Feed ব্যবহার করেছি। এর ফলে এটি যে কোন ব্লগে কাজ করার পাশাপাশি আরও দ্রুত লোড নেবে। উল্লেখ্য যে, এ ধরনের যত উইজেট রয়েছে সবগুলিতে এখন থেকে Yahoo Pipe Scripts এর পরিবর্তে Json Feed ব্যবহার করতে হবে। তা না হলে উইজেটটি কাজ করবে না। লাইভ ডেমো দেখুন- Live Demo

কিভাবে ব্লগে যুক্ত করবেন?

  • প্রথমে আপনার ব্লগে লগইন করুন।
  • ব্লগার ড্যাশবোর্ড হতে Layout এ ক্লিক করুন।
  • এখন ডান পাশের লেআউট হতে Add Gadget এ ক্লিক করুন। নিচের চিত্রে দেখুন -
ব্লগে নতুন উইজেট যুক্ত করা
  • তারপর HTML/JavaScript এ ক্লিক করুন।
ব্লগার ব্লগে আকর্ষনীয় Most Commented Posts Widget যুক্ত করুন!
  • এবার নিচের কোডগুলি কপি করে HTML/JavaScript এর ঘরে পেষ্ট করুন।
<style type='text/css'>
#most-comments ul {border:1px solid #E1E1E1;padding:0px;margin-top:-12px}
#most-comments ul li{list-style:outside none none;clear:both;padding:5px 5px 10px 5px!important;border-bottom:1px dashed #dedede;line-height:2em;font-weight:bold;text-align:justify}
#most-comments li:last-child {border-bottom:0px dashed #dedede}
.comments-count{background:#157bda;width:45px;float:left;margin:2px 15px 35px 0;font-weight:bold;font-size:1.3em;text-align:right;font-family:georgia,Helvetica;padding:0 0 4px 0;text-align:center;color:#FFF;text-shadow:4px 1px #202022;position:relative;top:5px;border-radius:2px}
.comments-count:after{content:' ';position:absolute;width:0;height:0;right:0;top:100%;border-width:8px 8px;border-style:solid;border-color:#157bda #157bda rgba(0,0,0,0) rgba(0,0,0,0);top:24px;right:6px}
</style>
<script type='text/javascript'>
//<![CDATA[
var numPosts=5;
var homePage="prozokti.com";
var postTitlear=new Array();
var postUrlar=new Array();
var postCommentar=new Array();
var totalpost;document.write('<div id="most-comments"><ul>');
function mostComment(j){var a=j.feed.entry.length;totalpost=a;
for(var f=0;f<a;f++){
var h=j.feed.entry[f];
var c=h.title.$t;var b;
var g;if(f==j.feed.entry.length){break}
for(var d=0;d<h.link.length;d++){
if(h.link[d].rel=="alternate"){g=h.link[d].href;break}}
for(var d=0;d<h.link.length;d++){
if(h.link[d].rel=="replies"&&h.link[d].type=="text/html"){b=h.link[d].title.split(" ")[0];}};
postTitlear.push(c);
postUrlar.push(g);
postCommentar.push(b)}sortPosts();
for(var f=0;f<numPosts;f++){var e='<li><span class="comments-count">'+postCommentar[f]+'</span><a href="'+postUrlar[f]+'" title="'+postTitlear[f]+'" target="_blank">'+postTitlear[f]+'</a>';
document.write(e)}}
function sortPosts(){function c(d,f){var e=postTitlear[d];
postTitlear[d]=postTitlear[f];
postTitlear[f]=e;
var e=postUrlar[d];
postUrlar[d]=postUrlar[f];
postUrlar[f]=e;
var e=postCommentar[d];
postCommentar[d]=postCommentar[f];
postCommentar[f]=e}
for(var b=0;b<postTitlear.length-1;b++){
for(var a=b+1;a<postTitlear.length;a++){
if(parseInt(postCommentar[b])<parseInt(postCommentar[a])){c(b,a)}}}}
document.write('<script src="http://'+homePage+'/feeds/posts/default?max-results=9999&orderby=published&alt=json-in-script&callback=mostComment"><\/script>');
document.write('</li>')
document.write('</ul>')
document.write('</div>');
//]]>
</script>
  • সবশেষে Gadget টি Save করুন।

কাষ্টমাইজেশনঃ

  • উপরের লাল কালারের prozokti.com এর স্থলে আপনার ব্লগের Url বসান। Url টি অবশ্যই https//:www ছাড়াই আমাদের এড্রেসের মত হতে হবে।
  • এরপর নীল কালারের সংখ্যাটির জায়গায় আপনি যতটি পোষ্ট দেখাতে চান ততটি সিলেক্ট করে দিতে পারেন।
  • উইজেটের Border রাখতে না চাইলে border:1px solid #E1E1E1 ডিলিট করে দেবেন।
  • সবুজ কালারের background:#157bda হতে Comment Count এর Background কালার পরিবর্তন করা যাবে।
Subcribe to our all updates

and Share on
পূর্ববর্তী পোষ্ট
পরবর্তী পোষ্ট

2 টি মন্তব্য: Post Yours! Read Comment Policy ▼
লক্ষ্য করুনঃ
পোষ্টের সাথে সম্পৃক্ত নয় এমন কোন কমেন্ট করা যাবে না। কোন কারণ ব্যতীত আপনার ব্লগের লিংক শেয়ার করতে যাবেন না। সবসময় গঠনমূলক মন্তব্য প্রদানের চেষ্টা করবেন। আমরা সবার মতামত সমানভাবে মূল্যায়ন করি এবং যথাসময়ে প্রতি উত্তর দেয়ার চেষ্টা করি।

 
Subscribe for all Updates

Subscribe Now

কপিরাইট © 2015- প্রযুক্তি ডট কম ™, সর্বস্বত্ব সংরক্ষিত

Powered by: