Untuk lebih jelasnya kamu bisa mengikuti langkah-langkah sebagai berikut:
- Login ke akun Blogger kamu.
- Dari halaman Dasbor, klik Rancangan dan pilih Edit HTML.
- Lakukan duplikasi template untuk berjaga-jaga jika terjadi masalah.
- Beri tanda centrang pada Expand Template Widget.
- Cari kode ]]></b:skin> lalu letakkan kode CSS berikut di atasnya:
- Dan letakkan script berikut di bawah kode ]]></b:skin> tadi:
- Setelah itu carilah kode berikut pada widget-widget yang akan kamu sembunyikan:
- Ganti kode tersebut dengan kode ini:
- Kemudian pada kode berikut, yang ada di bawahnya:
- Ganti dengan kode ini:
- Simpan dan Lihat hasilnya
Nah, sekarang coba kamu klik pada judul widget-widget sidebar kamu, apakah sudah bisa di Show/Hide?Catatan:
Untuk widget-widget berikutnya, ganti widget-spoiler1 menjadi widget-spoiler2, widget-spoiler3, dst., baik pada kode HTML untuk judul (title) maupun pada kode widget-content-nya.
/*-----Toggle Spoiler-----*/
.widgethidden {display:none}
.widgetshown {display:inline}
.widgethidden {display:none}
.widgetshown {display:inline}
<script type='text/Javascript'>
function togglespoiler (postid){
var whichpost = document.getElementById(postid);
if (whichpost.className=="widgetshown"){
whichpost.className="widgethidden";
}
else{ whichpost.className="widgetshown";
}
}
</script>
function togglespoiler (postid){
var whichpost = document.getElementById(postid);
if (whichpost.className=="widgetshown"){
whichpost.className="widgethidden";
}
else{ whichpost.className="widgetshown";
}
}
</script>
<h2 class='title'><data:title/></h2>
<a href='javascript:togglespoiler ("widget-spoiler1")' title='Show/Hide Widget'><h2 class='title'><data:title/></h2></a>
<div class='widget-content'>
<div class='widgethidden' id='widget-spoiler1'>
0 komentar:
Posting Komentar
Kalau berkenan memberikan komentar, harap menggunakan kalimat yang santun dan tidak membahas topik lain di luar konten blog ini. Terima kasih.