Cara membuat Emoticon di blog

                                
Cara Memasang Emoticon di Dalam Postingan Blog - Postingan blogger adalah bagian utama dari blog. Karena apa?? karena yang menjadi tujuan utama mata para pengujung blog adalah artikel yang kita posting. Sebanyak apapun widget dan se bagus apapun hiasan yang di pasang di luar posting tidaklah berarti tanpa postingan yang berkualitas. Oleh karena itu sebisanya buatlah artikel seindah mungkin, serapi mungkin, dan se orisinil mungkin dan jangan terlalu mengutamakan widget - widget yang tidak terlalu berguna ( seperti jam, kalender dll).

untuk kesempatan kali ini saya ingin share ''cara membuat emoticon karya sendiri.'' Tentunya sudah banyak yang tahu cara buat emoticon di blog Andyrra. Jadi postingan ini buat mereka yang lagi ingin mencoba buat emoticon karya sendiri, tapi belum tahu caranya. Sama seperti saya waktu baru bergabung di blog Andyrra 

ini contoh nya:

 :)  :(  ;)  :D  ;;-)  :-/  :x  :P  :-*  =((  :-O  X(  :7  B-)  :-S  #:-S  7:)  :((  :))  :|  /:)  =))  O:-)  :-B  =;  :-c  :)]  ~X(  :-h  :-t  8-7  I-)  8-|  L-)  :-a  :-$  [-(  :O)  8-  2:-P  (:|  =P~   #-o  =D7  :-SS  @-)  :^o  :-w  7:P  2):)  X_X  :!!  \m/  :-q  :-bd  ^#(^  :ar!


Dan silakan di copy kode emoticonnya di kolom texarea di bawah ini.

: ranger : : arrow : : down : : left : : up : : D : grin : : ? 8 - ) : cry : 8 - O : evil : : ! : : frown : : idea : : kiss: : l o l : : - x : m r g r e e n : : | : ? : : P : o o p s : : r o l l : : ( : ) : - o : t w i s t e d : : w i n k : atau ; )

caranya hilangkan spasi kode di kolom texarea di atas. Contoh penulisannya: : ranger : jadi gambar emoticonnya seperti ini =>  | : arrow : =>  | : down : =>  | : left : =>  | : up : =>  | : D =>  | : grin : =>  | Perhatikan spasinya, maksudnya spasinya di hilangkan. Contoh: ini kode yang menggunakan spasi => : ranger : | dan ini kode yang tidak menggunakan spasi => :rager: | Dan cara penulisan ini sama dengan cara buat simbol buat blog Andyrra.

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 emoticonjQuery(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

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 diatasnya.

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




Sekian dulu mengenai kode emoticon . Wassalam...