Memasang emoctiom di komentar blog emang terlihat keren banget.....
Emoticion macamnya ada laumayan banyak sob, dan blog ini baru sempat membahas dua macam di antaranya:
Memasang Emoticon Kaskus Di Komentar Blog.
Nah kan baru satu, satunya mana? yang staunya yang akan kita bahas ini hehehe....
Emoticon dari namanya aja udah ketahuan artinya, Emoticon ini bisa menggantikan kata-kata dari pengunjung, contoh aja pengunjung atau orang yang berkomentar di blog sobat akan ketahuan expresi merka jika sobat memasang Emoticon di komentar blog sobat, bila pengunjung senang dengan postingan/articles/tutuorila dan semacamnya deh terserah sobat mau nyebutnya apa maka pengunjung akan menggunakan Emoticon yang sobat sediakan untuk berkomentar.
Seperti yang saya bilang di atas Emoticon tu ada lumayan banyak macamnya dan kali ini kita akan memberikan sobat cara memasang Emoticon yang paling gampang(itu sih menurut saya) hehehe . .. dan postingan kali ini berjudul: Emoticon Blogger Otomatis Dengan JQuery, kebanyakan kalo menggunakan JQuery berarti memasangnya mudah.
Untuh contohnya sobat bisa lihat gambar Emoticon Blogger Otomatis Dengan JQuery berikut:

Gambar di atas adalah contohnya, sekarang mari kita berdo'a, bersama-sama, eh salah maksudnya mari kita bahas cara memasang Emoticon Blogger Otomatis Dengan JQuery ;

1. Login ke akun blogger sobat.

2. Pada menu klick Rancangan ➮ Edit HTML ➮ Centang Expand Template Widget.


3. Backup dulu templatenya untuk mengantisipasi bila terjadi kesalahan, kalo gak ya terserah sobat.


4. Selanjutnya di dalam edit template sobat cari kode  </body> Jika kesulitan mencarinya coba sobat baca Cara Cepat Mencari Kode HTML.

5. Jika sudah ketemu letakkan kode script berikut sebelum atau di atas kode tadi.

<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 src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js' type='text/javascript'></script>
<script type='text/javascript'>
//<![CDATA[
var emoRange    = "#comments p, div.emoWrap",
    putEmoAbove = "iframe#comment-editor",
    emoMessage  = "Untuk menyisipkan emoticon setidaknya Anda harus menambahkan satu spasi di awal simbol.";
//]]>
</script>
<script src='http://reader-download.googlecode.com/svn/trunk/jquery.autoemoticons.js' type='text/javascript'></script>

6. Simpan template.

Sekarang lihat sendiri perubahannya di komentar blog sobat!

Yaya, sekian dulu untuk kali ini, semoga bisa bermanfaat untuk sobat semuam, dan kita akan bertemu lagi di postinga/articles selanjutnya yang gak kalah menariknya!

Bagaimana, apakah sobat berhasil menerpkannya ke blog sobat? silahkan tinggalkan komentar atau tanngapan sobat tentang postingan atau articles di atas!

Posting Komentar Blogger Disqus

  1. bang emoticonnya udah muncul tapi kok pas di copy ke komentar gak bisa yaah ?
    tag apus lagi akhirnya -_-

    BalasHapus
  2. @Edotz Herjunot Wah kok g' bsa? pdhal sblum memposting udah sya cba d 2 tmplate dn brhsil!
    Mungkin krna tmplatenya.

    BalasHapus
  3. . . "Untuk menyisipkan emoticon setidaknya Anda harus menambahkan satu spasi di awal simbol." bisa kasih contoh gak kawan?!? bingunk nich. huhhh . .

    BalasHapus
  4. @♥VPie◥♀◤MahaDhifa♥Itu hanya perintah saja...

    Anda tetap bisa menambahkan emoction bahkan tanpa ada satu pun tek dalam kotak komentar.

    Kalo untuk contoh jelas tidak Ada.

    Anda bisa lansung mencobanya sendiri disini.

    BalasHapus
  5. mantap gan , tp ,ales mau coba. takut gagal :D

    BalasHapus
  6. mantap gan , 2 blog saya berhasil. ijin copas yo
    kunjungi juga ya blog sederhana gua - hengkyalx.blogspot.com

    BalasHapus
  7. saya mau masang emot tapi emot yang kaya punya mas ini kalo yang diatas terlalu banyak gimana ya caranya :(

    BalasHapus
  8. @Limit PostMudah cukup ganti kode berikut pada script kode di atas:

    <script src='http://reader-download.googlecode.com/svn/trunk/jquery.autoemoticons.js' type='text/javascript'></script>

    dan ganti dengan kode ini:

    <script src='https://otowebsite-blogspot.googlecode.com/svn/trunk/jquery.autoemoticons.js' type='text/javascript'/>

    BalasHapus
  9. @dek rifwahahahaaa sip :-d

    tapi ini ringankan mas :)

    BalasHapus
  10. oiaya mas mau tanya lagi nih kalo mau bikin komentarnya bisa dimasukin gambar,kode,dll seperti punya mas ini gimana ya :'(

    maaf mas kalo banyak nanya namanya juga orang baru di blogger heehehe :)

    BalasHapus
  11. @Limit PostRingan.

    Nanti akan saya bahas di kesempatan selanjutnya.
    Di tunggu saja!!!

    BalasHapus
  12. Komentar ini telah dihapus oleh pengarang.

    BalasHapus
  13. :( saya gk berfungsi mas... :(

    BalasHapus
  14. :-d maksih saya berhasil..!!
    mampir jga Blog gue berbagi CSS dan HTML
    http://zewdsignet.blogspot.com/

    BalasHapus
  15. @taufan FHMGak bekerja gimana gan?
    Script ini sangat sempurna karna di buat oleh master taufik contohnya bisa Anda lihat di blog ini.
    Coba Anda ulangi, jika pemasangan benar maka tempilannya akan seperti koment di sini.
    [Template juga berpengaruh].

    BalasHapus
  16. @Dwi AhmadYang di follow apanya ni? dan Anda memfollow apa?

    BalasHapus
  17. @dek rif.. mau tanya lagi nich. kalo secara otomatis gitu gak ada ya?!? maksudnya kalo kayak istilah plugin gitu kalo d wp ..

    BalasHapus
  18. @♥Vpie◥♀◤MahaDhifa♥Wah sori kalo untuk WP saya kurang paham, saya jugapunya WP tapi kagak pernah saya urus jadinya untuk WP saya tidak tau.

    BalasHapus
Catatan:
Untuk menyisipkan kode, gunakan tag <i rel="code">KODE ANDA...</i>
Kode yang panjang bisa menggunakan tag <i rel="pre">KODE PANJANG ANDA...</i>
Untuk menyisipkan gambar, gunakan tag <i rel="image">URL GAMBAR...</i>
Untuk menyisipkan judul, gunakan tag <b rel="h3">JUDUL ANDA DI SINI...</b>
Untuk menciptakan efek tebal gunakan tag <b>TEKS ANDA DI SINI...</b>
Untuk menciptakan efek huruf miring gunakan tag <i>TEKS ANDA DI SINI...</i>

Penting:
Jika Anda mengajukan pertanyaan klik 'Subscribe by email' link di bawah form komentar untuk mengetahui komentar balasan.

Khusus untuk membalas komentar disarankan menggunakan tombol balas/reply di samping komentar terkait dibandingkan menggunakan formulir komentar di bawah agar komunikasi lebih terstruktur.

Dilarang Meninggalkan Link Aktif, Link Aktif Terpaksa Akan Saya Hapus Dari Komentar.

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!".

Konversi Kode di Sini! Daftar Member Aktif

 
Top