ရက္စြဲအား ျပကၡဒိန္ပံုစံျဖင့္ ေဖာ္ျပျခင္း

က်ေနာ္တို႔ ဘေလာ့ဂ္ အမ်ားစုမွာ ပံုမွန္ အားျဖင့္ 01 Aug 2008 ဆိုၿပီး ခပ္႐ိုး႐ိုးပဲ ရက္စြဲကို ျပတတ္ပါတယ္။ အထက္က ပံုအတိုင္း စတိုင္ခပ္ဆန္းဆန္းနဲ႔ ျပကၡဒိန္ ပံုစံအတုိင္း ျပခ်င္တယ္ဆိုရင္ က်ေနာ္ ေအာက္မွာ တင္ျပထားတဲ့ ပံုစံအတုိင္း လိုက္လုပ္ေပးရင္ ျဖစ္ႏိုင္ပါတယ္။ အရင္ဆံုး Layout >> Edit HTML မွာ Expand Widget Templates ကို အမွန္ျခစ္ ျခစ္ေပးပါ။

အဆင့္ (၁) စတုိင္ သက္မွတ္ျခင္း

<br />.cal {<br />text-align: right;<br />width: 140px;<br />float: right;<br />white-space: nowrap;<br />font: Normal 34px Helvetica, sans-serif;<br />letter-spacing: -2px;<br />color: #ccc;<br />text-transform: uppercase;<br />line-height: 35px;<br />}<br />.cal_day { float: left;}<br />.date-brick {<br />float: right;<br />height: 30px;<br />width: 45px;<br />background-color: #6498cc;<br />color: #bbd5f1;<br />font: Bold 12px Verdana, Sans-Serif;<br />text-align: center;<br />line-height: 12px;<br />margin-left: 10px;<br />padding-top: 5px;<br />letter-spacing: 0px;<br />overflow: hidden;<br />}

အထက္က CSS ကို Style Sheet မွာ ထည့္ေပးပါ။

အဆင့္ (၂) JS Code ထည့္ျခင္း

<br /><script src='http://bloggerbuster.com/scripts/fastinit.js'></script><br /><script src='http://bloggerbuster.com/scripts/prototype-1.5.0.js'></script><br /><script src='http://bloggerbuster.com/scripts/bloggerbuster-calendar.js'></script>

အထက္က Code ကို </head> ရဲ႕ အထက္နားမွာ ထည့္ေပးပါ။
တကယ္လို႔ ကိုယ့္ဖာသာ Hosting လုပ္ၿပီး တင္ခ်င္တယ္ ဆိုရင္ ဒီမွာ ကလစ္ႏွိပ္ၿပီး Download ယူပါ။

အဆင့္ (၃) Widget တြင္ Code ျပင္ျခင္း

<b:if cond='data:post.dateHeader'> ကို ရွာေပးပါ။ ရွာေတြ႕ၿပီဆိုရင္ <b:if cond='data:post.dateHeader'></div> ၾကားမွာ <h2 class=’date-header’><data:post.dateHeader/></h2> ကို အစားထုိးေပးပါ။

<b:if cond='data:post.dateHeader'>

<h2 class=’date-header’><data:post.dateHeader/></h2>

</b:if>

အနီေရာင္နဲ႔ ျမင္ရတာဟာ အသစ္ျပင္ ထည့္ေပးထားတဲ့ Code ပါ။ တခ်ဳိ႕ တန္းပလိတ္ေတြမွာ ပို႔စ္တင္ ရက္စြဲကို ေအာက္ေျခမွာ ထားထားတတ္ပါတယ္။ တကယ္လို႔ ပို႔စ္ ေအာက္ေျခမွာ ရက္စြဲ ထားထားတယ္ ဆိုရင္ <b:if cond='data:post.dateHeader'> ကို <div class='post-footer'> ရဲ႕ ေအာက္နားမွာ ေတြ႕ရပါလိမ့္မယ္။ အဲဒီလို ေအာက္ေျခမွာ ထားထားတယ္ဆိုရင္ ခုန ျပင္ထားတဲ့

<br /><b:if cond='data:post.dateHeader'><br /><h2 class='date-header'><data:post.dateHeader/></h2><br /></b:if>

ကို <div class='post-body'> ရဲ႕ အထက္နားေလး တင္ေပးပါ။ <div class='post-body'> ကို <div class='post-footer'> ရဲ႕ အေပၚနားမွာ ရွာေတြ႕ႏိုင္ပါတယ္။ ၿပီးၿပီဆိုရင္ Template ကို Save ေပးပါ။

အဆင့္ (၄) Date Format ေျပာင္းေပးျခင္း

Settings >> Formatting ထဲမွာ Date Header Format ဆိုတာ ေတြ႕ပါလိမ့္မယ္။ Date Header Format ကို YYYY-MM-DD အျဖစ္ေျပာင္းေပးပါ။ ခုနစ္၊ လ၊ ရက္ရဲ႕ ၾကားမွာ “-” ခံထားတဲ့ ပံုစံကို ေျပာင္းေပးရပါ႔မယ္။ ဒါ အေရးႀကီးပါတယ္။ တကယ္လို႔ အဲဒီလုိ ေျပာင္းမေပးရင္ အလုပ္လုပ္မွာ မဟုတ္ပါဘူး။ Setting ေျပာင္းၿပီးသြားရင္ Save လုပ္ဖို႔ မေမ့ပါနဲ႔ဦး။

ဒီအဆင့္ ေလးဆင့္ လုပ္ၿပီး သြားၿပီဆုိရင္ က်ေနာ္တို႔ လိုခ်င္တဲ့ စတိုင္က်က် ရက္စြဲဒီဇိုင္းေလးကို ရၿပီ ျဖစ္ပါတယ္။ စမ္းၾကည့္ပါဦး။ အဆင္မေျပရင္ ကြန္းမန္႔မွာ ေျပာခဲ့ေပးပါ။ အဆင္ေျပပါေစဗ်ာ။