Cara Menambah Emoticon Di Komentar Blog

 Yosh kali ini mau ngepost tentang trick blogger yaitu menambah emoticon di blog. mungkin banyak yang masih bingung tapi gua usahain biar jadi mudah di pahami. jadi langsung saja

                              Cara Membuat Emoticon Di Blog                           

1. sudah pasti masuk dulu ke blog.
2. pilih template lalu edit HTML

3. cari kode </body> ( untuk memudahkan tekan ctrl+f )

4. letakan kode di bawah ini pas di atas kode </body> .

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<script type='text/javascript'>
//<![CDATA[
jQuery(document).ready(function () {emoticonx({
emoRange:"#comments p, div.emoWrap",
putEmoAbove:"iframe#comment-editor",
topText:"Klik Untuk Melihat Kode!",
emoMessage:"Untuk Menyisipkan Emoticon Anda Harus Menambahkan Setidaknya Satu Spasi Sebelum Kode."
})
});
//]]>
</script>
<script src='https://boyz.googlecode.com/svn/JS/emoticonnya.js' type='text/javascript'/>
</b:if>

5. kemudian cari lagi kode ]]></b:skin> lalu letakan kode di bawah ini di atas kode ]]></b:skin>

.emoWrap {
  position:relative;
  padding:10px;
  margin-bottom:7px;
  background:#fff;
/* IE10 Consumer Preview */
background-image: -ms-linear-gradient(right, #FFFFFF 0%, #FFF9F2 100%);
/* Mozilla Firefox */
background-image: -moz-linear-gradient(right, #FFFFFF 0%, #FFF9F2 100%);
/* Opera */
background-image: -o-linear-gradient(right, #FFFFFF 0%, #FFF9F2 100%);
/* Webkit (Safari/Chrome 10) */
background-image: -webkit-gradient(linear, right top, left top, color-stop(0, #FFFFFF), color-stop(1, #FFF9F2));
/* Webkit (Chrome 11+) */
background-image: -webkit-linear-gradient(right, #FFFFFF 0%, #FFF9F2 100%);
/* W3C Markup, IE10 Release Preview */
background-image: linear-gradient(to left, #FFFFFF 0%, #FFF9F2 100%);
  border:3px solid #860000;
  -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 #860000;
  border-right:20px solid transparent;
  width:0;
  height:0;
  line-height:0;
}

6. simpan dan lihat hasilnya .

sekian dulu post kali ini jika ingin request artikel hubung saja contact yang ada di menu.

Artikel Terkait