Cara Memasukkan Smileys & Emoticon ke dalam Komentar Blog

Halo!



Kalo ngomongin blog mungkin sering banget lihat ya di blog orang lain komentarnya penuh dengan emoticon-emoticon dan smileys, kita pun juga bisa ikut berkomentar dengan menggunakan emoticon tersebut pada komentar blognya. Nah, ketika kita punya blog pasti penasaran, bagaimana sih caranya supaya bisa seperti itu dan bisa seperti blog saya juga? hehe. Yang dibutuhkan cuma copy paste kode html yang ada dibawah ini:


<b:if cond='data:blog.pageType == "item"'><style type='text/css'>.emoWrap{position:relative;padding:10px;margin-bottom:7px;background:#fff;background-image:-ms-linear-gradient(right,#fff 0,#fff9f2 100%);background-image:-moz-linear-gradient(right,#fff 0,#fff9f2 100%);background-image:-o-linear-gradient(right,#fff 0,#fff9f2 100%);background-image:-webkit-gradient(linear,right top,left top,color-stop(0,#fff),color-stop(1,#fff9f2));background-image:-webkit-linear-gradient(right,#fff 0,#fff9f2 100%);background-image:linear-gradient(to left,#fff 0,#fff9f2 100%);border:1px solid #ccc;-moz-border-radius:5px;-webkit-border-radius:5px;border-radius:5px;box-shadow:0 4px 6px rgba(0,0,0,0.1),0 1px 1px rgba(0,0,0,0.3);-moz-box-shadow:0 4px 6px rgba(0,0,0,0.1),0 1px 1px rgba(0,0,0,0.3);-webkit-box-shadow:0 4px 6px rgba(0,0,0,0.1),0 1px 1px rgba(0,0,0,0.3);box-shadow:0 2px 6px rgba(0,0,0,0.1),0 1px 1px rgba(0,0,0,0.3);font-weight:normal;color:#333}.emoWrap:after{content:"";position:absolute;bottom:-10px;left:10px;border-top:10px solid #ccc;border-right:20px solid transparent;width:0;height:0;line-height:0}</style> <script type='text/javascript'> //<![CDATA[ jQuery(document).ready(function () {emoticonx({ emoRange:"#comments p, div.emoWrap", putEmoAbove:"iframe#comment-editor", topText:"Click to see the code!", emoMessage:"To insert emoticon you must added at least one space before the code." }) }); //]]></script><script src='https://googledrive.com/host/0B6-apgHh7s2tZG9oR3JMNlN6RHc/blogger-comment-emoticons.js' type='text/javascript'/></b:if>

 Caranya,

  1. Pilih dashboard blogger > Template > Edit html,
  2. klik box html-nya, lalu tekan ctrl + F, cari </body>
  3. letakkan kode html tersebut di atas </body>
  4. jika sudah, sekarang pastikan bahwa blognya telah memiliki plugin jQuery, jika belum maka masukkan kode dibawah ini dan diletakkan di bawah kode <head>

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


Jika sudah mengikuti semua langkah di atas, semoga memang benar-benar bisa berhasil hehehe. Kalo ada yang tidak berhasil atau kesulitan silahkan tanya di kolom komentar di bawah, siapa tahu saya bisa bantu hehe. Terima kasih telah berkunjung ke blog ini, semoga ilmu yang saya share ini bisa bermanfaat.

Comments

Post a Comment

Popular Posts