Update!!! Cara Membuat Emoticon Di Kotak Komentar

Melihat banyaknya pertanyaan yang disampaikan kepada admin blog, yang mengatakan bahwa kode emoticon sebelumnya tidak berhasil diterapkan, maka saya sengaja membuat sebuah postingan baru guna mengakomodir permintaan teman-teman.

Untuk tutorial cara membuat emoticon kali ini sudah saya lakukan tes, work, dan contohnya bisa dilihat disini, sehingga postingan ini sekaligus menjadi pengganti dari postingan sebelumnya. Saya katakan ini sebagai tutorial pengganti, mengapa??? Karena, baik visual dari hasilnya maupun implementasi tutorialnya pun akan berbeda dengan postingan terdahulu.

Ok, langsung saja buka editor template temen-temen dan kemudian cari kode </body> lalu letakkan kode berikut ini diatas nya :

<style type='text/css'>
.emoWrap {
background-color:#EEDE86;
border:2px solid #D3BA59;
padding:10px 14px;
color:black;
font:bold 12px Tahoma,Arial,Sans-Serif;
text-align:center;
}

img.emo, input.emoKey {
display:inline-block; /* Penting! */
*display:inline;
vertical-align:middle;
}

input.emoKey {
border:1px solid #ccc;
background-color:white;
font:bold 11px Arial,Sans-Serif;
padding:1px 2px;
margin:0px 0px 0px 2px;
color:black;
}
</style>
<script type='text/javascript'>
//<![CDATA[
var emoRange = "#comments p, div.emoWrap",
putEmoAbove = "#comment-editor",
emoMessage = false;
//]]>
</script>
<script src='http://aiizahh-reader.googlecode.com/svn/trunk/emotj.js' 
type='text/javascript'></script>

Setelah itu, simpan template temen-temen dan lihat hasilnya. Untuk membuat emoticon tersebut tampil pada komentar, lakukan klik pada salah satu emoticon lalu copy paste pada kotak komentar.

Terima kasih dan semoga bermanfaat...

Tips 1 :Untuk emoticon alternatif dengan tambahan beberapa emoticon seperti pada postingan sebelumnya, dapat mengganti kode berwarna ungu, dengan kode berikut :

<script src='http://aiizahh-reader.googlecode.com/svn/trunk/emotj-new.js'  type='text/javascript'></script>
Tips 2 :Untuk membuat emoticon muncul di dalam postingan/artikel tambahkan kode  "div.post-body, div.post-body span" pada bagian "var emoRange".

Thanks to : Mas Taufik & Forum MT5