Cara Membuat Emoticon di Postingan dan Komentar Blog

Cara Membuat/Memasang Emoticon di Postingan Blog, Jika anda adalah salah seorang pengguna Facebook, tentu anda tahu apa yang dimaksud dengan emoticon bukan, emoticon adalah lambang yang menunjukkan suatu ekspresi dari seseorang, seperti sedih, tertawa, tersenyum. marah, dan masih banyak lagi variasi yang lainya. Di dalam dunia blogging, kerap kali kita juga menemui blog-blog yang telah mengaplikasikan fungsi dari emoticon ini, tak lain dan tak bukan, penerapan fungsi emoticon ini bertujuan agar penampilan blog mereka lebih unik dan semakin user friendly kepada para pengunjung.

Selain itu, tampilan dari emoticon yang akan saya bagikan kali ini juga agak berbeda dengan yang lainya, karena ukuranya yang agak lebih besar dan animasinya yang lucu dan unik, dengan emoticon ini nantinya diharapkan blog kita akan 'terkesan' lebih friendly dan akrab kepada para pengunjung. Bagi anda yang berminat untuk menerapkanya, silahkan disimak yang berikut ini!

Cara Membuat/Memasang Emoticon di Postingan

1. Login ke Blogger.

2. Pilih Template.

3. Klik Edit HTML.

4. Klik tanda panah disebelah kode yang mirip <b:skin>...</b:skin> (untuk membuka kode css).

5. Cari kode ]]></b:skin> (gunakan CTRL+F), lalu letakkan kode dibawah ini tepat dibawahnya.

<style>
.emo.delayLoad { display:inline; text-align:left; margin:0; padding:1px; -moz-box-shadow:none; -webkit-box-shadow:none; box-shadow:none; border:none; background-color:transparent; border-radius:none; -moz-border-radius:none; -webkit-border-radius:none }
</style>

6. Selanjutnya, cari kode </body>, lalu letakkan kode dibawah ini tepat diatasnya.

<script type='text/javascript'>
//<![CDATA[
// kode js untuk menampilkan emoticon
jQuery(document).ready(function () {emoticonx({
emoRange:".post-body, div.emoWrap",
})
});
//]]>
</script>
<script src='http://yourjavascript.com/34231521353/efek.js' type='text/javascript'/>

7. Klik "Save/Simpan" template, dan selesai.

Cara Membuat Emoticon di Komentar

.emoWrap {color:greenyellow;font:bold 12px Tahoma,Arial,Sans-Serif;text-align:center;}
img.emo, input.emoKey {display:inline-block;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;}

6. Cari kode </body>, lalu letakkan kode dibawah ini tepat diatasnya.

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js' type='text/javascript'/><script src='http://codecbd.googlecode.com/files/emotion-coment.js' type='text/javascript'/>
<script type='text/javascript'>
//<![CDATA[
var emoRange = "#comments p, div.emoWrap",
putEmoAbove = "iframe#comment-editor",
emoMessage = "Berikan tidaknya satu spasi dibelakang emoticon.";
//]]>
</script>

Keterangan: Jika pada template anda sudah ada kode seperti yang berwarna merah diatas versi berapapun, maka kode yang merah diatas dihapus saja.

Bagaimana sobat? mudah bukan menerapkan emoticon di postingan sekaligus komentar blog, untuk live demo-nya anda bisa lihat pada kolom komentar di blog ini. Demikian informasi terbaru tentang Cara Membuat/Memasang Emoticon di Postingan Blog, baca juga artikel menarik lainya seputar tutorial blog tentang Cara Modifikasi Widget Popular Post, semoga bermanfaat, dan selamat mencoba.

Referensi: