Minggu, 26 Juli 2009
Menghemat Halaman Postingan Dengan Dropdown Menu
Gimana...bagus kan
Sebenarnya untuk kita mah...caranya gak usah susah-susah amat, sangat simpel
karena hanya memerlukan sedikit kode CSS, maka jadilah dropdown menu tersebut, hanya kalau artikelnya udah banyak harus rajin masukan satu persatu. Silahkan kawan simak cara membuatnya.
kode CSS-nya adalah seperti dibawah ini :
<select onChange="document.location.href=this.options[this.selectedIndex].value;">
<option value="0" selected>Arsip Blog</option>
<option value="Link target 1">Judul link target 1</option>
<option value="Link target 2">Judul link target 2</option>
<option value="Link target 3">Judul link target 3</option>
<option value="Link target 4">Judul link target 4</option>
</select>
Gara mengedit kode diatas adalah sebagai berikut :
* Tulisan Link target 1 sampai 4 diganti dengan link yang akan dituju ketika pengunjung mengklik judul yang tampil.
* Tulisan Judul link target 1 sampai 4 diganti dengan judul dari link target atau judul yang ingin ditampilkan
Perhatikan contoh pengisian dropdown menu dibawah ini :
<select onChange="document.location.href=this.options[this.selectedIndex].value;">
<option value="0" selected>Arsip Blog</option>
<option value="http://alfatihshare.blogspot.com/2009/08/meningkatkan-traffic-blog-dengan.html">tingkatkan traffic dengan blogup</option>
<option value="http://alfatihshare.blogspot.com/2009/07/blog-eight.html">Buat daftar isi</option>
<option value="http://alfatihshare.blogspot.com/2009/07/blog-seven.html">Recent Comment versi 3</option>
<option value="http://alfatihshare.blogspot.com/2009/06/tutorial-blog-tutorial-blogcara-membuat.html">Tutorial blog</option>
</select>
Kawan dapat menambahkan link target dan judul link target sesuai dengan jumlah yang ingin di tampilkan dengan menambahkan kode seperti ini dibawah ini yang diletakan diatas kode : </select>
kode yang berwarna merah bisa dirubah sesuai dengan target link punya kawan
<option value="Link target 5">Judul link target 5</option>
Tambahkan target="_blank" pada target link agar jika diklik aka muncul pada tab baru sehungga halaman utama kawan tidak tertutup. Contoh cara meletakannya, lihat dibawah ini :
<option value="http://faisalardhy.blogspot.com/2008/05/naruto-chapter-383-epilog-selanjutnya.html"target="_blank">Chapter 382 : Epilog Selanjutnya</option>
Selain dapat digunakan dalam menghemat halaman postingan, dropdown menu juga dapat diletakan di sidebar yang dapat diisi dengan label blog, daftar isi blog, daftar link sahabat atau apa saja sesuai dengan kreasi kawan.
Selamat mencoba, semoga berhasil
Langganan:
Posting Komentar (Atom)









0 komentar:
Posting Komentar