• River-Creative
  • River-Creative
  • River-Creative
  • River-Creative
  • River-Creative
  • River-Creative
  • River-Creative

Posted by : Unknown Jumat, 29 November 2013


Adding smileys on Blogger Comments - Emoticon / smiley biasanya digunakan untuk menyatakan kondisi, senang, sedih, marah dll. Selain itu juga sebagai pemanis kolom komentar, sehingga tampak lebih hidup.

smiley


Sudah puluhan atau mungkin ratusan tutorial tentang cara memasang emotikon pada komentar, tetapi  karena banyaknya permintaan / pertanyaan tentang cara memasang emoticon, akhirnya saya share juga  :)
Dari kode dibawah, ada 12 emoticon yang bisa sobat gunakan :



smileysmileysmileysmiley

Bagi sobat yang ingin menampilkan emotikon pada komentar, silahkan ikuti langkah mudahnya :

1. Simpan kode CSS ini di atas ]]></b:skin>

img.comment_emo {
    height: auto !important;
    vertical-align: middle !important;
    width: auto !important;
    border:0px !important;
}

2. Simpan kode ini di atas </body>

<script type="text/javascript">
//<![CDATA[
/* Blogger Comments Emoticon
 * by Kang Ismet
 * Url:http://blog.kangismet.net
 */
ki = document.getElementById('comment-holder');
if (ki) {
    zx = ki.getElementsByTagName("p");
    for (i = 0; i < zx.length; i++) {
        if (zx.item(i).getAttribute('CLASS') == 'comment-content') {
            ki_emo = zx.item(i).innerHTML.replace(/:\)/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiB7XPj1kvEq8x0nzGi-cEel2MMh-KQ14MbVApA5ee34Ci6APngBFLzFSh7xahNRlBSEQexkzdxyogZFH8vURp603p9PUb17kW00VQsOp9M7vsUYDMkW3N2_h3jyojyk4yzdZhEhxDkjyU/s1600/smile1.gif' alt='' class='comment_emo'/>");
            ki_emo = ki_emo.replace(/\^_\^/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhdcxlDk20nloVv-vm9jboDFaTBkJEXN1mZp3ktPzhKLqLuh5Ti3MkjrvNEM4MRuzbKCwExAq7eRCVTXF-jEttkc7dWnov9iAAQxZ8_vql3-mFvwpx0xId-M2KJjVc6T_Hxe0p7_9YScyU/s1600/smile.gif' alt='' class='comment_emo'/>");
            ki_emo = ki_emo.replace(/:-bd/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiux_aMg3YLAD0Jp0vnqKdBnwxghSTEh6QbLfZtrAzNH2Pj-0RTbQaFIKOUzjLTHCJJFXM8VXsSTdR1RAmAjbdAmyUxOXBuLq0UgfTNs6hqjJ0HoF2nvWaJlSRdCkg3hoIINo5fn3vhUf4/s1600/thumb.gif' alt='' class='comment_emo'/>");
            ki_emo = ki_emo.replace(/:-d/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi9E_L0bN7kEiEjsyZbxK_Y7J5SRRsXr5uXrjYNCGPeL_XggNmiTcMShFPmXeQIflQHKfG6pV3bstJh1kbwKuBjYW_HxoQboDRTBeOyFLFv_Vonxy9PdExe7IQ6vvcW1mIksd15nPeSzqg/s1600/thumbsup.gif' alt='' class='comment_emo'/>");
            ki_emo = ki_emo.replace(/@\@\,/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhz8TLLrdv8ebf9BcFKZ0JsmdEFaiVXTK-HOPOpOg09X-CQgcpQTUH1waCGMZefbjuDCo_BJt0hOtWjrKNT2Tupzt-Z0CDJ21gVfJsqLaspeawNao4JjJyUIr8T1rQlf_rL1CreC7i-xEA/s1600/rolleyes.gif' alt='' class='comment_emo'/>");
            ki_emo = ki_emo.replace(/\\o\//gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgW8jz_Ickx0pTEYaOOz-UKfLzkZoB_zkMeFsb8SeMhT9abHjr3GX-oW5JHt1u-gKGDOMgOs9q8TrBcEwOFLi83IMyc3tV3JryPq1Q1Ss90Z_n-5qDPOtf10_iFCxKAOMeC80rfWJ-Skp4/s1600/applause.gif' alt='' class='comment_emo'/>");
            ki_emo = ki_emo.replace(/=\(/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjrxT3T12kpTBfebDG8LW95AZbRtLDksmmMT8W5ONgSNHbP-cFm4K4z1a6VH1e_fWugpedRPcSY37EOzlJi4dbXWKlsOOBUEzrgGOndKRaRorWtEZ0zhJacOBt-UxPk_qxLPENhp2x4w5Q/s1600/sadanimated.gif' alt='' class='comment_emo'/>");
            ki_emo = ki_emo.replace(/:\(/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiazuunBXin37fg4f8aJBX17LIhVZXUwDvpZ44VzP-LH7187vNrK6Qis6jwMzg_prhqgXwRPcRk8qUZHlmE_C-CqfWiPG8-bSmWajKFjcgyDQqQtfRRLuxwYX4tDv60nZ0YvzFpMDWceys/s1600/sad.gif' alt='' class='comment_emo'/>");
            ki_emo = ki_emo.replace(/\;\)/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiiIAxIux3EkY24N3_RCtt36b7SnKeXZQR_GzMIDQDz96lvz7nLVb7cdgqMZZY44ekleHHzc3RG8JJz6FDjqaBtoJPO7O1USThUuQTjSBorXH9BACe90JFw7qNc_ZoypioeEGWRwmAPCYI/s1600/wink.gif' alt='' class='comment_emo'/>");
            ki_emo = ki_emo.replace(/:D/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhF7DWCrC74_itEeQ29ZqFu4jy8HJFxy06W4uDay71s4b4EEes3pOOImWtuh7ub7-u1-k6j_2REhYz74KmIewaPr_DQhVKklfZebnaewJYNpkNkZ9_K7Eurb9kmc_ffGDuMADUYQlbmWm0/s1600/icon_smile.gif='' class='comment_emo'/>");
            ki_emo = ki_emo.replace(/=D/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiRfYdt1iBhjKqvmSCLzsQ5x2FbIAywIlZlVUkwuFPsfKqA9S5-hxIoWfDdEHYrTMc3GTCkcEqGsEgmEiNpzYPnhVDRNlZ6L2aoWLSAMRvAEZcJE7202g1Bss1Hpsx7Xia7Y2MR2G-140o/s1600/hihi.gif' alt='' class='comment_emo'/>");
            ki_emo = ki_emo.replace(/:\P/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhPfTenMM2jRl_WVbaub2clApjyHt5EjRbhJVc_Dl1Mw-EIpAGXQO_XhxTdEjxMflzeAbJiYLQzFzM3kpiAY9enbI3Y346zOO8XbqG_6B2MGiLEQRZMEfBHrlMjRmDSVnpw79oKzQF_M4I/s1600/wee.gif' alt='' class='comment_emo'/>");
            ki_emo = ki_emo.replace(/:\p/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhPfTenMM2jRl_WVbaub2clApjyHt5EjRbhJVc_Dl1Mw-EIpAGXQO_XhxTdEjxMflzeAbJiYLQzFzM3kpiAY9enbI3Y346zOO8XbqG_6B2MGiLEQRZMEfBHrlMjRmDSVnpw79oKzQF_M4I/s1600/wee.gif' alt='' class='comment_emo'/>");
            zx.item(i).innerHTML = ki_emo;
        }
    }
}
//]]>
</script>

Penulisan

Cara penulisannya standar aja, seperti tertulis disamping smiley :

smiley.:)smiley^_^smiley:-dsmiley:-bd@@,\o/

=(:(;):D=D:p

Menambah Emoticon

Untuk menambah atau edit emoticon, tambahkan kode yang seperti ini (edit simbol dan url gambarnya) :

ki_emo = ki_emo.replace(/:\p/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhPfTenMM2jRl_WVbaub2clApjyHt5EjRbhJVc_Dl1Mw-EIpAGXQO_XhxTdEjxMflzeAbJiYLQzFzM3kpiAY9enbI3Y346zOO8XbqG_6B2MGiLEQRZMEfBHrlMjRmDSVnpw79oKzQF_M4I/s1600/wee.gif' alt='' class='comment_emo'/>");

Kalaumau yang lebih lengkap silahkan gunakan Yahoo Smileys / Emoticon.

Emoticon ini untuk Komentar default Blogger. Emoticon ini tidak ditampilkan di atas form komentar dan tidak menggunakan alert box, apabila ingin menambahkan diatas form komentar atau ingin menggunkan alert box, silahkan cari tutorialnya di Googel, sudah banyak yang posting.

Sumber: Kang Ismet

Leave a Reply

PERATURAN

[+] Sebelum Comment Follow Blog
[+] No SPAMING
[+] Berbicara Yang Sopan

Subscribe to Posts | Subscribe to Comments

Banner

ADS

Labels

Diberdayakan oleh Blogger.

Copyright © 2014 River-Creative- River Creative - Powered by Blogger - Design by Kink Exclusive. - original by Djogzs

Perhatian...!!!

1. Gunakan Google Chrome Agar Blog Terlihat Maximal.

2. Dilarang Mencuri Berbagai CSS Yang Saya Pakai.

3. Harap Share, Follow, dan Berkomentar.

4. Sekian Dan Terima Kasih.