Pasang Emoticon Pada Komentar Blogger
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.
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 :












Bagi sobat yang ingin menampilkan emotikon pada komentar, silahkan ikuti langkah mudahnya :
1. Simpan kode CSS ini di atas
2. Simpan kode ini di atas
.:)
^_^
:-d
:-bd
@@,
\o/
=(
:(
;)
:D
=D
:p
Kalaumau yanglebih lengkap silahkan gunakan Yahoo Smileys / Emoticon.

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 :












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='http://1.bp.blogspot.com/-2Z7Cwe04x-Q/UH9THzWWJII/AAAAAAAACtA/ChwawyzYsDI/s1600/smile1.gif' alt='' class='comment_emo'/>");
ki_emo = ki_emo.replace(/\^_\^/gi, "<img src='http://1.bp.blogspot.com/-IoZJlpB0-dE/UKhVKnR0BDI/AAAAAAAADPo/Kz87N1Aj4X8/s1600/smile.gif' alt='' class='comment_emo'/>");
ki_emo = ki_emo.replace(/:-bd/gi, "<img src='http://4.bp.blogspot.com/-hPd-oj2Bzo4/UKhVLkmQjOI/AAAAAAAADPw/3O1iuAukZXg/s1600/thumb.gif' alt='' class='comment_emo'/>");
ki_emo = ki_emo.replace(/:-d/gi, "<img src='http://2.bp.blogspot.com/-yElQmFAIiII/UKhVMcObcQI/AAAAAAAADP4/-qdEpW8zCmY/s1600/thumbsup.gif' alt='' class='comment_emo'/>");
ki_emo = ki_emo.replace(/@\@\,/gi, "<img src='http://4.bp.blogspot.com/-w1VfvgO2-e8/UKhVIT7XLhI/AAAAAAAADPQ/cJ0KDjEsoj4/s1600/rolleyes.gif' alt='' class='comment_emo'/>");
ki_emo = ki_emo.replace(/\\o\//gi, "<img src='http://4.bp.blogspot.com/-ip66eq3uRI8/UKhVF-QK8lI/AAAAAAAADO4/P0G-1PcWpQs/s1600/applause.gif' alt='' class='comment_emo'/>");
ki_emo = ki_emo.replace(/=\(/gi, "<img src='http://1.bp.blogspot.com/-7I8DdEs58z0/UKhVKHT1yUI/AAAAAAAADPg/Lyzv-E74EdM/s1600/sadanimated.gif' alt='' class='comment_emo'/>");
ki_emo = ki_emo.replace(/:\(/gi, "<img src='http://4.bp.blogspot.com/-yXc7xHs5mXc/UKhVJLBfdaI/AAAAAAAADPY/LJKRsefyeao/s1600/sad.gif' alt='' class='comment_emo'/>");
ki_emo = ki_emo.replace(/\;\)/gi, "<img src='http://3.bp.blogspot.com/-5zPfqshivtY/UKhVONWZnkI/AAAAAAAADQI/iCDxagcaj5s/s1600/wink.gif' alt='' class='comment_emo'/>");
ki_emo = ki_emo.replace(/:D/gi, "<img src='http://3.bp.blogspot.com/-WeTjMT8JDhg/UKhVHlZ88II/AAAAAAAADPI/b1gpiAvIkCc/s1600/icon_smile.gif='' class='comment_emo'/>");
ki_emo = ki_emo.replace(/=D/gi, "<img src='http://1.bp.blogspot.com/-ljeobbA3sn0/UKhVGtJsGRI/AAAAAAAADPA/8lyzE4JwrwQ/s1600/hihi.gif' alt='' class='comment_emo'/>");
ki_emo = ki_emo.replace(/:\P/gi, "<img src='http://2.bp.blogspot.com/-bs2e9gRj748/UKhVNKLs2YI/AAAAAAAADQA/mF7lDNOChac/s1600/wee.gif' alt='' class='comment_emo'/>");
ki_emo = ki_emo.replace(/:\p/gi, "<img src='http://2.bp.blogspot.com/-bs2e9gRj748/UKhVNKLs2YI/AAAAAAAADQA/mF7lDNOChac/s1600/wee.gif' alt='' class='comment_emo'/>");
zx.item(i).innerHTML = ki_emo;
}
}
}
//]]>
</script>
Penulisan
Cara penulisannya standar aja, seperti tertulis disamping smiley :











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='http://2.bp.blogspot.com/-bs2e9gRj748/UKhVNKLs2YI/AAAAAAAADQA/mF7lDNOChac/s1600/wee.gif' alt='' class='comment_emo'/>");
Kalaumau yanglebih 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.
136 komentar
2. Tinggalkan komentar sesuai topik tulisan
3. Apabila ada pertanyaan diluar artikel silahkan kunjungi Ruang Obrolan.
4. Centang Beri tahu saya untuk mendapatkan notifikasi via Email ketika ada balasan
5. Untuk menghapus komentar, geser kursor ke sebelah kanan komentar Anda.
image quote pre code
dhimas-rafiif.blogspot.com
salam
(gagapseo.com)
tolong pencerahannya gan.. masih newbi nih.. :(
kalau sempet mampir diblog saya yah , Join site juga , ane juga udah join site nte |o|
Terima kasih http://virgiawan-didik.blogspot.com/
jangan lupa kunbalnya juga kang arifinbp.blogspot.com
Saya dapat tutor seputar blog dari Kang Ismet lohh :D
sobat bisa lihat blog saya
www.cecepcom.blogspot.com
@@,
>> http://caralagi.blogspot.com/
horeee |o|
:(
=(
^_^
:D
=D
|o|
@@,
;)
:-bd
:-d
:P
:ngakak:
kang Ismet abi tos nyobian emoticon onion head tapi gagal wae, saur na mah teu support ka blogger, 5x gagal kang ti tutorial nu benten
punten pisan kang pencerahanna
http://killersblog-19.blogspot.com
http://innocenceberbagi.blogspot.com
-brofist-
umpan balik ya mas :D
screentshotnya kyk gini kang :
<a href="https://lh3.googleusercontent.com/-8SQvzOjx3tw/UqM-uy2IOTI/AAAAAAAACL4/cdRoe-8683M/s613/Untitled.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="239" src="https://lh3.googleusercontent.com/-8SQvzOjx3tw/UqM-uy2IOTI/AAAAAAAACL4/cdRoe-8683M/s613/Untitled.jpg"/></a>
[code] document.getElementById('comment-holder');[/code]
jadi
[code] document.getElementById('post');[/code]
atau gmana kang? :)
trm ksh
- salam damai :)
mau nanya mana baiknya kita psng css/javascript di dalam template atau menggunakan tempat penyimpanan di t4 lain? semoga kang ismet ngerti maksu kata2 saya :D
btw OOT nih kang, saya naksir ma widget sticky twitter ma G+ yang sebelah kanan kang ada tutornya gk...??? bukan untuk sticky kang tp tampilan G+ ma twitternya kang kalau bisa sih ada fb fans pagenya :D, biar irit tempat aja, makasih sebelumnya kang
kang,template kenging kang ismet nu zikazev blue responsive tiasa d valid html5 keun teu kang?? ku abdi hyg d angge tp pas d cbaan teh seer nu eror..
sudah sukses terpasang :D
Seseur na mah paket Bundle ^_^
makasih tutorial nya
~BW~