Blog Post ေလးေတြကုိ ပုိင္းျခားထားၾကစုိ႔

ဘေလာ့ဂ္ကုိ အခုမွစတင္ေလ့လာေနသူမ်ားအတြက္ ရည္ရြယ္ၿပီး ဒီ Post ေလးကုိေရးသားရျခင္းျဖစ္ပါတယ္။ မိမိတုိ႔ေရးသားထားတဲ့ Post ေလးေတြကုိ (ကၽြန္ေတာ့ဘေလာ့ဂ္ကဲ့သုိ႔)တစ္ခုနဲ႔တစ္ခု ပုိင္းျခားထားခ်င္တယ္ဆုိရင္ ေအာက္မွာေဖာ္ျပထားတဲ့ အဆင့္မ်ားအတုိင္း လုိက္လုပ္ၾကည့္ၾကရေအာင္...

၁။    ပထမဦးစြာ..မိမိတုိ႔အသုံးျပဳလုိတဲ့ Divider ပုံေလးေတြကုိ ဖန္းတီး/ရွာေဖြထားဖုိ႔လုိပါမယ္။ Photoshop ကၽြမ္းက်င္သူေတြအေနနဲ႔ကေတာ့ အလြယ္တကူဖန္တီးႏုိင္ၾကမွာပါ။ မလုပ္တတ္ၾကရင္လည္း ကိစၥမရွိ.. ေအာက္ကေပးထားတဲ့ ပုံေလးေတြထဲက ႏွစ္သက္ရာတစ္ခုကုိ ေဒါင္းလုပ္ယူၿပီး File Hosting Site တစ္ခုခု (Picasa, Photobucket) တုိ႔တြင္ Upload တင္ထားလုိက္ပါ။

၂။     အခုအေပၚမွာ ေပးထားတဲ့ ပုံေလးေတြရဲ႕ width က 650px ပဲရွိပါတယ္။ ဒါေၾကာင့္ မိမိရဲ႕ Blog Post width က ဘယ္ေလာက္ရွိလဲဆုိတာကုိ သိဖုိ႔လုိအပ္လာပါတယ္။ Blogger ကုိ Sign In လုပ္ၿပီး Layout က Edit HTML ကုိသြားပါ။ ေအာက္ကပုံအတုိင္း Blog Post Width (Main Wrapper) ကုိ ၾကည့္ရႈႏုိင္ပါတယ္။
 

၃။   အေပၚမွာ ၀ုိင္းျပထားတဲ့ေနရာကေတာ့ မိမိ post ရဲ႕အတုိ္င္းအတာ(pixel) ကုိျပတာပဲျဖစ္ပါတယ္။ အဲဒီအတုိင္းအတာနဲ႔တူေအာင္ မိမိရဲ႕ Divider ပုံေလးေတြကုိလည္း adjust လုပ္ဖုိ႔လုိပါတယ္။ Divider ပုံေလးေတြကုိ Photobucket မွာ Upload တင္မယ္ဆုိရင္ေတာ့ ေအာက္မွာျပထားတဲ့အတုိင္း Edit ကုိ Click လုပ္ၿပီး Resize လုပ္ျခင္းျဖင့္ Image Size ကုိ adjust လုပ္ႏုိင္ပါတယ္။ photoshop အသုံးျပဳတတ္သူေတြအတြက္ကေတာ့ အထူးေျပာစရာမလုိပါ။

၄။    အခုေျပာမယ့္အဆင့္ကေတာ့ သိပ္အခက္ႀကီးမဟုတ္ေပမယ့္.သတိထားဖုိ႔ေတာ့လုိပါမယ္။ Layout -->Edit Html ကုိသြားၿပီး မိမိရဲ႕ Template ကုိ Backup လုပ္ထားလုိက္ပါ။ ဒါမွ တစ္ခုခုမွားယြင္းခဲ့ရင္. မိမိရဲ႕ ဘေလာ့ဂ္ေလး မပ်က္စီးေတာ့ဘူးေပါ့။ ၿပီးရင္ ေအာက္မွာ ၀ုိင္းျပထားတဲ့ Code ေလးကုိ ေတြ႕ေအာင္ရွာပါ။ Ctrl+F နဲ႔လည္းရွာႏုိင္ပါတယ္။

၅။      ေတြ႕ၿပီဆိုရင္ အေပၚက Code ေလးကုိဖ်က္ပစ္ၿပီး ေအာက္က Code ေလးေတြကုိ အစားသြင္းလုိက္ပါ

.post {
background: url(http://DIVIDERADDRESS.jpg);
background-repeat: no-repeat;
background-position: bottom center;
margin:.5em 0 1.5em;
border-bottom:0px dotted $bordercolor;
padding-bottom:5.5em;
}

၆။      ဒါဆုိရင္ ေအာက္က ပုံအတုိင္း Code ေလးကုိ အစားသြင္းၿပီးသားျဖစ္သြားပါလိမ့္မယ္။

၇။   အခု ေနာက္ဆုံးအဆင့္ကုိေရာက္ပါၿပီ။ အေပၚကပုံမွာ Highlight လုပ္ထားတဲ့ေနရာကုိ မိမိ Upload တင္ထားတဲ့ Divider Image ရဲ႕ URL ကုိ အစားသြင္းေပးလုိက္ပါ။ မိမိရဲ႕ Template ကုိ Save မလုပ္ခင္ အရင္ Preview ၾကည့္လုိက္ပါအုံး။ OK တယ္ဆုိမွ Save လုပ္ပါ။ အဆင္ေျပပါေစ

အသင့္ျပဳလုပ္ၿပီးသား Divider Image ေတြလုိခ်င္ရင္ ဒီမွာ ေဒါင္းလုပ္ယူပါ။