Cara Memberi Emoticon Smiley Pada Blogger
Semenjak Blogger membuat sistem kotak komentarnya "
Embedded Comments form"
Atau kotak komentar langsung dibawah komentar populasi para komentator
semakin meningkat, tidak seperti dulu jika ingin menulis komentar harus
mengklik link post comments yang akan membuka jendela baru atau jendela
pop-up. Dulu jika ingin membuat kotak komentar dibawah postingan harus
pakai jasa pihak ke-3 misalnya
haloscan, tetapi yang menggunakan jasa
haloscan berbondong-bondong memindah kotak komentarnya menjadi default blogger lagi karena blogger sudah membuka sistem "embedded comments form".
Nah
semakin meningkatknya para komentator di blogger maka semakin meningkat
pula keinginan para blogger untuk mengubah tampilan area komentar dan
menambah pernak-pernik lainya, maka dari itu saya juga ingin membuat
pernak-pernik komentar blogger dengan smiley yang memungkinkan sang
komentator bisa mengexpresikan ucapanya dengan sebuah gambar emoticon
atau smiley.
"Ilmu tak akan bermanfaat jika tidak
dibagi-bagikan", Nah ucap-ucapan itulah yang membuat saya selalu ingin
berbagi, sebelum saya membuat tutorialnya terlebih dahulu saya akan
memberikan informasinya, ehh sampai lupa menawarkan tutorial yang satu
lagi yaitu tampilan komentar pemilik blog berbeda (
baca disini). Gambar emticonya cukup sederhana bisa dilihat dibawah ini
:)):)];));;):D;):p:((:):(:X=((:-o:-/:-*:|8-}~x(:-tb-(:-Lx(=))Gambarnya
seperti diatas, teks atau tulisan yang disamping kanan gambar adalah
symbol yang jika ditulis di kotak komentar akan berubah menjadi gambar
yang ada disamping kirinya.
Nah jika Anda berminat membuatnya ikuti langkah-langkah dibawah ini
Pertama-tama masuk blogger dan masuk menu Layout kemudian masuk menu Edit HTML
Jangan lupa centang "Expand Widget Templates"
Taruh Script dibawah ini diatas code </body>
<script src='http://sites.google.com/site/anasceria/smiley.js' type='text/javascript'/>
Kalau sudah cari code HTML seperti dibawah ini
<p class='comment-footer'>
<b:if cond='data:post.embedCommentForm'>
<b:include data='post' name='comment-form'/>
<b:else/>
<b:if cond='data:post.allowComments'>
<a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:postCommentMsg/></a>
</b:if>
</b:if>
</p>
Kemudian sisipkan code HTML dibawah ini diantara code yang berwarna
biru dan
hijau diatas tadi atau lebih tepatnya dibawah code
<p class='comment-footer'>
<b><img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/21.gif'/>
:))
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/100.gif'/>
:)]
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/71.gif'/>
;))
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/5.gif'/>
;;)
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/4.gif'/>
:D
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/3.gif'/>
;)
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/10.gif'/>
:p
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/20.gif'/>
:((
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/1.gif'/>
:)
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/2.gif'/>
:(
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/8.gif'/>
:X
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/12.gif'/>
=((
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/13.gif'/>
:-o
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/7.gif'/>
:-/
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/11.gif'/>
:-*
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/22.gif'/>
:|
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/35.gif'/>
8-}
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/102.gif'/>
~x(
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/104.gif'/>
:-t
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/66.gif'/>
b-(
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/62.gif'/>
:-L
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/14.gif'/>
x(
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/24.gif'/>
=))</b>
Nah kalau sudah
SAVE pengaturanya.
....Semoga bermanfaat....