Cara Sederhana Membuat Emoticon Smiley Pada Komentar Blogspot

Posted by : David Asc Official Blog Sabtu, 30 November 2013

Di tutorial kali ini saya membagikan Cara Sederhana Membuat Emoticon Smiley Pada Komentar Blogspot. Dengan adanya emoticon ini di komentar anda, maka akan membuat tampilan komentarmu semakin menarik. Cara membuatnya :

Masuk ke Template, lalu edit HTML
Cari kode ]]></b:skin> dengan CTRL + F
Lalu tambahkan kode berikut tepat diatas kode ]]></b:skin>

.emoWrap {
   background-color:#fff;
   border:2px solid#0B6138;border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px;
   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; }

Kemudian tambahkan kode script JQuery ini tepat diatas kode </head>

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js' type='text/javascript'></script>

Lalu tambahkan lagi script ini tepat dibawah script JQuery tadi

<script type='text/javascript'>
//<![CDATA[
var emoRange = "#comments p, div.emoWrap",
putEmoAbove = "iframe#comment-editor",
emoMessage = "To insert emoticon you must added at least one space before the code.";
//]]>
</script>
<script src='https://tipstrikblogging.googlecode.com/files/EmoticonsKeren.js type='text/javascript'/>