MENGHEMAT RUANG BLOG DENGAN MENU TUTUP BUKA

Banyak usaha yang dapat anda lakukan untuk menampilkan blog kelihatan lebih menarik bagi para pengunjung.
Salah satu trik untuk kearah itu dapat anda lakukan dengan menggunakan menu tutup buka sehingga isi dari menu tersebut akan tersembunyi, dan akan terbuka jika pengunjung mengklik menu tersebut. Selain dapat menambah keindahan blog tips ini juga dapat menghemat ruang pada blog serta dapat diletakkan pada postingan maupun pada elemen halaman.
Sebagai contoh, coba anda perhatikan menu dibawah ini :

1. Cara Membuat blog


2. Tentang Postingan artikel


3. Tentang Buku Tamu


4. Tentang Elemen Halaman


5. Tentang Aksesoris Blog


6. Tentang Komentar


7. Tentang Daftar Isi Blog


8. Tentang Fasilitas Chat


9. Tentang Pengaturan Image


10. Tentang Perankingan Blog


11. Tentang Read More


12. Tentang Sidebar


13. Tentang Tab menu


14. Tentang Table


15. Tentang Link


16. Tentang Traffik Blog


17. Tentang Translate


18. Tentang Upload File


19. Tentang Widget Blog


20. Tentang E-Mail

Jika anda berminat, anda tinggal copy script dibawah kemudian paste pada blog anda, baik pada postingan maupun pada elemen halaman.


<div><div style="margin: 5px;"><div class="normalfont" style="margin-bottom: 2px;"><input value="BUKA" style="margin: 0px; padding: 5px; width: 30%; font-size: 11px; background:#0066CC; color:#ffffcc; border:1px dashes yellow;" onclick="if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = ''; this.innerText = ''; this.value = 'TUTUP'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'BUKA'; }" type="button" /></div><div class="alt2"><div style="display: none;"><div style="border: 2px dashes white; color:blue;background-color:NONE; text-align: justify; padding:10px; ">TEMPAT MENGISI IMAGE ,TULISAN ATAU APA SAJA </div>


Selanjutnya anda tinggal mengganti kode yang berwarna kuning dengan keinginan anda, agar tampil lebih menarik :

1. value="BUKA" = dapat anda ganti dengan kata lain misalnya : OPEN
. Kata BUKA ada 2 buah , silahkan anda ganti keduanya.

2. width: 30%; = merupakan ukuran dari lebar menu, dapat anda ganti dengan px


3. font-size: 11px; = merupakan ukuran huruf yang tampil pada menu


4. border:1px dashes yellow;" = merupakan border menu berupa garis ganda berukuran ipx dan berwarna kuning


5. background:#0066CC; = merupakan warna latar dari menu


6. value = 'TUTUP'; = dapat anda ganti dengan kata lain misalnya CLOSE


7. border: 2px dashes white; color:blue;background-color:NONE; = menunjukkan bahwa border yang muncul setelah diklik berupa garis ganda dengan ukuran 2 px dan berwarna putih, tulisan berwarna biru serta tidak ada background, silahkan anda ganti seperlunya, dapat anda ganti dengan solid atau dotted


8. TEMPAT MENGISI IMAGE ,TULISAN ATAU APA SAJA = dapat anda ganti dengan apa saja yang ingin anda tampilkan

| Free Bussines? |