Desain Widget Artikel Paling Banyak Dikomentari

Cara Memasang Widget Artikel Paling Banyak Dikomentari

Artikel ini masih tidak jauh berbeda dengan cara memasang komentar pembaca di blog seperti yang ada pada bagian bawah artikel ini. Tentu tujuan dan pentingnya hal itu juga sudah kami jelaskan pada artikel tersebut.

Namun pada bahasan ini, agak sedikit berbeda. Umumnya yang tertampil pada sidebar sebuah blog kan adanya artikel terpopuler pembaca, tengok saja pada situs ini. Artikel terpopuler pembaca adalah 9 blog berpenghasilan tertinggi di Indonesia dari Google Adsense. Hal itu didasarkan pada banyaknya pembaca pada artikel tersebut.

Sedangkan tips kali ini, artikel terpopuler yang akan ditampilkan berdasarkan banyaknya komentar pembaca. Jadi, mungkin nantinya bisa sama, atau bahakan berbeda, tergantung kesamaan atau tidaknya dari trafik banyaknya komentar dengan artikel terpopuler dibaca.

Selain itu, proses pemasangan artikel terpopuler berdasar banyaknya komentar juga begitu menarik dan keren. Lebih pentingnya, tidak membebani kecepatan loading blog sobat kok.

Cara Memasang Widget Most Commented di Blog

Tidak jauh berbeda dengan tutorial blog lainnya, tips kali ini tidak berhubungan dengan utak-atik template kok. Cuma dengan membuat widget baru, dan copas beberapa code simpan deh. Nih urut-urutannya:

1. Buka akun blogger
2. Pilih tata letak (layout) > pilih sidebar untuk pemasangan widget
3. Tambahkan gadget (add gadget) > JavaScripte/HTML
4. Copas code di bawah ini ke dalam widget yang sudah ditambahkan

<div id="most-comments"></div>
<style scoped='' type='text/css'>
#most-comments li,#most-comments ul,#most-comments ul li{margin:0;list-style:none;color:#444;font-family:'Open Sans',Helvetica,Arial,sans-serif;font-size:14px}#most-comments ul li{position:relative;overflow:hidden;background:#fff;margin:3.5px 0;padding:7px 10px 7px 50px;white-space:nowrap;text-overflow:ellipsis;box-shadow:inset 0 0 #fc4f3f;border:1px solid #e6e6e6;transition:all .6s}#most-comments ul li:hover{box-shadow:inset 310px 0 #fc4f3f}#most-comments ul li a{color:#444;font-weight:700;text-decoration:none;transition:all .3s}#most-comments ul li a:hover,#most-comments ul li:hover a{color:#fff}.count-most{position:absolute;left:0;top:0;width:40px;height:100%;margin:0;padding:7px 0;background-color:#383838;color:#fff!important;text-align:center;transition:all .3s}#most-comments ul li:hover .count-most{background-color:#fc4f3f}
</style>
<script type='text/javascript'>
//<![CDATA[
var numPosts=10;
var homePage="www.forumblogindo.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="count-most">'+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>

Note: ganti kode warna merah di atas diganti dengan alamat Url blog sobat

5. Save/simpan

Mudah kan. Demikian penjelasan