Tambahkan Emoticon pada Blog

Sekarang ini saya berbagi untuk kawan Blogger yang suka pernak pernik seperti emoticon pada Blog yang biasanya disisipkan dipostingan maupun pada Komentar :z; seperti pada Blog saya ini, bagaimana kawan suka, kalau kawan suka ikuti caranya sebagai berikut :

• Masuk Account Blogger dengan ID kawan
• Pada Dasbor pilih Template - Edit HTML - Lanjutkan
• Copas Script berikut dibawah ]]></b:skin> atau diatas </body> 

<script src=https://sites.google.com/site/blogbegocreation/javascript/Editor_Smyle.js type=text/javascript/>

• Untuk Template dengan Komentar Default / standar [Template yang belum beralih ke Thread] bisa ditampilkan pada posting dan Komentar, sedangkan Template kawan yang sudah beralih ke Thread Comment cuma bisa pada postingan saja
• Cara pemanggilan atau penulisan :[Titik dua] Abjad/huruf kecil [a - z] ;[titik koma] tanpa spasi

:a ;   :b ;   :c ;   :d ;   :e ;   :f ;   :g ;   :h ;   :i ;   :j ;  

:k ;   :l ;   :m ;   :n ;   :o ;   :p ;   :q ;   :r ;   :s ;  

:t ;   :u ;    :v ;   :w ;   :x ;   :y ;   :z ; 

 [INGAT TANPA SPASI] 

• Khusus untuk Template yang sudah beralih ke Thread Comment, Copas Kode berikut diatas </body> sedangkan untuk pemanggilan / penulisannya sama seperti diatas

<script type=text/javascript>
//<![CDATA[
function replaceText(){if(!document.getElementById){return;}
bodyText = document.getElementById("comment-holder");
theText = bodyText.innerHTML;
theText = theText.replace(/[nct].*?.*?[/nct]/gi, "");
theText = theText.replace(/&amp;feature=/gi, "?rel=0 ");
theText = theText.replace(/[/nct]/gi, " quality=high wmode=transparent type=application/x-shockwave-flash></embed>");
theText = theText.replace(/:a;/gi, "<img src=http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/71.gif/>");
theText = theText.replace(/:b;/gi, "<img src=http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/3.gif/>");
theText = theText.replace(/:c;/gi, "<img src=http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/9.gif/>");
theText = theText.replace(/:d;/gi, "<img src=http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/2.gif/>");
theText = theText.replace(/:e;/gi, "<img src=http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/4.gif/>");
theText = theText.replace(/:f;/gi, "<img src=http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/10.gif/>");
theText = theText.replace(/:g;/gi, "<img src=http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/11.gif/>");
theText = theText.replace(/:h;/gi, "<img src=http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/41.gif/>");
theText = theText.replace(/:i;/gi, "<img src=http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/109.gif/>");
theText = theText.replace(/:j;/gi, "<img src=http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/111.gif/>");
theText = theText.replace(/:k;/gi, "<img src=http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/33.gif/>");
theText = theText.replace(/:l;/gi, "<img src=http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/36.gif/>");
theText = theText.replace(/:m;/gi, "<img src=http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/8.gif/>");
theText = theText.replace(/:n;/gi, "<img src=http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/28.gif/>");
theText = theText.replace(/:o;/gi, "<img src=http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/63.gif/>");
theText = theText.replace(/:p;/gi, "<img src=http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/39.gif/>");
theText = theText.replace(/:q;/gi, "<img src=http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/21.gif/>");
theText = theText.replace(/:r;/gi, "<img src=http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/24.gif/>");
theText = theText.replace(/:s;/gi, "<img src=http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/40.gif/>");
theText = theText.replace(/:t;/gi, "<img src=http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/69.gif/>");
theText = theText.replace(/:u;/gi, "<img src=http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/7.gif/>");
theText = theText.replace(/:v;/gi, "<img src=http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/65.gif/>");
theText = theText.replace(/:w;/gi, "<img src=http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/68.gif/>");
theText = theText.replace(/:x;/gi, "<img src=https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiO_OgScge-o7o2qXd1y09iW3rG3zhpE0YfczOZ_1G3Oe0kCjMQwwUZFBJdLxvtRsENbX4YHKqhIcGOjuKc2s6ZIkzRtoDDRhG2-oF00cjfi4wITtAcQsUV8xrq70T9iDUTnIYOecYPDk4/s1600/buatD.gif/>");
theText = theText.replace(/:y;/gi, "<img src=https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiLeE-8oY-wPXYLFt4S4Z714iy2SbITGMn38mY-iRng1CqF2wKaRerbMH2PMJcALL-WmgSJ93pczJaO5hioiW_qMAYRsWxCk08wvKVIKOl_mn3eNElSVEJU2LCnUG96AB7WwogFFDOVQRg/s1600/joget.gif/>");
theText = theText.replace(/:z;/gi, "<img src=https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh5qJ6LhBmjfq01T_lLzBj0iQnr6JOvFciVuouufwrbCR2_QtGTed-0drc4aIodEdvnDiphBB0x-dtOjKikbMoHPMOcYDByUQM2XijTO7hobdjtZFmVSbDQljLRMBYOBkXSZTXm4w2vlCM/s1600/xKopi.gif/>");
bodyText.innerHTML = theText;
}replaceText();
//]]>
</script>

• Jangan lupa simpan Template kawan

Cara Menambahkan Emoticon di Kotak komentar Blog

Cara Menambahkan Emoticon di Kotak komentar Blog - Kali ini saya akan membahas Cara Menambahkan Emoticon di Kotak komentar Blog. Seperti yang sobat ketahui, dengan memasang emoticon di kotak komentar, maka pengunjung akan mudah mengekspresikan sarannya pada kotak komentar. Selain itu, blog kita juga akan lebih menarik. Contoh Emoticonnya seperti gambar dibawah ini, atau tepat di kotak komentar blog saya

 

Berikut Tutorialnya :

1. Login ke Account Blogger sobat

2. Pilih Rancangan, Edit HTML, lalu ceklis "Expand Template Widget"

3. Cari kode </body>, lalu copy kode dibawah ini tepat di ATAS kode tadi

<style type=text/css>
.emoWrap {
  background-color:#ffffff;
  border:2px solid #ffffff;
  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;
}
</style>
<script src=http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js type=text/javascript/>
<script src=http://reader-download.googlecode.com/svn/trunk/jquery.autoemoticons.js type=text/javascript/>
<script type=text/javascript>
//<![CDATA[
var emoRange    = "#comments p, div.emoWrap",
    putEmoAbove = "iframe#comment-editor",
    emoMessage  = "Untuk menyisipkan emoticon setidaknya sobat harus menambahkan satu spasi di awal simbol.";
//]]>
</script>

4. Klik Simpan Template. dan lihat hasilnya :D