AABI‍TALITA BLOG
4.26.2013

Cara Menambahkan Tombol Like Pada Komentar Blog


Dikesempatan kali ini saya coba membahas tentang cara menambahkan tombol like pada komentar blog, menurut saya fitur ini cukup keren juga untuk ditambahkan pada komentar blog sehingga tampilannya tidak kalah menarik dengan fitur komentar yang dimiliki pihak lain seperti DisQus dll.

Pemasangan tombol like ini akan menunjukan kepada kita seberapa banyak orang yang menyukai komentar yang kita buat pada sebuah artikel dan tombol like bisa juga dimanfaatkan oleh  pemilik blog sebagai bentuk apresiasi kita kepada para pengunjung yang telah singgah dan berkomentar pada artikel yang kita buat.Untuk penampakannya kurang lebih seperti gambar dibawah ini :

                                      


Nah bagi sobat yang berminat menggunakan tips ini langsung saja kita masuk pada tahap pemasangannya :

1. Masuk ke menu Template > pilih Edit HTML>Cari kode ]]></b:skin> (gunakan Ctrl+F untuk mempermudah pencarian) dan jika sudah ketemu Letakkan kode berikut ini diatas kode 
]]></b:skin>

.like-cm {margin-top:15px;width:10px;height:10px;background:url(http://lh6.ggpht.com/-smRIL9DaITs/UM9cIp-I8bI/AAAAAAAABeM/wAw1Z1sgj78/s10/like.png) no-repeat}

2. Selanjutnya cari kode seperti dibawah ini :  
 
(function() {
      var items = <data:post.commentJso/>;

Jika sudah ketemu ganti kode tersebut dengan kode berikut :

    var items_copy=[];
(function() {
var items = <data:post.commentJso/>;
items_copy=items;

3. Kemudian cari lagi kode <data:post.commentHtml/> dan letakkan kode berikut ini tepat dibawahnya.

<script type='text/javascript'>
var likeurl='<data:blog.url/>';
//<![CDATA[
for(i=0;i<items_copy.length;i++){a=document.getElementById('c'+items_copy[i].id);gl="'"+items_copy[i].id+"'";b=a.innerHTML+'<div class="like-cm" onmousemove="likecom('+gl+')"><div id="like-cm'+items_copy[i].id+'"></div></div>';a.innerHTML=b}function likecom(i){var a=document.getElementById('like-cm'+i);if(a){a.innerHTML='<iframe style="margin:-6px 0 0 -13px" frameborder="0" allowtransparency="true" scrolling="no" height="20" src="http://www.blogger.com/blog-post-reactions.g?options=[Like]&textColor=%23666666#'+likeurl+i+'" width="100"><\/iframe>'}}
//]]>
</script> 

4. Terakhir save template dan sobat bisa lihat hasilnya.

Demikian tutorial tentang Cara Menambahkan Tombol Like Pada Komentar Blog semoga bermanfaat.

8 komentar

Bagus juga tuh mas...
Sayang skrg saya lagi ga kepikiran nambah javascript dari pihak ketiga...

BTW asyik tuh jempolnya hehehe (h)

hehe makasih om,tapi lumayan enteng om buat di terapkan diblog...

kalo soal jempol kompi ajaib is my inspiration :))

kalo cara buat tombol dislikenya gimana bro? kalo ada tutornya kasih tau yaaa, siipp!!

gan, kok kalo nyari pake CTRL + F gak pernah ketemu kode nya ya gan ?

akan mempengaruhi loading dan kapasitas blog ga ya kira-kira mas??

Spesialis penyakit dalam, termasuk wasir atau wasir, pengobatan herbal
obat wasir

Ko ga tampil ya tombol likenya, yg tampil cuma iconnya doang gan.

Terima kasih atas kunjungannya, silahkan berkomentar sesuai topik. Menuliskan link aktif tidak akan ditampilkan dalam komentar.Terima Kasih.