သင့္ Blogger site ရဲ႕ေအာက္မွာ ေကာ္လန္ ၃ခုျခားနည္း (Blogger only)

မဂၤလာပါ။ Tech in Blogging မွႀကိဳဆိုပါတယ္။ ခုလိုမ်ိဳး Blogger tips မေရးတာၾကာပါၿပီ။ တတိယသမီးေတာ္ရဲ႕ ယခုေမးထားတဲ့ ေမးခြန္းေလးက လြယ္ပါတယ္။ ခုအေျဖေပးလိုက္မယ္ဗ်ာ။ လံုး၀မခက္ပါဘူး။ custom template သံုးတဲ့သူေတြအတြက္ပါ။

တတိယေျမာက္သမီးေတာ္: ဆိုဒ္ေအာက္ဆံုးမွာ စာမ်က္ႏွာေလးေတြ ထဲ့ထားတာေတြ ့တယ္ အဲ့ဒါ ဘယ္လိုလုပ္ရတယ္ ဆိုတာေလး ေျပာေပးပါလားရွင္

page မဟုတ္ပါဘူး။ columns (ေခၚ) ေကာ္လန္ ေလးေတြပါ။ ေအာက္မွာေတာ့ ထည့္နည္းေလးေတြလာပါၿပီ။ ဆက္ဖတ္ပါ။

HTML ေတြအရင္ထည့္ရေအာင္...

ေအာက္က html code ကို </body> ရဲ႕အေပၚမွာထည့္ရေအာင္...

<div id='footer-column'>
<div class='footer'>
 <b:section class='footerA' id='footerA' showaddelement='yes'/></div>
<div class='footer'>
 <b:section class='footerB' id='footerB' showaddelement='yes'/></div>
<div class='footer'>
 <b:section class='footerC' id='footerC' showaddelement='yes'/></div>
</div>

ဘာဆက္လုပ္ရမလဲဆုိတာကိုသိခ်င္ရင္ ဆက္ဖတ္ၾကည့္ပါ။

CSS ကိုဆက္ထည့္ရေအာင္...

ေအာက္ကအတုိင္းကူးၿပီး ]]></b:skin> ရဲ႕အေပၚတြင္ထည့္လုိက္ပါ။ ကြ်န္ေတာ္ ဘာလို႕ဒီကုဒ္ေတြထဲမွာအေရာင္ထားတာကို ေနာက္မွရွင္းျပပါမယ္ဗ်ာ။

#footer-column{width:948px;margin:10px auto;padding:10px 6px;overflow:hidden;background:#333;color:#fff;}
.footer{width:306px;margin:0px 5px;padding:0px;overflow:hidden;float:left;}
.footer h2{font-weight:bold;margin:5px;padding:5px 0px;border-bottom:2px dashed #ff0000;color:#fff;}
.footer a{text-decoration:none;font-weight:bold;color:#00fff0;}
.footer a:hover{color:#fff;}

ဆက္ၾကည့္ပါ။

Layout ေျပာင္းလဲျခင္း...

ကူးၿပီးရင္ သင့္ရဲ႕ Layout ပံုစံက ကြ်န္ေတာ့္ဆိုဒ္ကပံုစံနဲ႕တူပါၿပီ။ ေအာက္ပါပံုကိုၾကည့္ပါ။ Layout ကိုသြားလိုလွ်င္ ကြ်န္ေတာ္ေပးတဲ့အတိုင္းသြားပါ။ :D

Blogger >> Layout

ဒီလိုမျမင္ရင္ေတာ့..ျပန္စပါ။ ဟီး။ အဲ့ဒါက ေအာက္မွာရွိပါတယ္။ ကဲ။ သူ႕ရဲ႕ပံုစံ ေတြပါၾကည့္ရေအာင္...

ဒီကုဒ္၏ေကာ္လန္၃ခု...

ဒါကိုျပင္ဖို႕ နည္းပါေပးလိုက္မယ္... ဒီအေရာင္က အနက္ေရာင္ template မွာပဲလိုက္ဖက္ပါတယ္။ ျပင္ခ်င္တဲ့သူေတြအတြက္ ေဆးညႊန္းပါေပးလိုက္မယ္။

ျပင္ဆင္ဖို႕...

Photoshop မွာမစမ္းပါနဲ႕။ အေရာင္အမွန္အကန္မရလာတာကို ကြ်န္ေတာ္သတိထားမိပါတယ္။ ဒါေၾကာင့္ Hex Color Generator ေလးကို ဒီကိုကလစ္ ျခင္းျဖင့္ သံုးရေအာင္ဗ်ာ။

• 
  
• footer-column မွာ 960 px ပါ။ ေကာ္လန္မွာ ၃ခုပါၿပီး ေနာက္ခံ(background အေရာင္) မွာ #333 ျဖစ္ပါတယ္။ အခဲေရာင္လိုလို အနက္ေရာင္လိုလိုပါ။ သင္ႏွစ္သက္သလိုေျပာင္းလုိ႕ရပါတယ္။
• .footer h2 မွာေတာ့ စာအေရာင္က အျဖဴေရာင္ပါ။ #fff ပါ။ မႀကိဳက္ရင္ ေျပာင္းလို႕ရပါတယ္။ ေဘာင္အစက္စက္နဲ႕အေရာင္က အနီေရာင္ပါ။ #ff0000 ပါ။ ေျပာင္းခ်င္ရင္ ေျပာင္းလုိ႕ရပါတယ္။ ျဖစ္ႏိုင္ရင္ ေဘာင္ကိုပါဖ်က္လို႕ရပါတယ္။
• .footer a ကလင့္ပါ။ #00fff0 အေရာင္အမ်ိဳးအစားပါ။ ေျပာင္းလို႕ရပါတယ္။ font-weight:bold မွာ font-weight:italic လို႕လညး္ေျပာင္းလို႕ရပါတယ္။
• .footer a:hover ကလင့္ကိုေထာက္လုိက္ရင္ ေျပာင္းတဲ့အေရာင္တစ္ခုပါ။ နဂိုက #fff ပါ။ မႀကိဳက္ရင္ေျပာင္းလိုက္ပါ။

ရွုပ္သြားမယ္ဆုိတာကိုေတာ့သိပါတယ္။ ရွုပ္မယ္ဆုိရင္ ဒီအဆင့္မတိုင္မီရပ္ဖို႕မွာထားခ်င္ပါတယ္။ သူငယ္ခ်င္းတို႕... သတိနဲ႕သာလုပ္ၾကေတာ့ဗ်ာ။ ကြ်န္ေတာ္ နားလည္သေလာက္..တတ္သေလာက္ရွင္းျပထားပါတယ္။ အားလံုးနားလည္မယ္လုိ႕လည္း ေမွ်ာ္လင့္ထားပါတယ္။ အဆင္ေျပပါေစ။