Cara Menghidden Widget di Blog

Cara Menghidden Widget di Blog

Untuk meminimalisir widget yang ada di sidebar ataupun di footer blog biasanya para blogger menggunakan teknik menghidden widget tersebut. Cara Menghidden Widget di Blog, selain untuk mempercepat loading blog juga dapat mempercantik blog.

Selain itu, diharapkan mampu memberi peluang blogger untuk memunculkan tampilan baru yang lebih indah. Dengan membuat "tombol" atau button yang bagus, Saya kira apa yang diharapkan pasti akan dapat diwujudkan. Berbagai bentuk button, baik berupa gambar biasa atau animasi, css3 button, teks dan box dengan shadow efects juga bisa kita pakai buat membuat tampilan berbeda. Bahkan sampeyan juga bisa memanfaatkan opacity effect untuk menambah daya tarik show-hidden box ini.



Cara pemasangannya tidaklah sulit, Anda dapat mengikuti langkah-langkah berikut ini:

1. Login to BloGGeR.

2. Setelah masuk di halaman Dasboard, KLIK link Design/Rancangan.

3. Design/Rancangan : KLIK Add Gadget/Tambah Gadget

4. KLIK HTML/Javascript.

5. Pastekan seluruh Javascript Show-Hidden di bawah ini

<script type='text/javascript'>
if(typeof(rnd) == 'undefined') var rnd = '';
rnd = Math.floor(Math.random()*1000);
rnd = 'id-' + rnd;
document.write('<a href="#" onclick="tmp =
document.getElementById("' + rnd + '");
tmp.style.display = (tmp.style.display == "none") ?
"block" : "none"; return false;">');
</script>
<center>
<div style="background:#b3c8ce url(http://1.bp.blogspot.com
/_2ye1u3ms7LI/S8mUZgw3IgI/AAAAAAAAADk/OjYzr5AlHFI/s320/Untitled-55-copy.gif)
left top repeat-x;width:260px;padding:2px 0;">
<p style="background:#98d6e5 url(http://i964.photobucket.com/
albums/ae124/gubhugreyot/background/bgBlueFadeV71H1.gif)
left top repeat-x;font-size:14px;font-weight:bold;color:#012750;
font-family:Tahoma;padding:4px;border:1px solid #333;margin:5px;">Judul/Nama Widget<br />
<img src="http://i964.photobucket.com/albums/ae124/gubhugreyot/
Mart10/template-GR/Show-HideH115V34.jpg" width="112" height="28"
style="margin:2px auto;" /></p><script type='text/javascript'>
document.write('<div id="' + rnd + '" style="display:none;
padding:8px;background:#e1eaf1;margin:0 5px 8px;">');
</script>

Letakkan widget yang akan di sembunyikan di sini!

<script type='text/javascript'>
document.write('<\/div>');
</script>
</div>
</center>

6. KLIK SAVE/Simpan, kemudian lihat hasilnya dengan membuka blog.

Keterangan :

1.Ganti Teks yang bertuliskan Letakkan widget yang akan di sembunyikan di sini! dengan Kode HTML Widget yang akan di pasang.

2. Sebagai contoh, coba pasang kode HTML di bawah ini untuk menggantikan teks tersebut :

3. Ganti Judul/Nama Widget sesuai widget yang digunakan.

4. width:260px; merupakan lebar show hidden. Sampeyan dapat merubahnya sesuai ruang yang tersedia. Semakin kecil maka akan semakin sempit.

Jika Anda telah berhasil menerapkannya di blog Anda, saya beharap kepada Anda bersedia memberikan komentarnya


sumber : http://super-bee.blogspot.com/2012/02/cara-menghidden-widget-di-blog.html