မဂၤလာပါ။ Tech in Blogging မွႀကိဳဆိုပါတယ္။ ခုလိုမ်ိဳး Blogger tips မေရးတာၾကာပါၿပီ။ တတိယသမီးေတာ္ရဲ႕ ယခုေမးထားတဲ့ ေမးခြန္းေလးက လြယ္ပါတယ္။ ခုအေျဖေပးလိုက္မယ္ဗ်ာ။ လံုး၀မခက္ပါဘူး။ custom template သံုးတဲ့သူေတြအတြက္ပါ။
page မဟုတ္ပါဘူး။ columns (ေခၚ) ေကာ္လန္ ေလးေတြပါ။ ေအာက္မွာေတာ့ ထည့္နည္းေလးေတြလာပါၿပီ။ ဆက္ဖတ္ပါ။
ေအာက္က html code ကို </body> ရဲ႕အေပၚမွာထည့္ရေအာင္...
ေအာက္ကအတုိင္းကူးၿပီး ]]></b:skin> ရဲ႕အေပၚတြင္ထည့္လုိက္ပါ။ ကြ်န္ေတာ္ ဘာလို႕ဒီကုဒ္ေတြထဲမွာအေရာင္ထားတာကို ေနာက္မွရွင္းျပပါမယ္ဗ်ာ။
ဆက္ၾကည့္ပါ။
ကူးၿပီးရင္ သင့္ရဲ႕ Layout ပံုစံက ကြ်န္ေတာ့္ဆိုဒ္ကပံုစံနဲ႕တူပါၿပီ။ ေအာက္ပါပံုကိုၾကည့္ပါ။ Layout ကိုသြားလိုလွ်င္ ကြ်န္ေတာ္ေပးတဲ့အတိုင္းသြားပါ။ :D
ဒီလိုမျမင္ရင္ေတာ့..ျပန္စပါ။ ဟီး။ အဲ့ဒါက ေအာက္မွာရွိပါတယ္။ ကဲ။ သူ႕ရဲ႕ပံုစံ ေတြပါၾကည့္ရေအာင္...
ဒါကိုျပင္ဖို႕ နည္းပါေပးလိုက္မယ္... ဒီအေရာင္က အနက္ေရာင္ template မွာပဲလိုက္ဖက္ပါတယ္။ ျပင္ခ်င္တဲ့သူေတြအတြက္ ေဆးညႊန္းပါေပးလိုက္မယ္။
Photoshop မွာမစမ္းပါနဲ႕။ အေရာင္အမွန္အကန္မရလာတာကို ကြ်န္ေတာ္သတိထားမိပါတယ္။ ဒါေၾကာင့္ Hex Color Generator ေလးကို ဒီကိုကလစ္ ျခင္းျဖင့္ သံုးရေအာင္ဗ်ာ။
I am YGNBlogger and the founder of Tech in Blogging. I am 9th grade student. I'm now 15 years old. I like blogging and writing posts. Through these, my hobbies are swimming and playing games. I am also interested in driving cars.
တတိယေျမာက္သမီးေတာ္: ဆိုဒ္ေအာက္ဆံုးမွာ စာမ်က္ႏွာေလးေတြ ထဲ့ထားတာေတြ ့တယ္ အဲ့ဒါ ဘယ္လိုလုပ္ရတယ္ ဆိုတာေလး ေျပာေပးပါလားရွင္
page မဟုတ္ပါဘူး။ columns (ေခၚ) ေကာ္လန္ ေလးေတြပါ။ ေအာက္မွာေတာ့ ထည့္နည္းေလးေတြလာပါၿပီ။ ဆက္ဖတ္ပါ။
ေအာက္က 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>
ေအာက္ကအတုိင္းကူးၿပီး ]]></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 ကိုသြားလိုလွ်င္ ကြ်န္ေတာ္ေပးတဲ့အတိုင္းသြားပါ။ :D
Blogger >> Layout
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 ပါ။ မႀကိဳက္ရင္ေျပာင္းလိုက္ပါ။
ရွုပ္သြားမယ္ဆုိတာကိုေတာ့သိပါတယ္။ ရွုပ္မယ္ဆုိရင္ ဒီအဆင့္မတိုင္မီရပ္ဖို႕မွာထားခ်င္ပါတယ္။ သူငယ္ခ်င္းတို႕... သတိနဲ႕သာလုပ္ၾကေတာ့ဗ်ာ။ ကြ်န္ေတာ္ နားလည္သေလာက္..တတ္သေလာက္ရွင္းျပထားပါတယ္။ အားလံုးနားလည္မယ္လုိ႕လည္း ေမွ်ာ္လင့္ထားပါတယ္။ အဆင္ေျပပါေစ။
I am YGNBlogger and the founder of Tech in Blogging. I am 9th grade student. I'm now 15 years old. I like blogging and writing posts. Through these, my hobbies are swimming and playing games. I am also interested in driving cars.
0 comments:
Post a Comment