Blog တြင္ Drop-Down Labels Menu ျပဳလုပ္ျခင္း(၁)

အားလုံးမဂၤလာပါခင္ဗ်ာ..။ ကၽြန္ေတာ့ဘေလာ့မွာလုပ္ထားသလုိ Lables ေတြကုိ Drop-Drown Menu ေလးနဲ႕ျပတဲ့နည္းေလး သိခ်င္ပါတယ္လုိ႔ မိတ္ေဆြတစ္ဦးက ေမးလ္ပုိ႔ၿပီး ေမးျမန္းထားတဲ့အတြက္ ဒီပုိ႔စ္ေလးကုိ ေရးလုိက္ရျခင္းျဖစ္ပါတယ္။ အျခားစိတ္၀င္စား သူမ်ားလည္း ေအာက္မွာ ေဖာ္ျပထားတဲ့ အဆင့္မ်ား အတုိင္း လုပ္ၾကည့္ၾကပါခင္ဗ်ာ....

၁။      အရင္ဆုံး မိမိတုိ႔ရဲ႕ ဘေလာ့ဂ္မွာ Labels Gadget ကုိထည့္ထားဖုိ႔လုိပါမယ္။ မရွိေသးရင္လည္း Design -->>Page Elements-->>Add a Gadget-->>Labels ကုိသြားၿပီး Save လုပ္လုိက္ပါ။

၂။     Labels ထည့္ၿပီးၿပီဆုိရင္ Design-->>Edit Html-->>Download Full Template ကုိ ႏွိပ္ၿပီး မိမိ ဘေလာ့ဂ္ကုိ Backup လုပ္ထားလုိက္ပါ။ ဒါမွသာ တစ္စုံတစ္ခု မွားယြင္းခဲ့ရင္ မိမိဘေလာ့ဂ္ကုိ ျပန္ၿပီး recover လုပ္လုိ႔ရမွာျဖစ္ပါတယ္။

၃။     ဘေလာ့ဂ္ကုိ Backup လုပ္ၿပီးၿပီးဆုိရင္ Edit Template အတြက္ Expend Widget Templates ကုိ အမွန္ျခစ္ေလး ေပးလုိက္ပါ။

၄။     ၿပီးရင္ ေအာက္မွာ ေပးထားတဲ့ Code ေတြကုိရွာပါ။

<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'>

 <ul>
   <b:loop values='data:labels' var='label'>
     <li>
       <b:if cond='data:blog.url == data:label.url'>
         <data:label.name/>
       <b:else/>
         <a expr:href='data:label.url'><data:label.name/></a>
       </b:if>
       (<data:label.count/>)
     </li>
   </b:loop>
   </ul>

<b:include name='quickedit'/>
</div>
</b:includable>
</b:widget>

 ၅။     ေတြ႕ၿပီဆုိရင္ အျပာေရာင္နဲ႔ျပထားတဲ့ code ေတြရဲ႕ေနရာမွာ ေအာက္မွာ ေပးထားတဲ့ Code ေတြကုိ အစားသြင္းလုိက္ပါ။ က်န္တဲ့ code ေတြကုိေတာ့ ဘာမွလုပ္စရာမလိုပါဘူး။ ရွာေဖြရတာ လြယ္ကူေအာင္ ထည့္ေပးထားျခင္းသာျဖစ္ပါတယ္။

<br />
<select onchange='location=this.options[this.selectedIndex].value;' style='width:300px'>
<option>Select a 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>

၆။     အစားသြင္းၿပီးသြားရင္ မိမိစိတ္တုိင္းက်ျဖစ္ေအာင္ အနည္းငယ္ျပင္ပါမယ္။ 'width:300px' ေနရာမွာ မိမိတုိ႔ဘေလာ့ဂ္ရဲ႕ Sidebar Width နဲ႕လုိက္ေလ်ာညီေထြျဖစ္ေအာင္ျပင္ပါ့မယ္ (200px, 250px etc...)။

၇။     ေနာက္ၿပီး Select a label ရဲ႕ေနရာမွာ မိမိစိတ္ႀကိဳက္ စာသားေလးနဲ႔အစားထုိးလုိ႔ရပါတယ္။ (ဥပမာ..က႑အလုိက္ ဖတ္႐ႈရန္၊ ႏွစ္သက္ရာေရြးခ်ယ္ပါ... စသျဖင့္)

၈။     အားလုံးၿပီးသြားရင္ Template ကုိ save မလုပ္ပါနဲ႔အုံး။ Preview အရင္ၾကည့္ပါ။ error မရွိဘဲ မိမိစိတ္ႀကိဳက္ျဖစ္တယ္ဆုိမွ save လုပ္ပါ။ အားလုံးအဆင္ေျပၾကပါေစခင္ဗ်ာ..။ အကယ္၍ တစ္စုံတစ္ရာ အခက္အခဲရွိခဲ့ပါက ကြန္မန္႔မွာ ေဆြးေႏြးေပးခဲ့ၾကပါ ခင္ဗ်ာ..။