Jun 24, 2008

"Drop Down Menu" Untuk Label

Senarai 'label' yang terlalu panjang dalam sidebar blog anda (jika ada) merugikan banyak ruang yang boleh digunakan bagi memaparkan maklumat lain. Ada baiknya menggunkan 'drop down menu'. Tak banyak ruang yang digunakan dalam sidebar dan berguna untuk pengunjung mendapatkan maklumat melalui label.

Pos kali ini menerangkan beberapa langkah mudah untuk menyediakan 'drop down menu' untuk label ini.

Teknik ini dipadankan dari pencipta asalnya di Hackosphere.

Pertama sangat penting bagi anda menyediakan 'back-up' template anda terlebih dahulu supaya nanti template sedia ada boleh digunakan semula sekiranya berlaku sebarang kesilapan yang tidak diingini.

Log masuk ke dalam dashboard blogger anda. Back-up template melalui pilihan 'Layout' -> 'Edit HTML' -> 'Download full template'. Catatkan nama fail dan dalam folder di mana back-up ini disimpan dalam komputer anda.

Masih di dalam window 'Edit HTML' telusur dan cari baris yang tercatat kod seperti berikut dalam kod template blog anda:

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

Highlight baris kod diatas (dari <b:widget... hingga ke </b:widget> berikutnya jika tidak sama dengan kod di atas) dan ganti semuanya dengan seksyen kod berikut:

<b:widget id='Label1' locked='false' title='Labels' type='Label'>
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content'>

<br />
<select onchange='location=this.options[this.selectedIndex].value;'>
<option>Pilih label</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>

Klik 'SAVE' dan anda boleh lihat 'drop down menu' untuk label ini dalam sidebar anda. Dari dalam dashboard anda boleh pindahalih widget ini ke bahagian lain dalam sidebar blog anda.

Sekiranya pos ini difikirkan boleh membantu anda jangan lupa tinggalkan sebarang komen dan jika tidak keberatan sila buat pautan ke blog ini dari blog anda.

0 comments:

Post a Comment