Membuat Dropdown menu untuk Label widget

Sebuah Label widget akan selalu menampilkan postingan label Anda dan masing-masing label akan di hubungkan ke halaman yang berisi postingan berbeda-beda di bawah label tersebut. Biasanya salah satunya di gunakan untuk meningkatkan postingan Anda, sehingga Anda memasang widget label. Jika Anda tidak membatasi mereka cepat atau lambat widget sidebar akan mengambil alih sidebar Anda!

Untungnya Anda dapat mencegah hal itu terjadi dengan mengubah widget ke Dropdown (atau sebuah pull-down?) menu. Label widget Anda akan berkurang menjadi hanya satu baris! Dan akan menampilakan semua label saat Anda klick!

Demo/ScreenShot

Sebelum menerapkan hack ini, Anda sebelumnya harus sudah menginstal Label widget, jika Anda belum menginstalnya maka Anda hanya cukup pergi ke Dasbor > Tata Letak > Tambah Gadget > pilih Label > Simpan.

Sekarang Membuat Dropdown menu untuk Label widget

• Pergi ke Dasbor.
• Klick Template.
• Pilih Edit HTML.
• Pastikan Anda tidak mencentang Expand Template Widge.
• Sekarang carilah baris berikut dalam template Anda:

<b:widget id='Label1' locked='false' title='Labels' type='Label'/>

• Ganti baris tersebut dengan kode ini:

<b:widget id='Label1' locked='false' title='Label' type='Label'>
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content'>
<select style='width:100%' onchange='location=this.options[this.selectedIndex].value;'>
<option>Select a Category</option>
<b:loop values='data:labels' var='label'>
<option expr:value='data:label.url'><data:label.name/>
(<data:label.count/>)
</option>
</b:loop>
</select>
<b:include name='quickedit'/>
</div>
</b:includable>
</b:widget>

• Simpan template.

Keterangan:

1. Jika Anda ingin mengubah lebar dari Dropdown menu Anda tinggal mengubah nilai dari width:100%
2. Untuk mengubah kalimat Select a Category Anda tinggal mengubah kalimat Select a Category dengan kalimat Anda sendiri.
3. Jika Anda tidak ingin menampilakan jumlah posting pada setiap akhir kalimat label Anda cukup menghapus kode (<data:label.count/>)

Dari Meja Editor

Saya berharap Anda menyukai tutorial kali ini, dan tidak mengalami kesulitan untuk membuatnya. Namun jika Anda mrngalami kesulitan jangan sungkan untuk bertanya, saya akan secepatnya membantu Anda, karna saya ada di sini!