Drop-down Menu Bar Widget

Ke hadapan pembaca blog yang di sayangi sekalian. *wah, ayat skema macam Hang Buah tulis surat kat Hang Kesum zaman dulu kala*.

Kali ini I nak berkongsi tutorial bagaimana membuat drop down menu bar widget di sidebar seperti yang telah di minta oleh Momma Mia tempoh hari.

Selamat mencuba dan kalau dah berjaya, jangan lupa bagitahu kat I ye.

Macam biasa, bukak blogger dashboard --> design --> page elements --> Add a gadget --> HTML/JavaScript

Lepas tu copy-paste code kat bawah ini dalam box tu.




<select onchange="window.open(this.options[this.selectedIndex].value,'_blank')" style="width:190px" name="menu" size="1"><option selected value="0"/><span style="font-weight:bold;">Info2 Chomeyl Ibu Hamil</span>;

<option value="http://yatiechomeyl.blogspot.com/2009/02/doa2-untuk-ibu-hamil.html"/>Doa2 utk Ibu yg hamil

<option value="http://yatiechomeyl.blogspot.com/2009/02/surah2-bacaan-ketika-mengandung.html"/>Surah2 Bacaan ketika mengandung

</select>

Yang font warna merah tu ialah tajuk pada dropdown menu itu, font warna biru pula ialah link kepada entry/post tersebut, dan font warna purple ialah tajuk untuk link/entry tersebut.

Width juga boleh di tukar mengikut kesesuaian sesedap rasa anda. I set width 190px sebab my sidebar kecil je, kalau korang nak lagi lebar list tu, pandai2 lah ubah sendiri width tu ye.

Untuk setiap link baru, copy paste sahaja baris yang ada option value tu *leceh sikit la kerjanya, tapi hasilnya agak menyenangkan usaha pembaca blog korang lah.

<option value="http:sukahati-lah-letak-link-apa-pun.blogspot.com"/>klik lah link ini


Kalau nak letak drop down menu untuk category yang lain pulak, ulang semula untuk dropdown menu seterusnya macam tadi.

<select onchange="window.open(this.options[this.selectedIndex].value,'_blank')" style="width:190px" name="menu" size="1"><option selected value="0"/><span style="font-weight:bold;">Yatie Chomeyl's Pregnancy</span>


<select onchange="window.open(this.options[this.selectedIndex].value,'_blank')" style="width:190px" name="menu" size="1"><option selected value="0"/><span style="font-weight:bold;">Nursery in Japan</span>

<option value="http://yatiechomeyl.blogspot.com/2011/02/5-star-cleanliness-treat-at-nazhans.html"/> 5 star cleanliness treat at SN's nursery

<option value="http://yatiechomeyl.blogspot.com/2010/11/sistem-pendidikan-di-nursery-jepun-yang.html"/> Sistem Pendidikan Nursery di Jepun

</select>





Harap faham dan berjaya lah dalam usaha nak buat dropdown menu widget kat sidebar seperti yang di inginkan itu. Senang je nak buat kan?.

Let me know kalau ada yang dah try ye.

~ Thanks for reading this (^-*) ~