March 4, 2011

Elegan Dengan Menu Dropdown

Sebenarnya blogger / blogspot ini, sudah mempunyai menu dropdown, tetapi hal itu berlaku otomatis untuk peng-arsipan, jadi kayak kantor gitu deh ada arsipnya, postingan lama tidak di tampilkan judulnya kecuali setelah di klik muncul dech… Nah tidak hanya blogger tetapi anda juga bisa, tentunya setelah mengikuti langkah langkah dibawah ini, terlebih lagi kalau menu tersebut ternyata kita inginkan untuk link ke konten atau blog kita yang lain. Sebenarnya agak mirip mirip tutorial menu scroll bar kegunaannya menurut salma blog tutorial sih

1. Login dengan akun blogger anda
2. Setelah pada jendela dashbor, klik Desain/Setting
3. Klik add gadget atau tambah gadget
4. Masukkan kode berikut:


Untuk anda yang memakai template baru, langkahnya lebih mudah yaitu :
1. login dulu, tentunya dengan id anda
2. Pilih layout/setting
3. Klik page element, cari element (kotak) yang bertuliskan Blog Archive
4. Klik Edit pada kotak Blog Archive tadi
5. Di samping tulisan Style ada beberapa radio button, pilih radio button yang bertuliskan Dropdown Menu dengan cara memberi tanda checklist
6. Klik Save Changes
7. Selesai
Kalau anda masih kurang puas dengan model yang di paket oleh blogger.com anda juga bisa dengan mengkombinasikan alamat link sebagai, dengan cara menambahkan kode-kode yang sudah ada di bawah nanti.

Langkah untuk memberikan link pada menu drop down adalah sebagai beriku:
1. Login dengan akun blogger anda
2. Setelah pada jendela dashbor, klik Desain/Setting
3. Klik add gadget atau tambah gadget
4. Masukkan kode berikut:

<form><select name="menu" onchange="window.open(this.options[this.selectedIndex].value,'_blank')"size=1 name=menu><option value=0 selected>tulis text-nya di sini</OPTION>

<option value="isi dengan addres yang ingin di tuju">tulisan di sini yang akan muncul</option> </select></form>

Sebagai contoh untuk menu Dropdown milik saya :

<form><select name="menu" onchange="window.open(this.options[this.selectedIndex].value,'_blank')"size=1 name=menu>

<option>-- salma tutorial --</option>

<option value=" http://tsalma-tutorialblog.blogspot.com/2011/02/tutorial-ganti-template-blog-orisinil.html">Ganti Template</option>

<option value="http://tsalma-tutorialblog.blogspot.com/2011/02/tutorial-memilih-setting-dan-comments.html">setting Blog</option>

<option value="http://tsalma-tutorialblog.blogspot.com/2011/03/tutorial-buat-recent-post-alternatif-di.html">Buat judul posting</option>

<option value="http://tsalma-tutorialblog.blogspot.com/2011/03/tutorial-kreatif-untuk-memilih-kode.html">Kode Warna</option>

<option value="http://tsalma-tutorialblog.blogspot.com/2011/03/tutorial-membuat-menu-scroll-di-sidebar.html">Menu scrol</option>

</select></form>

hasilnya adalah sebagai berikut:

kalau gak percaya ya coba aja

No comments:

Post a Comment