KyawKyaw112 နဲ႕ ေက်ာ္ေက်ာ္ လိုခ်င္တဲ့ အလွ်ားလိုက္ဘားတန္းပါ....။ ကၽြန္ေတာ္ အခုတေလာ အလုပ္ကိစၥနွင့္ ကၽြန္ေတာ့္ က်န္းမာေရး ကိစၥေၾကာင့္ ဒီပိုစ့္တင္ရန္ အနည္းငယ္ ၾကာသြားတဲ့ အတြက္ ေတာင္းပန္ပါတယ္ဗ်ာ...။ ဒီအလွ်ားလိုက္ ဘားတန္းနဲ႕ဟာကို လိုခ်င္ရင္ေတာ့ အရင္ဆံုး Blogger Account ကိုဝင္လိုက္ပါ....။
ၿပီးရင္ေတာ့ Layout---> Edit HTML ထဲကို ၀င္ၿပီး </head> ကိုအရင္ ႐ွာပါ...။ အေပၚက Code ကိုေတြ႕ရင္ ေအာက္က Code ေတြကို အဲဒီ Code ရဲ႕ အေပၚတြင္ Copy ကူး၍တင္လိုက္ပါ...။
<link rel="stylesheet" type="text/css" href="http://sites.google.com/site/moeeaintphyu/Home/MoeEaintPhyuslidemenu.css?attredirects=0" />
<!--[if lte IE 7]>
<style type="text/css">
html .jqueryslidemenu{height: 1%;} /*Holly Hack for IE7 and below*/
</style>
<![endif]-->
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></script>
<script type="text/javascript" src="http://sites.google.com/site/moeeaintphyu/Home/MoeEaintPhyuslidemenu.js?attredirects=0"></script>
ၿပီးရင္ SAVE မွတ္လိုက္ပါ...။
ေနာက္တစ္ခါ Layout---> Page Elements---> Add a Gadget---> HTML/JavaScript ကို၀င္ၿပီးေအာက္က Code ေတြကို Copy ယူၿပီး သြင္းလို္က္ပါ ၿပီးရင္ Save မွတ္လိုက္ပါ....။
<div id="myslidemenu" class="MoeEaintPhyuslidemenu">
<ul>
<li><a href="http://www.dynamicdrive.com">Item 1</a></li>
<li><a href="#">Item 2</a></li>
<li><a href="#">Folder 1</a>
<ul>
<li><a href="#">Sub Item 1.1</a></li>
<li><a href="#">Sub Item 1.2</a></li>
<li><a href="#">Sub Item 1.3</a></li>
<li><a href="#">Sub Item 1.4</a></li>
</ul>
</li>
<li><a href="#">Item 3</a></li>
<li><a href="#">Folder 2</a>
<ul>
<li><a href="#">Sub Item 2.1</a></li>
<li><a href="#">Folder 2.1</a>
<ul>
<li><a href="#">Sub Item 2.1.1</a></li>
<li><a href="#">Sub Item 2.1.2</a></li>
<li><a href="#">Folder 3.1.1</a>
<ul>
<li><a href="#">Sub Item 3.1.1.1</a></li>
<li><a href="#">Sub Item 3.1.1.2</a></li>
<li><a href="#">Sub Item 3.1.1.3</a></li>
<li><a href="#">Sub Item 3.1.1.4</a></li>
<li><a href="#">Sub Item 3.1.1.5</a></li>
</ul>
</li>
<li><a href="#">Sub Item 2.1.4</a></li>
</ul>
</li>
</ul>
</li>
<li><a href="http://www.moeeaintphyu.net">Moe Eaint Phyu </a></li>
</ul>
<br style="clear: left" />
</div>
ၿပီးရင္အားလံဳးအဆင္ေျပသြားပါၿပီ....။ ေအာ္ေမ့လို႕ Add a Gadget---> HTML/JavaScript ကိုသြင္းဖို႕အတြက္ေအာက္ကလို Template ပံုစံမ်ိဳးေလး ျဖစ္ေနရပါမယ္..။ ဒါမွသာ အလွ်ားလုိက္ ဘားတန္းကို သင္ထည့္သြင္းနိုင္ပါလိမ့္မယ္....။
EOT အေၾကာင္းေလးပါ ....။ EOT ဆိုတာက ဘာလဲဆိုေတာ့ ကိုယ္ေရးသားထားေသာ စာမ်ားကို သံမႈိ ႐ိုက္ႏွက္ၿပီးဆြဲထား သလိုမ်ိဳး Font မ႐ွိလို႕ ေလးေထာင့္ကြက္ေတြေပၚၿပီး ဖတ္မရျဖစ္သလို အျဖစ္မ်ိဳးမျဖစ္ရေအာင္မည္သူမဆို စာသားအျဖစ္ ဖတ္ျမင္နိုင္ေအာင္ျပသထားျခင္းပါ...။ ဘေလာ့ခ္တစ္ခုအတြက္ EOT ေတာ့ RUN ထားသင့္ပါတယ္....။ EOT ႐ွိရင္ ကိုယ့္ရဲ႕ စာကို မျမင္ရမွာကို မစိုးရိမ္ရေတာ့ပါဘူး...။ အေၾကာင္းကေတာ့ ကၽြန္ေတာ္ ဘေလာခ့္ ေတာ္ေတာ္မ်ားမ်ားကို လည္ၾကည့္တဲ့ အခါ မိမိဘေလာ့ခ္မွ စာမ်ားကို ဖတ္မရရင္ Zawgyi Download လုပ္ၿပီး ဖတ္ခိုင္းတဲ့ ဘေလာ့ခ္ အေရအတြက္ ေတာ္ေတာ္မ်ား ကို ေတြ႕ရပါတယ္ ....။ တခ်ိဳ႕ေသာ ဆိုဒ္ေတြမွာ EOT နည္းေတြလည္းမွ်ေဝၾကတဲ့ ဆိုဒ္ေတြ ႐ွိပါတယ္...။ သံလံုငယ္ ၊ အျဖဴေရာင္သံစဥ္ တို႕လို႕ ေနရာမ်ိဳးေတြမွာ EOT အေၾကာင္းကို ေရးသြား မွ်ေ၀ထားၾကပါတယ္...။ ဒါေပမယ့္ ကၽြန္ေတာ္က ထပ္မံမွ်ေ၀ျခင္းပါ .....။ EOT အေၾကာင္းကို သိခ်င္ရင္ေတာ့ အေသးစိတ္ကို ဒီမွာ မွာသြားေရာက္ဖတ္႐ႈနိုင္ပါတယ္...။
EOT ထည့္မယ္ဆိုရင္ေတာ့ သင္ရဲ႕ Blogger Account ကိုဝင္လိုက္ပါ....။ ၿပီးရင္ေတာ့ Layout--->HTML Edit ကို ၀င္ၿပီး ဘေလာ့ခ့္ အသစ္ေတြအတြက္ ေအာက္က CODE မ်ိဳးကို ႐ွာပါ ...။
EOT ထည့္မယ္ဆိုရင္ေတာ့ သင္ရဲ႕ Blogger Account ကိုဝင္လိုက္ပါ....။ ၿပီးရင္ေတာ့ Layout--->HTML Edit ကို ၀င္ၿပီး ဘေလာ့ခ့္ အသစ္ေတြအတြက္ ေအာက္က CODE မ်ိဳးကို ႐ွာပါ ...။
<Variable name="postTitleTxtColor" description="Post Title Text Color"
type="color" default="#000000">
type="color" default="#000000">
ၿပီးရင္ အဲဒီ Code ေတြရဲ႕ အဆံုးမွာ */ ဒီ လိုပံုစံမ်ိဳေလးေတြ႕ပါလိမ့္မယ္....။ အဲဒီေနရာရဲ႕ေအာက္မွာ EOT ကို ထည့္သြင္းရမွာပါ.......။
ေနာက္တစ္ခုကေတာ့ ဘေလာခ့္ Template ေျပာင္းၿပီးသား သူမ်ားအတြက္ကေတာ့ အရင္ဆံုး ေအာက္က Code ကို႐ွာပါ..။
ေနာက္တစ္ခုကေတာ့ ဘေလာခ့္ Template ေျပာင္းၿပီးသား သူမ်ားအတြက္ကေတာ့ အရင္ဆံုး ေအာက္က Code ကို႐ွာပါ..။
body {
....................
........................
.............................
...................................
.......................................
...........................................
}
....................
........................
.............................
...................................
.......................................
...........................................
}
ေတြ႕ၿပီဆိုရင္ေတာ့ သင့္ရဲ႕ EOT CODE ေတြကို အဲဒီ အေပၚမွာ ထည့္ေပးရမွာပါ.....။
MoeEaintPhyu_Zawgyi4.eot
MoeEaintPhyu_Zawgyi3.eot
MoeEaintPhyu_Zawgyi2.eot
MoeEaintPhyu_Zawgyi1.eot
အရင္ဆံုး ဒီလင့္ကဟာေတြကို Download လုပ္ၿပီး အရင္ ဆံုး Upload တင္လိုက္ပါ....။ ေအာက္က သင့္ေတာ္တဲ့ Uplod Link မွာတင္ၿပီး သူေနရာအလိုက္ ျပန္ထည့္ၿပီး အသံုးျပဳပါ....။
http://www.fileden.com/
http://www.filefactory.com/
http://www.filexoom.com/
http://www.ripway.com/
http://www.pages.google.com/
http://www.mediafire.com/
http://files-upload.com/
http://www.wikiupload.com
http://upload2.net/
ဘာေၾကာင့္ Upload တင္ခိုင္းသလဲဆိုေတာ့ ကၽြန္ေတာ္ေပးတဲ့ အတိုင္းသံုးရင္ လူေတြအသံုးမ်ားၿပီး လင့္မနိုင္မွာဆိုးလုိ႕ပါ...။ အေပၚကဖိုင္ေတြ Upload တင္ၿပီးၿပီ ဆိုရင္ေတာ့.....
ေအာက္က EOT ဖိုင္မွာ ႐ွာၿပီး သူ႕ ေနရာအလိုက္ျပန္ထည့္ပါ
ေအာက္က EOT ဖိုင္မွာ ႐ွာၿပီး သူ႕ ေနရာအလိုက္ျပန္ထည့္ပါ
<STYLE TYPE="text/css">
@font-face {
font-family: Zawgyi-One;
font-style: normal;
font-weight: normal;
src: url(http://sites.google.com/site/moeeaintphyu/Home/MoeEaintPhyu_Zawgyi4.eot?attredirects=0);
}
@font-face {
font-family: Zawgyi-One;
font-style: oblique;
font-weight: normal;
src: url(http://sites.google.com/site/moeeaintphyu/Home/MoeEaintPhyu_Zawgyi3.eot?attredirects=0);
}
@font-face {
font-family: Zawgyi-One;
font-style: oblique;
font-weight: 700;
src: url(http://sites.google.com/site/moeeaintphyu/Home/MoeEaintPhyu_Zawgyi2.eot?attredirects=0);
}
@font-face {
font-family: Zawgyi-One;
font-style: normal;
font-weight: 700;
src: url(http://sites.google.com/site/moeeaintphyu/Home/MoeEaintPhyu_Zawgyi1.eot?attredirects=0);
}
အားလံုးလုပ္လို႕ၿပီးသြားရင္ေတာ့ ေနာက္တစ္ဆင့္ ကေတာ့ font-family နဲ႕ font တို႕ေနရာေတြမွာ Zawgyi-One ကိုလိုက္ထည့္ေပးရမွာပါ....။ ေအာက္က Code ကေတာ့ နမူနာ Code ေလးပါ...။
body {
margin:0 auto;
padding:30px 0px 0px 0px;
background:#2a311f ;
font-family:Zawgyi-One,Century gothic, Arial,Tahoma,sans-serif;
color:#161514;
font-size:13px;
}
အားလံုးၿပီးဆံုးသြားၿပီ ဆိုရင္ေတာ့ Save မွတ္လိုက္ပါ ...။ ၿပီးရင္ EOT အလုပ္လုပ္မလုပ္သိခ်င္ရင္ေတာ့ Google Chorme မွာသြားေရာက္ဖြင့္ၾကည့္နိုင္ပါတယ္ ေလးေထာင့္ေလးေတြ ေပၚေနေသးတယ္ဆိုရင္ေတာ့ ကၽြန္ေတာ့္ကို ဆက္သြယ္ၿပီး ေမးျမန္းနိုင္ပါ....။ djlagooneain@gmail.com ကို အက္ၿပီး ေမးျမန္းနိင္ပါတယ္......။
ဒါကေတာ့ ဘေလာ့ခ့္ ေတြအတြက္ ဘေလာခ့္နာမည္ ေ႐ြ႕တာပါ....။ တစ္ခ်ိဳ႕ေသာ ဘေလာခ့္ေတြမွာ ေတြမွာ Firefox. IE ဘားတန္းမွာ ကိုယ့္ရဲ႕ နာမည္ရဲ႕ ေ႐ွ႕မွာ စာသားတစ္ခ်ိဳ႕က နာမည္ေ႐ွ႕မွာေရာက္ေနပါတယ္ ဒါကို ေနရာ ေရြ႕တဲ့ ပိုစ့္ေလးပါ...။ ဘေလာခ့္နာမည္ရဲ႕ ေ႐ွက ဟာကို ေနာက္ကို ပုိ႕တာပါ ဒါကေတာ့ လြယ္ပါတယ္ ေနရာ႐ွာခ်ိန္းလိုက္႐ံုပါပဲ...။
ဘေလာခ့္ကို အရင္ ဆံုး Blogger Account ကို၀င္လိုက္ပါ...။
ၿပီးရင္ Layout---> HTML Edit ကို ၀င္ၿပီးေအာက္က Code ကို႐ွာလိုက္ပါ...။
<title><data:blog.pageTitle/></title>
ၿပီးရင္ေတာ့ ဒိီေအာက္က Code ေတြနဲ႕ အစားထိုး လုိက္ပါ....။ ၿပီးရင္ save မွတ္လိုက္ပါ...။ ဒါဆို အဆင္ေျပမွာပါ...။
<b:if cond='data:blog.pageType == "item"'>
<title><data:blog.pageName/> | <data:blog.title/></title>
<b:else/>
<title><data:blog.pageTitle/></title>
</b:if>
ဝိုင္း ရဲ႕ေတာင္းဆိုမႈ႕ေၾကာင့္ ဒီပုိစ့္ေလးကိုေရးလိုက္တာပါ.....။ ဒီပိုစ့္ေလး ကေတာ့ Animated Flash Tag Cloud ပါ..။ ကၽြန္ေတာ္ တင္ထားတဲ့ တင္သမွ်စာမ်ား ဆိုတဲ့ ေခါင္းစဥ္ေအာက္ က အတိုင္းေပၚေနတာေလးပါ...။ ဒီပိုစ့္မွာေတာ့ ျမန္မာလို ေရးသားတင္လို႕မရပါဘူး တင္ထားေသာ Label မ်ားကို အဂၤလိပ္လို႕ ျပန္ေျပာင္း ရပါလိမ့္မယ္..။ ဘာလို႕လဲဆိုေတာ့ ကၽြန္ေတာ္ တို႕ျမန္မာ Code ေတြက မေပၚလို႕ပါ Uni Code ေတြျဖစ္တဲ့ အဂၤလိပ္လိုသာ ေပၚလုိ႕ပါ...။ ကၽြန္ေတာ္တုိ႕ က Uni Code မ႐ွိေတာ့ အဂၤလိပ္လို Label ေတြျပန္ျပင္ရပါလိမ့္မယ္ ဒါမွသာ အဆင္ေျပပါလိမ့္မယ္....။
သင္အသံုးျပဳခ်င္တယ္ဆိုရင္ေတာ့.... Layout--->HTML/Edit ထဲက ေအာက္က Code ကို႐ွာလိုက္ပါ....။
Code မ႐ွာခင္မွာ သင္ရဲ႕ Download Full Template မွ သင္ Download လုပ္ၿပီး အရင္ Save မွတ္ထားလိုက္ပါ....။ အကယ္၍ မွားယြင္းမႈေၾကာင့္ Code ေတြပ်က္စီးသြား ျခင္းမွ ကာကြယ္နိုင္ရန္ အတြက္ပါ...။ အကယ္၍မွားသြားရင္ ျပန္လည္ အစားထိုးနိုင္ေအာင္လို႕ပါ............။
သင္အသံုးျပဳခ်င္တယ္ဆိုရင္ေတာ့.... Layout--->HTML/Edit ထဲက ေအာက္က Code ကို႐ွာလိုက္ပါ....။
Code မ႐ွာခင္မွာ သင္ရဲ႕ Download Full Template မွ သင္ Download လုပ္ၿပီး အရင္ Save မွတ္ထားလိုက္ပါ....။ အကယ္၍ မွားယြင္းမႈေၾကာင့္ Code ေတြပ်က္စီးသြား ျခင္းမွ ကာကြယ္နိုင္ရန္ အတြက္ပါ...။ အကယ္၍မွားသြားရင္ ျပန္လည္ အစားထိုးနိုင္ေအာင္လို႕ပါ............။
ဒီ Code ကေတာ့ ကၽြန္ေတာ့ရဲ႕ Code ပါ... တူနိုင္ေျခ႐ွိတာ ေၾကာင့္ျပလိုက္တာပါ...။
<b:section class='cahaya7' id='cahaya3' showaddelement='yes'>
ဒီေအာက္က Code ကေတာ့ အမ်ားဆံုး အသံုးျပဳၾကတဲ့ Code ေတြပါ...။
<b:section class='sidebar' id='sidebar' preferred='yes'>
အေပၚက Code မ်ိဳးေတြ႕တယ္ဆိုရင္ေတာ့ သင့္ရဲ႕ အဲဒီ Code ေအာက္မွာ ေအာက္က Code ေတြကို သြင္းလုိက္ပါ...။
<b:widget id='Label99' locked='false' title='Labels' type='Label'>
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content'>
<script src='http://halotemplates.s3.amazonaws.com/wp-cumulus-example/swfobject.js' type='text/javascript'/>
<div id='flashcontent'>Blogumulus by <a href='http://www.moeeaintphyu.net'>MoeEaintPhyu.net</a></div>
<script type='text/javascript'>
var so = new SWFObject("http://halotemplates.s3.amazonaws.com/wp-cumulus-example/tagcloud.swf", "tagcloud", "180", "300", "7", "#ffffff");
// uncomment next line to enable transparency
//so.addParam("wmode", "transparent");
so.addVariable("tcolor", "0x333333");
so.addVariable("mode", "tags");
so.addVariable("distr", "true");
so.addVariable("tspeed", "100");
so.addVariable("tagcloud", "<tags><b:loop values='data:labels' var='label'><a expr:href='data:label.url' style='12'><data:label.name/></a></b:loop></tags>");
so.addParam("allowScriptAccess", "always");
so.write("flashcontent");
</script>
<b:include name='quickedit'/>
</div>
</b:includable>
</b:widget>
ၿပီးရင္ Save မွတ္လိုက္ပါ ဒါဆိုရင္ View Blog ကိုႏွိပ္လိုက္ရင္ သင့္ရဲ႕ ဘေလာခ့္ေပၚမွာ ေပၚေနပါလိမ့္မယ္...။
ဒီေအာက္က Code ကေတာ့ သင္လိုအပ္သလို ေျပာင္းလဲနိုင္ေအာင္ပါ.... ခရမ္းေရာင္နဲ႕ ကာလာမွာ သင္လိုအပ္သလို ခ်ိန္ညွိ သံုးနိုင္ပါတယ္...။
("http://halotemplates.s3.amazonaws.com/wp-cumulus-example/tagcloud.swf", "tagcloud", "180", "300", "7", "#ffffff");
စာလံုး Font ရဲ႕ ကာလာပါ....။
so.addVariable("tcolor", "0x333333");
အျပာေရာင္ေလးက ေတာ့ စာလံုး Font Size ပါ.....။
so.addVariable("tagcloud", "<tags><b:loop values='data:labels' var='label'><a expr:href='data:label.url' style='12'><data:label.name/></a></b:loop></tags>");
