Menambahkan Tombol LIKE pada Komentar
Pada kesempatan yang lalu saya sudah membahas tentang cara "Memberi Nomor Urut pada Komentar" dan sekarang saya akan membagikan tips cara menambahkan tombol like pada komentar, tutorial ini kurang lebih caranya sama dengan posting sebelumnya. menurut saya tutorial ini sangat keren.. tidak kalah dengan fitur-fitur komentar pihak lain seperti DisQus dll. heheh :D.
Tutorial ini saya dapatkan ketika berjalan-jalan di http://blog.duypham.info/. ternyata bener memang banyak sekali manfaat blogwalking yang kita dapatkan, selain bertemu master-master blogger kita juga mendapatkan ilmu-ilmu baru tentang blog. Ini sudah saya coba dan berhasil, kurang lebih hasilnya sepeti gambar diatas. Setiap ada tutorial yang menurut saya menarik saya akan peraktekan dan apabila berhasil maka akan saya bagikan, Tapi jika gagal tidak akan saya bagikan karena saya tidak mau membuat pengunjung kecewa. :D.
OK langsung saja kita masuk pada tahap pemasangan.
1. Pada dasboard, Masuk ke Template > pilih Edit HTML > lalu Centang Expand template widget.
Letakkan kode berikut ini diatas kode ]]></b:skin>
Letakkan kode berikut ini diatas kode ]]></b:skin>
.like-cm {margin-top:15px;width:10px;height:10px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjCHJPq3Pb6tyHAPh9w0pMtT85iVB5iInp5-g0m8y6LnoOG2ALoKNuD38V71VwiVCJZofRBLOZcEs0HjWSjHJ_khweAxE6KKQtatnFOoRmvuvbNSoC4xhhv8WRLoo6zKqqdU82mdue7XaU/s10/like.png) no-repeat}2. cari kode seperti ini
(function() {
var items = <data:post.commentJso/>;
kemudian ganti dengan kode berikut ini
var items_copy=[];3. cari kode <data:post.commentHtml/>
(function() {
var items = <data:post.commentJso/>;
items_copy=items;
dan letakkan kode berikut ini tepat dibawahnya
<script type='text/javascript'># Tulisan yang berwarna hijau merupakan URL gambar tombol like,
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>
Silahkan anda sesuaikan sendiri. "Berkreasilah sesuka anda, jangan biarkan keratifitasmu terbelenggu"
Semoga bermanfaat.
Posting Komentar
Untuk menyisipkan gambar, gunakan tag <i rel="image">URL GAMBAR ANDA...</i>
Untuk menyisipkan kode, gunakan tag <i rel="pre">KODE ANDA...</i>
Untuk menciptakan efek tebal gunakan tag <strong>TEKS ANDA...</strong>
Link aktif akan dimatikan secara otomatis.
NB: Jika ingin menuliskan kode pada komentar harap gunakan Tool untuk mengkonversi kode tersebut agar kode bisa muncul dan jelas atau gunakan tool dibawah "Konversi Kode di Sini!".
NB: Jika ingin menuliskan komentar yang keluar dari topik pada artikel ini silahkan kehalaman OOT (Out Of Topic) dengan menekan tombol OOT di bawah ini.