Memasang Widget Most Comments Postingan Di Blogger
Memasang Widget Most Comments Postingan di Blogger - Kali ini aku akan membuatkan widget yang berfungsi menampilkan jumlah komentar pada postingan blogger dalam bentuk widget di sidebar blog.
Dalam widget ini kalau sebuah artikel mempunyai jumlah komentar terbanyak maka posisi artikel berada di paling atas dengan jumlah komentarnya. Cara kerjanya hampir sama dengan widget popular post yang memunculkan daftar teratas dari artikel yang paling banyak dilihat.
Ok eksklusif saja bagi yang tertarik dengan widget yang menarik ini dan ingin eksklusif mencobanya, silakan teman salin semua instruksi di bawah ini ke dalam widget baru.
Cara Memasang Widget Most Comments Postingan di Blogger
Buka Blogger, kemudian buka sajian Tata letak, sesudah itu Klik tambahkan gadget dan tambahkan HTML/JavaScript, kemudian salin semua instruksi di bawah ini dan letakkan di dalam widget.
<div id="most-comments"></div> <style scoped='' type='text/css'> #most-comments ul,#most-comments li,#most-comments ul li{margin:0;list-style:none;color:#999;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:10px 50px 10px 5px;white-space:nowrap;text-overflow:ellipsis;border-bottom:1px dotted #eee;transition:all .6s;} #most-comments ul li:hover{box-shadow:inset 310px 0 #f24a4a;border-radius:2px;} #most-comments ul li a{color:#243140;text-decoration:none;transition:all .3s;} #most-comments ul li a:hover{color:#fff;} #most-comments ul li:hover a{color:#fff;} .count-most{position:absolute;right:0;top:0;width:30px;height:20px;margin:0;padding:5px 0 0 0;margin:5px 0 3px 0;border-radius:3px;background:#f4f4f4;color:#999!important;text-align:center;transition:all .3s;} #most-comments ul li:hover .count-most{background:none;color:#fff!important;} </style> <script type='text/javascript'> //<![CDATA[ var numPosts=10; var homePage="www.urlsobat.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="Memasang Widget Most Comments Postingan di Blogger" 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>Ganti instruksi "var numPosts=10" dengan jumlah post yang ingin ditampilkan, dan "www.urlsobat.com" dengan url blog sobat.
Selanjutnya Simpan Widget dan lihat hasilnya.
Demikian tutorial kali ini, Selamat mencoba dan agar bermanfaat. Sumber https://www.denylistianto.com/