Setelah mendapatkan kejutan yang menarik pagi hari tadi, dan saya juga
senang karena Raksasa Jerman Bayer Munchen berhasil mempermalukan
Barcelona dengan skor 3-0 tanpa balas dengan begitu Agregat menjadi 7-0
:>) ...
Ok masuk pada pembahasan utama, disini saya akan share cara memunculkan
emoticon pada halaman posting sehingga postingan menjadi lebih hidup dan
menarik tentunya.. :D Ini merupakan tutorial lanjutan dari "
Menambahkan Emoticon Pada Komentar Blogspot"
sebenarnya mudah saja, jika anda sudah menambahkan emoticon pada
komentar blogspot dengan tutorial lanjutan tersebut tidak perlu lagi
menambahlan javascript emoticon untuk posting blog, kita hanya tinggal
menambahkan kode css "
.post-body" saja pada javascript untuk memunculkan emoticonya agar emoticon juga tampil pada postingan.
Kurang lebih seperti ini:
<script type='text/javascript'>
//<![CDATA[
jQuery(document).ready(function () {emoticonx({
emoRange:"#comments p, .post-body, div.emoWrap",
putEmoAbove:"iframe#comment-editor",
topText:"Klik untuk melihat code!",
emoMessage:"Untuk memasukkan emoticon setidaknya ada satu spasi sebelum kode emoticon."
})
});
//]]>
</script>
Tambahkan tanda koma (
, ) diakhir
.post-body sehingga menjadi seperti ini
.post-body,
Kemudian tambahkan kode css berikut ini dibawah kode
]]></b:skin>
<style>
.emo.delayLoad { display:inline; text-align:left; margin:0;
box-shadow:none; -moz-box-shadow:none; -webkit-box-shadow:none;
border:none; background-color:transparent; width:auto; height:auto;
border-radius:none; -moz-border-radius:none; -webkit-border-radius:none }
</style>
Tutorial diatas untuk anda yang sudah menerapkan Emoticon pada komentar dengan mengikuti tutorial "
Menambahkan Emoticon Pada Komentar Blogspot" dari blog ini ataupun dari MKR-Site.
Tutorial 2
Bagi anda yang hanya ingin menambahkan emoticon pada postingan saja, ikuti langkah-langkah berikut ini:
1. Letakkan kode jquery berikut ini diatas kode
</head>
<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js' type='text/javascript'/>
Itu
merupakan kode jQuery, jika pada template anda sudah terdapat kode
jquery maka tidak usah ditambahkan lagi, atau anda juga bisa mengganti
jQuery yang ada pada template anda untuk jaga-jaga kalau nanti
emoticonya tidak bisa muncul.
Ingat
!! saya tidak bosan-bosanya untuk mengingatkan bahwa pada setiap
template hanya boleh terdapat satu jQuery-min dan satu jQuery-UI-min.
2. Letakkan kode CSS berikut ini dibawah kode
]]></b:skin>
<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>
3. Letakkan kode berikut ini diatas kode
</body>
<script type='text/javascript'>
//<![CDATA[
// kode js untuk menampilkan emoticon
jQuery(document).ready(function () {emoticonx({
emoRange:".post-body, div.emoWrap",
})
});
//]]>
</script>
<script src='https://boyz.googlecode.com/svn/JS/emoticonnya.js' type='text/javascript'/>
Simpel kan?? hanya saja saya tidak menggunakan hosting untuk java
scriptnya karena itu bisa terhapus kapan saja, saya lebih memilihnya
untuk menguraikan saja kodenya dan meletakkannya didalam template jadi
lebih aman.. :D
Khusus untuk anda yang menggunakan template MDF VIP Grey Responsive Template by MDF dari sini, anda hanya menambahkan kode #main_text sebagai pengganti dari .post-body karena CSS untuk text posting berbeda dengan template pada umumnya.
Demikian posting tentang Menambakan Emoticon Pada Posting Blog, semoga bermanfaat.. :)
Judul :
Menambakan Emoticon Pada Posting Blog
Deskripsi : Setelah mendapatkan kejutan yang menarik pagi hari tadi, dan saya juga senang karena Raksasa Jerman Bayer Munchen berhasil mempermalukan...