Potssamt's Bp

Blogger Background Imageအား ထည့္သြင္းလိုလ်ွင္ ေအာက္ပါလုပ္ေဆာင္ခ်က္ အဆင့္ဆင့္အတိုင္းျပဳလုပ္ပါ။ >>
၁။ ဦးစြာ မိမိBlogအား Loginလုပ္ပါ။
၂။ Layout သို႔သြား၍ Edit HTML tabအားႏွိပ္ပါ။
၃။ Edit Templateေအာက္တြင္ Codeအား ရွင္းလင္းစြာျမင္ႏိုင္ရန္ Expand Widget Template boxကို အမွန္ျခစ္ျပပါ။
၄။ ေအာက္ပါ codeအား ရွာပါ။
body {
background:#bca;

၅။ အထက္ပါ codeအစား ေအာက္ပါ Codeအား ကူးထည့္ပါ။
body {
background-color:#B38481;
background-image: url(http://i363.photobucket.com/albums/oo80/ehnosmellflower/Burma_-_Bagan_Myanmar.jpg);
background-repeat: no-repeat;
background-position: center center;
background-attachment: fixed;

၆။ ထို႔ေနာက္ background-image: url( )ကြင္းထဲတြင္ Image URLအား ထည့္သြင္းရပါမည္။
၇။ ထိုသို႔ထည့္သြင္းႏိုင္ရန္အတြက္ Image hosting websiteမွ မိမိပံုအား Uploadလုပ္ရပါမည္။ ဤ photobucket site အား ဖြင့္ပါ။
၈။ Sign Up လုပ္ပါ။
၉။ ထို႔ေနာက္ မိမိ၏ပံုအား Upload Image & Videorမွ uploadလုပ္ပါ။
၁၀။ Uploadလုပ္ထားေသာပံုေအာက္မွ Direct Linkအား copy လုပ္ပါ။ ထို႔ေနာက္ background-image: url( )ကြင္းထဲတြင္ ထည့္သြင္းလိုက္ပါ။

၁၁။ ယင္းေနာက္ Save Template buttonအား ႏွိပ္ပါ။ View blog လုပ္ႏိုင္ပါၿပီ။
FROM ; http://to4you.blogspot.com

ဒီအေၾကာင္းအရာကိုေတာ့ ညီအကိုတို႔ အရမး္သေဘာက်မယ္ထင္တယ္. ကြ်န္ေတာ္ေရွ့မွာ ဘေလာ့ေပၚမွာ ႏွင္းစက္ေတြ႔ က်လာေအာင္ နည္းလမး္အေၾကာင္းကို ဒီေနရာ ေရးခဲ့ျပီး ျဖစ္ပါတယ္. အဲဒီတုန္းက မွတ္မွတ္ရရ ကြ်န္ေတာ္ရဲ့ ေဘာ္ဒါၾကီး မစိမ္းက သူဘေလာ့ေပၚမွာ ႏွင္းစက္မ်ား က်ေအာင္လုပ္ရင္ေကာ အဆင္ေျပပါမွလားလို႔ ေမးဖူးတယ္. ဘာျဖစ္လုိ႔လဲဆို main background color က အျဖဴေရာင္ျဖစ္ေနလို႔လဲ. ဒါေပမယ့္ ေျပာင္းလို႔ရတာေပါ့ေနာ္.ၾကည့္မေကာင္းဘူး ဘေလာ့ေပၚမွာ ႏွင္းစက္က်ေအာင္လုပ္ပါတယ္ဆိုမွ ကာလာအေရာင္ ျဖစ္ေနရင္ေတာ့ ၾကည့္မေကာင္းဘူးေလ. JavaScript file ကို Notepad ထဲ ထည့္ျပီး ကာလာ အျဖဴေရာင္ code ေနရာမွာ တျခားအေရာင္ ေျပာင္းထည့္ရင္ရပါတယ္. ကဲဒီတခါကေတာ့ မုွန္မွဳန္၀ါး၀ါးမဟုတ္ဘဲ ထင္ထင္ရွားရွား သက္ရြက္ေတြ႔ အသိီးေတြ႔ ကိုယ္ၾကိဳက္တဲ့ အရာ၀တၳဴမ်ား က်လာေအင္ လုပ္ထားတာကို ညီအကိုတို႔ဘေလာ့ေပၚမွာလည္း လုပ္ခ်င္စရာေလး ျဖစ္လာေအာင္ ဒီလင့္ http://michaelmusicworld.blogspot.comမွာ သြားၾကည့္၍ ေတြ႔ႏိူင္ပါတယ.္ . ဒါနဲ႔ ကြ်န္ေတာ္လည္း ညီအကိုတို႔ သံုးရတာ အဆင္ေျပေအာင္ဆိုျပီး ပံုခုႏွစ္ပံုကို လုပ္ထားလုိက္တယ္. ကြ်န္ေတာ္လုပ္ထားတဲ့ ပံုေတြ႔ကို ညီအကိုတို႔က မၾကိဳက္ႏွစ္သက္ဘူး ကိုယ္စိတ္ၾကိဳက္ပံုမ်ားကို တင္ခ်င္တဲ့ဆိုရင္ေတာ့ ပံုအရြယ္အစားမ်ား လုပ္ပံုလုပ္နည္းကို လမ္းညႊန္ပါေစဗ်ာ. Size ကေတာ့ width/high =15px ကေန 20px အတြင္းျဖစ္ရင္ပိုေကာင္းပါတယ္. ေနာက္ ပဳံရဲ႔ background က transparent ျဖစ္ရပါမယ.္ ေအာက္ကေတာ့ ကြ်န္ေတာ္လုပ္ထားတဲ့ ပံု (၇)ပံုရဲ့ လင့္ပါ. ကြ်န္ေတာ္ကေတာ့ ညီအကိုတို႔ အဆင္ေျပေအာင္ဆိုျပီး ကြ်န္ေတာ္ဘဲ တင္ထားလုိက္တယ္. ပို၍ ေကာင္းတာကေတာ့ ညီအကိုိုတို႔ကိုယ္တိုင္ ပံုကို free image host တင္လုိ႔ရမယ္ site တခုခုမွာ တင္တာ ပိုေကာင္းပါလိမ့္မယ္. (လူအမ်ား ၀္ိုင္း ဆြဲသံုးၾကေတာ့ hosting တင္ဖို႔ ခြင့္ limit ေပးထားတဲ့ Bandwidth ကို ေက်ာ္လြန္သြားရင္ down သြားတက္ပါတယ္.)

အခုဘေလာ့ေပၚကေန အရာ၀တၳဴေတြ႔ က်လာေအာင္ လုပ္တဲ့နည္းလမ္းက အျမင္ကျဖင့္
ဘေလာ့ေပၚမွာ ႏွင္းစက္မ်ားက်လာေအာင္ ျပဳလုပ္ပံု နဲ႔ တူတယ္လို႔ ထင္ရေသာ္လည္း တကယ္တမး္ၾကေတာ့ လုပ္ေအာင္ပံု အေျခခံကေတာ့ ကြ်န္ေတာ္ တင္ျပီး ျဖစ္တဲ့ Marquee Effect က်န္ရိွေနေသာအခ်ိဳ ႔ (၂) နဲ႔ သြားတူပါတယ္. ဒီေခါင္းစဥ္ ကိုေတာ့ Marquee Effect က်န္ရိွေသာ အခ်ိဳ႔ (၄) ဆိုျပီ Title ထိုးမလုိ႔ စဥ္းစားမိပါေသးတယ္. (ကိုး၇ီးယား ဇာတ္လမ္းတြဲမ်ားကို အားက်မိလို႔ေလ) ေအာက္က ေဖာ္ျပထားေသာ code မ်ားကို Layout >>>Page Element ျပီးတဲ့ေနာက္ မွေတာ့ Add A Gadget ကိုႏွိပ္ျပီး HTML/JavaScript ကိုေရြးျပီး ျဖည့္လုိက္ပါ.

အေပၚမွာ အနီေရာင္နဲ႔ ေရးသားထားေသာ ပံုရဲ့လင့္ URL မ်ားကိုေတာ့ ညီအကိုတို႔ စိတ္ၾကိဳက္ပံုရဲ့လင့္နဲ႔ ေျပာင္းလဲ ထည့္သြင္းရမွာ ျဖစ္ပါတယ္. ညီအကိုတို႔ ဥာဏ္စြမ္းရိွသေလာက္ ၾကိဳက္သလို႔ scrollamout, height ,left ႏွင့္ top pixel မ်ားရဲ့ တန္ဖိုးမ်ားကို လည္း ေျပာင္းလဲထည့္သြင္း လို႔ရပါတယ္. အဆင္မေျပခဲ့ေသာ္၎ အဆင္ေျပခဲ့ေသာ္၎ feedback (messages) ေလးေတြ႔ ေပးၾကဖို႔ ေတာင္းဆိုပါတယ.္

ဒီhacking ေလးကေတာ့ ဘေလာ့ဂါမ်ားအတြက္ အထူးအသံုး၀င္တဲ့ hacking ျဖစ္ပါတယ္. ဘေလာ့ဂါမ်ားအတြက္ အသံုးလည္း၀င္သလုိ႔ သံုးလဲ သံုးေနၾကပါတယ္. မ်ားျပားလာတဲ့ post ေတြ႔ကို လြယ္လင့္တကူ ရွာေဖြႏိူင္တယ့္ hacking ျဖစ္ပါတယ္.ရိုးရိုးဘေလာ့မွာ ပါရိွျပီးသား older post ကိုႏွိပ္ျပီး ပို႔အေဟာင္းေတြ႔ကို ရွာရရင္ အသက္ၾကီးသြားႏူိင္ပါတယ္. ကိုယ္ေရာက္ခ်င္တဲ့အနည္းဆံုး စာမ်က္ႏွာ ႏွစ္ရြက္သံုးရြက္ေလာက္ ေက်ာ္ခြျပီး သြားႏူိင္ပါတယ္. အရင္ဆံုးအေနနဲ႔ sign in ၀င္လုိက္ပါ.ျပီးရင္ Layout>>>Edit HTML ျပီးရင္ေတာ့ ထံုးစံအတိုင္း မလုပ္မျဖစ္လုပ္သင့္တဲ့ download full template ကို ႏွိပ္ျပီး ကိုယ္ရဲ့ computer ထဲမွာ back up ထားထားလုိက္ပါ. Ctrl+F ကို ႏွိပ္ျပီး ]]></b:skin> ကို ရွာလုိက္ပါ. ျပီးရင္ေတာ့ ေအာက္ကcode မ်ားကို copy ကူးျပီး  ]]></b:skin> ရဲ့အေပၚမွာ  (paste) ကူးထည့္လုိက္ပါ.

.showpageArea {padding: 0 2px;margin-bottom:10px;margin-top:10px;
}

.showpageArea a {border: 1px solid #505050;
color: #000000;font-weight:normal;
padding: 3px 6px !important;
padding: 1px 4px ;margin:0px 4px;
text-decoration: none;
}
.showpageArea a:hover {
font-size:11px;
border: 1px solid #333;
color: #000000;
background-color: #FFFFFF;
}

.showpageNum a {border: 1px solid #505050;
color: #000000;font-weight:normal;
padding: 3px 6px !important;
padding: 1px 4px ;margin:0px 4px;
text-decoration: none;

}
.showpageNum a:hover {
font-size:11px;
border: 1px solid #333;
color: #000000;
background-color: #FFFFFF;

}
.showpagePoint {font-size:11px;
padding: 2px 4px 2px 4px;
margin: 2px;
font-weight: bold;
border: 1px solid #333;
color: #fff;
background-color: #000000;

}

.showpage a:hover {font-size:11px;
border: 1px solid #333;
color: #000000;
background-color: #FFFFFF;

}
.showpageNum a:link,.showpage a:link {
font-size:11px;
padding: 2px 4px 2px 4px;
margin: 2px;
text-decoration: none;
border: 1px solid #0066cc;
color: #0066cc;
background-color: #FFFFFF;}

.showpageNum a:hover {font-size:11px;
border: 1px solid #333;
color: #000000;
background-color: #FFFFFF;
}

Ctrl + F ကိုႏွိ္ပ္ျပီး  <b:section class=’main’ id=’main’ showaddelement=’yes’> ရွာလိုက္ပါ. Expand Widget Templates ကို check ေပးဖုိ႔ မလိုပါဘူး။ သူရဲ့ code မ်ားက ေအာက္ကလို ရိွလိမ့္မယ္.

<b:section class=’main’ id=’main’ showaddelement=’yes’>
<b:widget id=’Blog1′ locked=’true’ title=’Blog Posts’ type=’Blog’/>
</b:section>

ဒီလင့္ကို  ကလစ္ႏွိပ္ျပီး ေတြ႔ရမယ္ script code မ်ားကို  </b:section> ရဲ့ ေအာက္မွာ ကူးထည့္လုိက္ပါ. ျပီးရင္ေတာ့ save template ေပါ့. အယ္ဒီမွာ ျပင္မယ္ဆို ျပင္စရာႏွစ္ခုရိွပါတယ္. (အေပၚဆံုးနားမွာဘဲ ရိွပါတယ္)
var pageCount=10;
var displayPageNum=6;
var pageCount= 10; ဆိုတာကေတာ့ စာမ်က္ႏွာတရြက္ဆီမွာ ေဖာ္ျပျခင္းေသာ post အေရအတြက္ကို ဆိုလိုျခင္းျဖစ္ပါတယ္. var displayPageNum=6; ကေတာ့  ေဖာ္ျပထားခ်င္ေသာ page Navigation ရဲ့အေရအတြက္ ျဖစ္ပါတယ္. ဒါေၾကာင့္မို႔ သံုးစြဲသူညီအကိုတို႔အေနနဲ႔ ကိုယ္စိတ္ၾကိဳက္တန္ဖိုးမ်ားကို ေျပာင္းလဲ ထည့္သြင္းလို႔ရပါတယ္. အဆင္ေျပၾကမယ္လုိ႔ ေမွ်ာ္လင့္ပါတယ္.

Best regards,
michaelmoe21@gmail.com