Cara membuat label drop down di blog

Setelah pada postingan di hari hari yang lalu tentang memodifikasi tampilan label pada kategori/label halaman blog, dalam tutorial kita kali ini saya juga akan mengangkat suatu judul tentang tehnik memodifikasi label dengan sistem DROP DOWN. Fungsi ini sangat berguna buat para teman teman yang memang halaman blognya memiliki banyak label. Bila anda sebagai pemilik halaman blog anda patut mencobanya untuk mempercantik sekaligus dan tidak memakan banyak ruang widget pada halaman blog.
Kinerja dari tutorial saya kali ini adalah label. jadi saya rasa anda harus lebih dulu memasang widget label pada halaman anda, silahkan edit tampilannya agar lebih menarik dilihat para pengunjung halaman anda.Dengan mengedit sedikit kode tag htmlnya, tutorial kali ini akan membuat label blog tampil elegan. Klik DEMO dibawah dan lihat tampilan kategori di siddebar halaman .

Demo

Tutorial

• Login to blog
• Pilih " Template " lalu klik " Edit HTML "
• Cari kode

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

• Setelah ketemu silahkan gantikan code yang diatas dengan code yang ada dibawah ini. Kemudian save template dan lihat hasilnya.

<b:widget id='Label1' locked='false' title='Categories' 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>Judul</option>
<b:loop values='data:labels' var='label'> <option expr:value='data:label.url'>
<data:label.name/> (<data:label.count/>) </option> </b:loop> </select></div> </b:includable> </b:widget>

Note

Widget label dalam postingan kali ini digantikan dengan sistem selek drop down, tampilan yang menarik dan tidak memakan banyak tempat untuk label halaman. Untuk mengganti code <b:widget id='Label1' locked='false' title='Labels' type='Label'/> anda harus menggantikan code tersebut sampai batas code </b:widget>. Untuk tulisan warna hijau , silahkan anda ganti dengan judul kategori halaman anda. Code tulisan warna biru berguna untuk menunjukkan berapa banyak artikel dalam sebuah kategori atau biasa disebut dengan counter label. Bila anda tidak ingin menunjukkan counter labelnya silahkan hapus code tersebut.

Terimakasih atas kunjungannya,Bila anda suka dengan artikel ini silahkan JOIN TO MEMBER BLOG atau berlangganan geratis Artikel dari blog ini, daftarkan email anda pada form subscribe dibawah halaman . Pergunakan vasilitas diblog ini untuk mempermudah anda. Bila ada masalah dalam penulisan artikel ini silahkan kontak saya melalui kotak komentar yang ada dibawah atau gunakan fasilitas yang ada diblog ini untuk menghubungi saya.

Salam Blogger.... !!! .

Admin Rivai Silaban

Share article with : Google+ Facebook Twitter

Di posting oleh : Unknown Update pada : 1:52 AM