Wednesday, September 1, 2010

Cara Pasang Spoiler Untuk Komentar

Thank you for using rssforward.com! This service has been made possible by all our customers. In order to provide a sustainable, best of the breed RSS to Email experience, we've chosen to keep this as a paid subscription service. If you are satisfied with your free trial, please sign-up today. Subscriptions without a plan would soon be removed. Thank you!

Spoiler adalah sebuah tombol yang berfungsi untuk menampilkan dan menyembunyikan,
Jika sobat ingin membuat Spoiler pada blok komentar,
berikut cara memasangnya :

Login ke Blogger
Klik Rancangan (Yang dulunya Tata Letak)
Klik tab Edit HTML
Klik tulisan Download Template Lengkap.
Silahkan save dulu template tersebut, ini di maksudkan untuk mengurangi resiko apabila terjadi kesalahan ketika melakukan editting pada template, kita masih punya back up data untuk mengembalikannya seperti semula
Beri tanda centang pada kotak di samping tulisan Expand Template Widget,
Cari kode CSS untuk comments-block
Jika sudah ketemu tambahkan perintah scroll berikut kedalamnya

height: 300 px; /* tinggi blok komentar */
border:1px solid # 000000 ; /* warna bingkai blok komentar */
overflow:auto; /* perintah scroll */


tinggi serta warna bingkai bisa sobat ubah sesuai keinginan.
Jika tidak ingin menggunakan scroll untuk blok komentar, hapus saja perintah scroll di atas.
Lalu cari kode ]]></b:skin>
jika sudah ketemu letakkan kode CSS berikut diatasnya

/*-----Toggle Spoiler-----*/
.widgethidden {
display:none
}
.widgetshown {
display:inline;
overflow:auto;
}


Lalu letakkan script berikut di bawah kode ]]></b:skin>

<script type='text/Javascript'>
function togglespoiler (postid){
var whichpost = document.getElementById(postid);
if
(whichpost.className=="widgetshown"){whichpost.className="widgethdden";
}
else{
whichpost.className="widgets hown";
}
}
</script>


Selanjutnya carilah kode berikut :

<dl id='comments-block'>

Buat sobat yang sudah menggunakan Avatar Blogger Profile, cari kode ini

<dl expr:class='data:post.avatarInd entClass' id='comments-block'>

Jika sudah ketemu, silahkan sobat ganti dengan kode ini

<dl class='widgethidden' id='comments-block'>

Atau dengan kode ini bagi yang menggunakan Avatar Blogger Profile

<dl expr:class='data:post.avatarInd entClass' class='widgethidden' id='comments-block'>

Peringatan : Jika blok komentar menggunakan scroll maka Avatar Blogger Profile tidak akan terlihat karena tertutup oleh kotak scroll blok komentar.

Lalu tambahkan kode dibawah ini tepat diatasnya:

<div style='text-align:center; margin:10 px 0px; font-size: 15 px; font-weight:bold;'>
<a href='javascript:togglespoiler ("comments-block")' title=' Click for expand '>Show/Hide Comments</a>
</div>


Ukuran huruf, judul link (Click for expand), dan nama link (Show/Hide Comments) bisa sobat ganti sesuai keinginan.

Simpan selesai dan lihat hasilnya


Selamat mencoba


Imtikhan 01 Sep, 2010


--
Source: http://www.imtikhan.co.cc/2010/09/cara-pasang-spoiler-untuk-komentar.html
~
Manage subscription | Powered by rssforward.com