Blogger Sidebar က link ေတြကို Link nudging effect ေလးထည္.ခ်င္ရင္

ဘာရယ္ညာရယ္ေတာ.မဟုတ္ဘူးေပါ.ဗ်ာ..ကိုယ္.ဘေလာ.ေလးကိုအျမင္ဆန္းေအာင္ ထားခ်င္တဲ.ေဘာ္ေဘာ္ေတြအတြက္ေပါ.။ဆိုဒ္ဘားကလင္.ခ္ေတြကို Mouse Pointer တင္လိုက္တာနဲ.ေရြ.သြားမယ္ဗ်ာ..ထည္.ခ်င္တယ္ဆိုရင္ေတာ.ဆက္လုပ္လိုက္ေပါ.   1.Blogger Dashboard > Template > Edit HTML ကိုသြားပါ
2. Ctrl + F ကိုနွိပ္ပီး.</head> ဆိုတဲ.ကုဒ္ေလးကိုရွာပါ..။
3. ေအာက္မွာေပးထားတဲ.ကုဒ္ေတြကိုအဲဒီ </head> ဆိုတဲ. Tag ေလးရဲ.အေပၚမွာထည္.ေပးလိုက္ပါ
4.Template ကို Save လုပ္လိုက္ပါ
 

 <script type="text/javascript">
    jQuery(document).ready(function(){
    jQuery('.widget-content li a').hover(function() {
    jQuery(this).animate({ paddingLeft: '10px' }, {duration:250});
    }, function() {
    jQuery(this).animate({ paddingLeft: '0px' }, {duration:250});
    });
    });
    </script>    

ဖိုင္ဆိုဒ္အႀကီးေတြကိုဘယ္လိုခြဲပီးျပန္ေပါင္းႀကမလဲ

ဒီနည္းပညာေလးကေတာ.မထူးဆန္းေပမဲ.မသိေသးတဲ.ေဘာ္ေဘာ္ေတြအတြက္ေပါ.ေနာ္..။ ဘေလာ.ဂါေတြကေတာ.သိပီးသားပဲျဖစ္မွာပါ.. ကြ်န္ေတာ္တိုအရမ္းႀကီးတဲ.ဖိုင္ေတြကိုUpload တင္ဖို.လိုအပ္တဲ.အခါမွာအခက္အခဲရိွပါတယ္..။ ဘာလဲဆိုေတာ.ဘေလာ.ဂါ အေတာ္မ်ားမ်ား
ကေတာ.Free ရတဲ.File hosting site ေတြမွာပဲတင္နိုင္ႀကပါတယ္။ Free ဆိုတဲ.အတိုင္းသူ.မွာ
ကန္.သတ္ခ်က္ေတြကရိွပါတယ္..။ ကြ်န္ေတာ္မ်ားေသာအားျဖင္.တင္ျဖစ္တဲMirror Creator
မွာဆိုရင္ Max: Upload Limit က 400 MBရပါတယ္..။ အဲဒီေတာ. 1GB ေလာက္ရိွတဲ.ဖိုင္
တင္ခ်င္တဲ.အခါမွာ 200 MBေလာက္ဖိုင္ငါးခုခြဲတင္ရပါတယ္.. လိုင္းမေကာင္းတဲ.
သူေတြအတြက္လဲဖိုင္ဆိုဒ္ေသးေတာ.တစ္ပိုင္းစီေဒါင္းလိုက္ရင္အဆင္ေျပတာေပါ.ေနာ္။ ဘေလာ.ဂါေတြအတြက္မွမဟုတ္ပါဘူး။ဖိုင္ဆိုဒ္အႀကီးႀကီးေတြကို ပို.ခ်င္၊ Share လုပ္ခ်င္တဲ.သူေတြအတြက္လဲအသံုး၀င္မွာပါ..။

  Win Rar ေဆာ.၀ဲလ္သံုးပီးဖိုင္ေတြကိုခြဲမယ္
1.ကိုယ္ခြဲခ်င္တဲ.ဖိုင္ေပၚမွာ Right Click ေထာက္ပီး Add to archive ဆိုတာကိုနွိပ္ပါ

2. Split to volume,Size ဆိုတဲ.ေနရာမွာကိုယ္ထားခ်င္သေလာက္ဖိုင္ဆိုဒ္သတ္မွတ္ေပးပါ

3.OK ကိုနွိပ္ပီးခနေစာင္.ေပးပါ ။

  HJ-Split ေဆာ.၀ဲလ္ကိုသံုးပီးဖိုင္ေတြခြဲမယ္
1.ကိုယ္.ရဲ Window/Os နဲ.ကိုက္တဲ.HJ-Split ေဆာ.၀ဲလ္ကိုေဒါင္းလိုက္ပါ။
2.ပံုထဲက Split ဆိုတဲ. Tab ကိုနွိပ္ပါ
3.Input File ကိုနွိပ္ပီးကိုယ္ခြဲခ်င္တဲ.ဖိုင္ကိုေရြးေပးပါ

4.ကိုယ္လိုခ်င္တဲ.ဖိုင္ဆိုဒ္ကိုသတ္မွတ္ေပးပီး Start ကိုနွိပ္ပါ..။

HJ-Split ကိုသံုးပီးဖိုင္ေတြျပန္ေပါင္း/ဆက္မယ္
1.Join ဆိုတဲ. Tab ကိုနွိပ္ပါ။
2.Input File ကိုနွိပ္လိုက္ရင္ခုနကခြဲထားတဲ.ဖိုင္ေတြရိွတဲ.လမ္းေႀကာင္းကိုေရာက္သြားပါလိမ္.မယ္။
ခြဲထားတဲ.ဖိုင္ေတြထဲကပထမဆံုးဖိုင္( ဥပမာ File 001 ) ကိုေရြးပီး Start ကိုနွိပ္လိုက္ပါ။
က်န္တဲ.ဖိုင္ေတြကိုအလိုအေလ်ွာက္ရွာပီးေပါင္း / ဆက္ေပးပါလိမ္.မယ္။ 

Best file splitter and joiner softwares

1. GSplit
2. Win Rar 
3.  HJ-Split
4. Free file splitter 
5. Win Zip 

Blogger Post ေတြမွာ HTML / Java Script ကုဒ္ေတြဘယ္လိုထည္.မလဲ

ကြ်န္ေတာ္တို.ေတြဘေလာ.ပို.စ္ေတြေရးႀကတဲ.အခါမွာတစ္ခါတစ္ေလနည္းပညာအေႀကာင္းေရးရင္ ကုဒ္ေတြကိုပို.စ္ထဲမွာထည္.ပီးေရးရတဲ.အခါမ်ိဳးရိွပါတယ္။တစ္ခ်ိဳ.ကုဒ္ေတြကေတာ.ျပန္လည္ ျပင္ဆင္စရာမရိွဘူးဆိုရင္ရင္ကုဒ္ေတြကိုခ်ံဳ.ပီး Select all နဲ.ကူးယူနိုင္ေအာင္တင္ေပး လိုက္လို.ရပါတယ္။ဒါေပမဲ.တစ္တစ္ခါတစ္ေလမွာျပန္လည္ျပင္ဆင္စရာကုဒ္ေတြ ပါခဲ.လို.ရိွရင္ကုဒ္ေတြကိုျဖန္.ပီး Hight Light ေလးနဲ.ျပထားမွဖတ္တဲ.သူလဲ အလြယ္တစ္ကူနားလည္အဆင္ေျပနိုင္မွာပါ..ဒါေလးကေတာ. ေတြ.သမ််ွထဲမွာအလြယ္ကူ၊အရိုးရွင္းဆံုးေလးမို.အသံုး ျပဳလိုသူေတြအတြက္ျပန္လည္မွ်ေဝေပးလိုက္တာပါ။

1. Blogger Dashboard ကိုသြားပါ
2. Template ကိုနွိပ္ပါ
3. Edit HTML ကိုနွိပ္ပါ
4. Ctrl + F ကိုနွိပ္ျပီး ]] ></b:skin> ဆိုတဲ.ကုဒ္ေလးကိုရွာပါ။
5. ေတြ.ပီဆိုရင္ေအာက္မွာေပးထားတဲ.ကုဒ္ေတြကိုကူးယူပီးအဲဒီ ]]></b:skin> ဆိုတဲ. Tag ေလးရဲ.အေပၚမွာ ထည္.ေပးလိုက္ပါ။

pre
{
background:#f0f0f0;
border:10px solid #A6B0BF;
font-size:120%;
line-height:100%;
overflow:auto;
padding:10px;
color:#000000 }
pre:hover {
border:10px solid #efefef;
}
code {
font-size:120%;
text-align:left;
margin:0;padding:0;
color: #000000;}
.clear { clear:both;
overflow:hidden;
}

အေရာင္ခ်ယ္ျပထားတဲ. border / hover / font  ကာလာနဲ.ဆိုဒ္ေတြကိုကိုယ္.ဆိုဒ္ရဲ.Template နဲ.အဆင္ေျပသလိုေျပာင္းလဲနိုင္ပါတယ္..။
 ဘေလာ.ပို.စ္ေရးတဲ.အခါမွာကုဒ္ေတြထည္.ဖို.လိုအပ္လာပီဆိုရင္ေအာက္ကကုဒ္ေလးေတြကို
ကူးပီးမိမိထည္.ခ်င္တဲ.ေနရာေရာက္ရင္ HTML  ထဲကို၀င္ပီးထည္.ပါ..။


<pre>ကုဒ္ေတြဒီမွာထည္.ပါ</pre>

Post A Comment ဆိုတာေလးကိုပံုနဲ.အစားထိုးမယ္

Blogger Post ေတြက Post a Comment ဆိုတဲ.စာသားေလးကိုပံုေလးေတြနဲ.ေျပာင္းလဲ အလွဆင္ခ်င္တဲ.ေဘာ္ဒါေတြအတြက္ပါ။စိတ္၀င္စားတယ္ဆိုရင္ေတာ .ေအာက္ကအတိုင္းပဲဆက္လုပ္ႀကည္.ေပါ.ေနာ္..

Step:1 Blogger Dashboard > Template > Edit HTML ကိုသြားပါ။
Step:2 Ctrl + F ကိုနွိပ္ပီး Search box ထဲမွာေအာက္ကကုဒ္ေလးထည္.ပီးရွာပါ


<a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'>
<data:postCommentMsg/></a>

(ဒါမွမဟုတ္)

 <h4 id='comment-post-message'><data:postCommentMsg/></h4>

<data:postCommentMsg/>  ဆိုတဲ.ေနရာမွာကိုယ္ႀကိဳက္တဲ.ထည္.ခ်င္တဲ.ပံုလင္.ခ္ကိုထည္.ေပးပါ။

 <img src=" http://i1338.photobucket.com/albums/o693/shweminwun/comment081_zps4800a3fb.gif " />

<img src=" http://i1338.photobucket.com/albums/o693/shweminwun/thLEAVEMEACOMMENT1_zps5cd28bdf.gif " />

<img src=" http://i1338.photobucket.com/albums/o693/shweminwun/leaveacomment_zps170a7eec.gif" />

<img src=" http://i1338.photobucket.com/albums/o693/shweminwun/leaveacomm253053li1_zps1522cdfa.gif" />

<img src=" http://i1338.photobucket.com/albums/o693/shweminwun/cooltext1514275182_zps6333a8cc.gif" />


ပီးရင္ေတာ. Template ကို Save လုပ္လို.ရပါပီ။အဆင္ေျပမယ္လို.ေမွ်ာ္လင္.ပါတယ္ ။

Marquee Collections (4)

Marquee Tutorial
Marquee ေလးေတြသေဘာက်တဲ.ေဘာ္ဒါေတြအတြက္ရွာေဖြေတြ.မိတာေလးေတြတင္ေပးလိုက္ပါတယ္။ ကိုယ္လိုခ်င္တာေရြးပီးယူသြားႀကေပါ.ေနာ္။
>| | |High Tech Text| | |<

<marquee behavior=alternate direction=left scrollAmount=3 width="4%"><font face=Webdings>4</font></MARQUEE><marquee scrollAmount=1 direction=left width="2%">| | |</MARQUEE>High Tech Text<marquee scrollAmount=1 direction=right width="2%">| | |</MARQUEE><marquee behavior=alternate direction=right scrollAmount=3 width="4%"><font face=Webdings>3</font></MARQUEE>

>>Highlight Text<<

<marquee behavior="alternate" width="10%">>></marquee>Highlight Text<marquee behavior="alternate" width="10%"><<</marquee>

<<<<Opposite Highlight Text>>>>

<marquee scrollAmount="3" width="10%"><<<<</marquee>Opposite Highlight Text<marquee direction="right" scrollAmount="3" width="10%">>>>></marquee>

Zig Zag Text

<marquee behavior="alternate" direction="up" width="80%"><marquee direction="right">Zig Zag Text</marquee></marquee>

Alternate zig Zag

<marquee behavior="alternate" direction="up" width="80%"><marquee direction="right" behavior="alternate">Alternate zig Zag</marquee></marquee>

Colored Border Marquee

<marquee style="border:#00FF00 2px SOLID">Colored Border Marquee</marquee>

ဒါေတြကကုဒ္ခ်ည္းသတ္သတ္ေပါ...လင္.ခ္ေလးပါထည္.ခ်င္တယ္ဆိုရင္ေတာ.ေအာက္ကအတိုင္းေပါ.ေနာ္

Colored Border Marquee

<a href="http://www.shweminwun.blogspot.com/" target="_blank" style="text-decoration:none"><marquee style="border:#00FF00 2px SOLID">Colored Border Marquee</marquee></a>

ကိုယ္.၀က္ဘ္ဆိုဒ္၊ဘေလာ.ေလးရဲ. loading Speed ကိုျမန္လာေအာင္ဘယ္လိုျမွင္.တင္ႀကမလဲ (၂)

အရင္ကကိုယ္.၀က္ဘ္ဆိုဒ္၊ဘေလာ.ေလးရဲ. loading Speed ကိုျမန္လာေအာင္ဘယ္လိုျမွင္.တင္ႀကမလဲ ဆိုတဲ.ပိုစ္.ေလးကို ဒီေနရာမွာတင္ေပးခဲ.ဖူးပါတယ္။အခုထပ္ပီးေတြ.ရိွထားတဲ.ဒီနည္းေလးကလဲ အေတာ္ကိုထိေရာက္မွဳ.ရိွလို.အသံုးျပဳလိုတဲ..ေဘာ္ဒါေတြအတြက္ျပန္လည္မွ်ေ၀လိုက္ပါတယ္ ။ ကိုယ္.ဆိုဒ္ကိုလာလည္တဲ.သူေတြအေနနဲ.လဲဆိုဒ္ရဲ. Loading ကေနွးေကြးေလးလံေနတယ္ ဆိုရင္စိတ္ပ်က္ႀကမွာပါ။ဒီနည္းေလးကေတာ.ထိေရာက္မွဳ.ရိွပီး အေထာက္အကူျပဳနိုင္လိမ္.မယ္လို.ေမ်ွာ္လင္.ပါတယ္။

1.   Blogger Account ကို Sign in လုပ္ပါ
2. Dashboard > Template ကိုသြားပါ
3. Edit HTML ကိုနွိပ္ပါ
4. Ctrl + F ကိုနွိပ္ပီး </head> ဆိုတဲ.ကုဒ္ေလးကိုရွာပါ။ေတြ.ပီဆိုရင္အဲဒီ </head> ဆိုတဲ.ကုဒ္ေလးရဲ.အေပၚမွာေအာက္မွာေပးထားတဲ.ကုဒ္ေတြကို Copy and Paste လုပ္လိုက္ပါ။
   
   <script charset='utf-8' src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'/> <script src='http://beautifulbloggerwidgets.googlecode.com/files/lazyload-min.js' type='text/javascript'/> <script charset='utf-8' type='text/javascript'> $(function() { $("img").lazyload({placeholder : "http://beautifulbloggerwidgets.googlecode.com/files/grey.gif",threshold : 200}); }); </script> 
    
5. Template ကို Save လုပ္လိုက္ပါ။ျပီးရင္ဆိုဒ္ကို Refresh လုပ္ႀကည္.လိုက္ပါ။ရလဒ္ကဘယ္ေလာက္ထိေရာက္မွဳ.ရိွသလဲဆိုတာ။

Blog Post ေတြမွာ 3D Text Effect ေလးေတြထည္.ခ်င္တဲ.ေဘာ္ဒါေတြအတြက္

3D Text Effect

ဘေလာ.ပို.စ္ေတြမွာ 3D Effect ေလးထည္.ခ်င္တဲ.ေဘာ္ဒါေတြအတြက္ကုဒ္ေလးေတြတင္ေပးလိုက္ပါတယ္။ ပို.စ္ေရးတဲ.အခါမွာ HTML Mode ထဲကို၀င္ပီးေအာက္မွာေပးထားတဲ.ကုဒ္ေလးေတြထည္.ပါ။

<style> .effect_3d { color: #FFFF00 ; font: 60px/80px Garamond, 'Hoefler Text', Times New Roman, Times, serif; margin-bottom: 20px; text-shadow: 0 1px 0 #FFFFFF,              0 2px 0 #A9F5F2,              0 3px 0 #A9D0F5,             0 4px 0 #4B088A,              0 5px 0 #74DF00,              0 6px 0 red; </style> <div class="effect_3d">
Blogger Post 3D Effect</div>

Font Size နဲ. Colour Code ေတြကိုကိုယ္.စိတ္ႀကိဳက္ေျပာင္းလဲလို.ရပါတယ္။
သေဘာက်ႀကမယ္လို.ထင္ပါတယ္။

Hover Effect နဲ. Popular Posts အလန္းစားေလး

ကြ်န္ေတာ္.ဘေလာ.မွာခုထည္.ထားတဲ.Popular Posts ေလးပါ။ေတာ္ေတာ္လန္းပါတယ္။ Mouse Hover Effect ေလးနဲ. ဆိုေတာ.စြဲေဆာင္မွဳ.လဲရိွပါတယ္။ ဘယ္လိုထည္.ရမလဲဆိုတာေတာ.ေအာက္မွာႀကည္.လိုက္ပါ။

Step:1 Blogger Account ကို Login ၀င္ပါ
Step:2  Blogger Dashboard ကိုသြားပါ
Step:3  Lay out ကိုနွိပ္ပါ
Step:4  Add A Gadget ကိုကလစ္ပါ
Step:5 Popular Post ကို Select  လုပ္လိုက္ပါ။( Popular Post Widget ရိွပီးသားဆိုရင္ေတာ.မလိုေတာ.ပါဘူး)

အေပၚကပံုအတိုင္းေျပာင္းေပးလိုက္ပါ။ Post အေရအတြက္ကို (9)ထားေပးပါ။

Step:6  Popular Post Gadget ကို Save လုပ္လိုက္ပါ။
Step:7  Template > Edit HTML သြားပါ။
Step:8  Ctrl + F ကိုနွိပ္ပီး Search box ထဲမွာ ]]></b:skin> ဆိုတဲ.ကုဒ္ေလးရိုက္ထည္.ပီးရွာပါ။
Step:9  ေတြ.ပီဆိုရင္အဲဒီ ]]></b:skin> ဆိုတဲ.ကုဒ္ေလးရဲ.အေပၚမွာေအာက္ကကုဒ္ေတြကို
Copy and Paste လုပ္လိုက္ပါ။

/*Popular Post by http://www.bloggerspice.com */ #PopularPosts1 ul li a:hover{color:#fff;text-decoration:none} #PopularPosts1 ul li:hover { border:4px groove #fff; -moz-transition: all 0.5s ease-out; -o-transition: all 0.5s ease-out; -webkit-transition: all 0.5s ease-out; -ms-transition: all 0.5s ease-out; transition: all 0.5s ease-out; -moz-transform: rotate(2deg); -o-transform: rotate(2deg); -webkit-transform: rotate(2deg); -ms-transform: rotate(2deg); transform: rotate(2deg); filter: progid:DXImageTransform.Microsoft.Matrix( M11=0.9961946980917455, M12=-0.08715574274765817, M21=0.08715574274765817, M22=0.9961946980917455, sizingMethod='auto expand'); zoom: 1; } #PopularPosts1 ul li a { -webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px; color: #ffffff; display: block; font-family: Georgia, 'Times New Roman', Times, serif; font-size: 13px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 18px; margin: 0px 40px 0px 0px; min-height: 30px; orphans: 2; padding: 0px; text-align:-webkit-auto; text-decoration: none !important; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; } #PopularPosts1 ul li .item-thumbnail{ float:left; border:0; margin-right:10px; background:transparent; padding:0; width:51px; height:51px; } #PopularPosts1 ul li:first-child:after, #PopularPosts1 ul li:first-child + li:after, #PopularPosts1 ul li:first-child + li + li:after, #PopularPosts1 ul li:first-child + li + li + li:after, #PopularPosts1 ul li:first-child + li + li + li + li:after, #PopularPosts1 ul li:first-child + li + li + li + li + li:after, #PopularPosts1 ul li:first-child + li + li + li + li + li + li:after, #PopularPosts1 ul li:first-child + li + li + li + li + li + li + li:after, #PopularPosts1 ul li:first-child + li + li + li + li + li + li + li + li:after, #PopularPosts1 ul li:first-child + li + li + li + li + li + li + li + li + li:after{ position:absolute; top:10px; right:5px; border-radius:50%; -moz-border-radius:50%; -webkit-border-radius:50%; border:2px solid #ccc; background:#353535; box-shadow:0px 0px 5px #000; -webkit-box-shadow:0px 0px 5px #000; -moz-box-shadow: 0px 0px 5px #000; width:30px; height:30px; line-height:1em; text-align:center; font-size:28px; color:#fff; } #PopularPosts1 ul li:first-child + li + li + li + li + li + li + li +li +li{ background:#000000; width:90%; } #PopularPosts1 ul li:first-child + li + li + li + li + li + li + li + li + li:after{ content:"10"} #PopularPosts1 ul li:first-child + li + li + li + li + li + li + li +li{background:#1a1a1a;width:93%} #PopularPosts1 ul li:first-child + li + li + li + li + li + li + li + li:after{content:"9"} #PopularPosts1 ul li:first-child + li + li + li + li + li + li + li {background:#C50101;width:93%} #PopularPosts1 ul li:first-child + li + li + li + li + li + li + li:after{content:"8"} #PopularPosts1 ul li:first-child + li + li + li + li + li +li{background:#1a1a1a;width:93%} #PopularPosts1 ul li:first-child + li + li + li + li + li + li:after{content:"7"} #PopularPosts1 ul li:first-child + li + li + li + li +li{background:#C50101;width:93%} #PopularPosts1 ul li:first-child + li + li + li + li + li:after{content:"6"} #PopularPosts1 ul li:first-child + li + li + li + li{background:#1a1a1a;width:93%} #PopularPosts1 ul li:first-child + li + li + li + li:after{content:"5"} #PopularPosts1 ul li:first-child + li + li + li{background:#C50101;width:93%} #PopularPosts1 ul li:first-child + li + li + li:after{content:"4"} #PopularPosts1 ul li:first-child + li + li{background:#1a1a1a;width:93%} #PopularPosts1 ul li:first-child + li + li:after{content:"3"} #PopularPosts1 ul li:first-child + li{background:#C50101; width:93%} #PopularPosts1 ul li:first-child + li:after{content:"2"} #PopularPosts1 ul li:first-child{background:#1a1a1a ;width:93%} #PopularPosts1 ul li:first-child:after{content:"1"} #PopularPosts1 ul{ margin:0; padding:0px 0; list-style-type:none; } #PopularPosts1 ul li{ position:relative; margin:6px 0; border: 1px solid #c2c0b8; -webkit-box-shadow: 0 0 60px 10px rgba(0, 0, 0, 0.02) inset, 0 5px 0 -4px #222, 0 5px 0 -3px #c2c0b8, 0 11px 0 -8px #222, 0 11px 0 -7px #c2c0b8, 0 17px 0 -12px #222, 0 17px 0 -11px #c2c0b8; -moz-box-shadow: 0 0 60px 10px rgba(0, 0, 0, 0.02) inset, 0 5px 0 -4px #222, 0 5px 0 -3px #c2c0b8, 0 11px 0 -8px #222, 0 11px 0 -7px #c2c0b8, 0 17px 0 -12px #222, 0 17px 0 -11px #c2c0b8; box-shadow: 0 0 60px 10px rgba(0, 0, 0, 0.02) inset, 0 5px 0 -4px #222, 0 5px 0 -3px #c2c0b8, 0 11px 0 -8px #222, 0 11px 0 -7px #c2c0b8, 0 17px 0 -12px #222, 0 17px 0 -11px #c2c0b8; padding:10px; } .PopularPosts .item-title a{ font: normal bold 36px Segoe UI; font-size:16px; color: #ffffff; } .PopularPosts .item-title a:hover{ color:#ffffff; text-decoration:none; } .widget-content.popular-posts li{ font: normal normal 16px Segoe UI; } .item-snippet { height:2.5em; overflow:hidden; }

Step:10 Preview နဲ.ႀကည္.ပီးစိတ္ေက်နပ္မွဳ.ရိွပီဆိုရင္ Template ကို Save လုပ္လို.ရပါပီ။

မူရင္းလင္ခ္.ပါ

Blogger Template ေတြအတြက္ Page Navigation Style ( 5 ) မ်ိဳး

Blogger Template ေတြအတြက္ Page Navigation ပံုစံေလးေတြ ( ၅ )မ်ိဳးပါ။ ကိုယ္သေဘာက် တာေရြးယူပီးထည္.ႀကေပါ.ေနာ္။
Step:1  Blogger Dash board > Template > Edit HTMl ကိုသြားပါ။
Step:2   Ctrl + F ကိုနွိပ္ပီး Search box ထဲမွာေအာက္ကကုဒ္ေလးေတြရိုက္ထည္.ပီးရွာပါ။

<b:includable id='mobile-index-post' var='post'>

Step:3  ေတြ.ပီဆိုရင္ေအာက္ကကုဒ္ေတြကိုေကာ္ပီကူးယူပီးအဲဒီ

<b:includable id='mobile-index-post' var='post'> ဆိုတဲ.ကုဒ္ေတြကေပၚမွာထည္.ေပးလိုက္ပါ။ 

<b:includable id='page-navi'>
<div class='pagenavi'>
<script type='text/javascript'>
var pageNaviConf = {
perPage: 7,
numPages: 5,
firstText: "First",
lastText: "Last",
nextText: "»",
prevText: "«"
}
</script>
<script src='http://awesome-navigation.googlecode.com/files/onlinetrick.js' type='text/javascript'/>
<div class='clear'/>
</div>
</b:includable>

အေရာင္ခ်ယ္ျပထားတဲ.ေနရာေတြမွာကိုယ္.စိတ္ႀကိဳက္ေျပာင္းလဲလို.ရပါတယ္။


Step:4  ေနာက္တစ္ခါ Search box ထဲမွာေအာက္ကကုဒ္ေလးေတြရိုက္ပီးထပ္ရွာပါ။

<b:include name='nextprev'/> 

ေတြပီဆိုရင္ေအာက္မွာေပးထားတဲ.ကုဒ္ေတြနဲ.အစားထိုးေပးလိုက္ပါ။

<b:if cond='data:blog.pageType == &quot;index&quot;'>
<b:include name='page-navi'/>
<b:else/>
<b:if cond='data:blog.pageType == &quot;archive&quot;'>
<b:include name='page-navi'/>
</b:if>
<b:else/>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<b:include name='nextprev'/>
</b:if>
</b:if>

Step:5 ေနာက္ဆံုးအဆင္.အေနနဲ.]]></b:skin> ဆိုတဲ.ကုဒ္ေလးထပ္ရွာပါ။ေတြ.ပီဆိုရင္အဲဒီကုဒ္ေလး
ရဲ.အေပၚမွာေအာက္မွာေပးထားတဲ.ပံုစံေတြထဲကကိုယ္နွစ္သက္ရာ ပံုစံရဲ.ကုဒ္ကိုယူပီးထည္.ေပးလိုက္ပါ။

#blog-pager, .pagenavi { clear: both; text-align: center; margin: 30px auto 10px; } #blog-pager a, .pagenavi span, .pagenavi a { text-decoration: none; color: #333; text-shadow: 0 1px 0 rgba(255, 255, 255, .5); background-color: #F8F8F8; filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr=#fffcfcfc,EndColorStr=#fff8f8f8); background-image: -moz-linear-gradient(top,#FCFCFC 0,#F8F8F8 100%); background-image: -ms-linear-gradient(top,#FCFCFC 0,#F8F8F8 100%); background-image: -o-linear-gradient(top,#FCFCFC 0,#F8F8F8 100%); background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0,#FCFCFC),color-stop(100%,#F8F8F8)); background-image: -webkit-linear-gradient(top,#FCFCFC 0,#F8F8F8 100%); background-image: linear-gradient(to bottom,#FCFCFC 0,#F8F8F8 100%); padding: 5px 10px; border: 1px solid lightGrey; font-weight: bold; font-size: 12px; vertical-align: middle; -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; margin: 2px 2px; -webkit-transition: .0s ease-in!important; -moz-transition: .0s ease-in!important; -ms-transition: .0s ease-in!important; -o-transition: .0s ease-in!important; transition: .0s ease-in!important; } #blog-pager a:hover, .pagenavi a:hover { border-color: #C6C6C6; filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr=#fff8f8f8,EndColorStr=#ffeeeeee); background-image: -moz-linear-gradient(top,#F8F8F8 0,#EEE 100%); background-image: -ms-linear-gradient(top,#F8F8F8 0,#EEE 100%); background-image: -o-linear-gradient(top,#F8F8F8 0,#EEE 100%); background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0,#F8F8F8),color-stop(100%,#EEE)); background-image: -webkit-linear-gradient(top,#F8F8F8 0,#EEE 100%); background-image: linear-gradient(to bottom,#F8F8F8 0,#EEE 100%); } #blog-pager-older-link, #blog-pager-newer-link { float: none; } .pagenavi .current { border-color: #C6C6C6; background-color: #E9E9E9; background-image: none; -moz-box-shadow: inset 0 1px 1px rgba(0,0,0,.20); -ms-box-shadow: inset 0 1px 1px rgba(0,0,0,.20); -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .20); box-shadow: inset 0 1px 1px rgba(0, 0, 0, .20); } .pagenavi a:active { border-color: #C6C6C6; background-color: #E9E9E9; background-image: none; -moz-box-shadow: inset 0 1px 1px rgba(0,0,0,.20); -ms-box-shadow: inset 0 1px 1px rgba(0,0,0,.20); -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .20); box-shadow: inset 0 1px 1px rgba(0, 0, 0, .20); }

#blog-pager, .pagenavi { clear: both; text-align: center; margin: 30px auto 10px; } #blog-pager a, .pagenavi span, .pagenavi a { background-color: #3BB3E0; padding: 5px 10px; position: relative; margin: 2px; font-size: 12px; text-decoration: none; color: white; border: solid 1px #186F8F; background-image: linear-gradient(bottom, #2CA0CA 0%, #3EB8E5 100%); background-image: -o-linear-gradient(bottom, #2CA0CA 0%, #3EB8E5 100%); background-image: -moz-linear-gradient(bottom, #2CA0CA 0%, #3EB8E5 100%); background-image: -webkit-linear-gradient(bottom, #2CA0CA 0%, #3EB8E5 100%); background-image: -ms-linear-gradient(bottom, #2CA0CA 0%, #3EB8E5 100%); background-image: -webkit-gradient( linear, left bottom, left top, color-stop(0, #2CA0CA), color-stop(1, #3EB8E5) ); -webkit-box-shadow: inset 0px 1px 0px #7FD2F1, 0px 1px 0px white; -moz-box-shadow: inset 0px 1px 0px #7fd2f1, 0px 1px 0px #fff; box-shadow: inset 0px 1px 0px #7FD2F1, 0px 1px 0px white; -webkit-border-radius: 5px; -moz-border-radius: 5px; -o-border-radius: 5px; border-radius: 5px; } #blog-pager a:hover, .pagenavi a:hover { background-image: linear-gradient(bottom, #3EB8E5 0%, #2CA0CA 100%); background-image: -o-linear-gradient(bottom, #3EB8E5 0%, #2CA0CA 100%); background-image: -moz-linear-gradient(bottom, #3EB8E5 0%, #2CA0CA 100%); background-image: -webkit-linear-gradient(bottom, #3EB8E5 0%, #2CA0CA 100%); background-image: -ms-linear-gradient(bottom, #3EB8E5 0%, #2CA0CA 100%); background-image: -webkit-gradient( linear, left bottom, left top, color-stop(0, #3EB8E5), color-stop(1, #2CA0CA) ); } #blog-pager-older-link, #blog-pager-newer-link { float: none; } .pagenavi .current { background-image: linear-gradient(bottom, #3EB8E5 0%, #2CA0CA 100%); background-image: -o-linear-gradient(bottom, #3EB8E5 0%, #2CA0CA 100%); background-image: -moz-linear-gradient(bottom, #3EB8E5 0%, #2CA0CA 100%); background-image: -webkit-linear-gradient(bottom, #3EB8E5 0%, #2CA0CA 100%); background-image: -ms-linear-gradient(bottom, #3EB8E5 0%, #2CA0CA 100%); background-image: -webkit-gradient( linear, left bottom, left top, color-stop(0, #3EB8E5), color-stop(1, #2CA0CA) ); }

#blog-pager, .pagenavi { clear: both; text-align: center; margin: 30px auto 10px; } #blog-pager a, .pagenavi span, .pagenavi a { border: 1px solid #3d8bf2; padding: 5px 10px; text-decoration: none; font-family: arial; color:#fff; margin: 2px; background-image: url('http://onlinetrick-ot.googlecode.com/svn/image/menubg1.PNG'); background-position: left; -webkit-transition: all 0.7s ease-in-out; -moz-transition: all 0.7s ease-in-out; -o-transition: all 0.7s ease-in-out; } #blog-pager a:hover, .pagenavi a:hover { background-position:right; } #blog-pager-older-link, #blog-pager-newer-link { float: none; } .pagenavi .current { background-position:right; }

#blog-pager, .pagenavi { clear: both; text-align: center; margin: 30px auto 15px; } #blog-pager a, .pagenavi span, .pagenavi a { border: 1px solid #3d8bf2; padding: 5px 10px; text-decoration: none; font-family: arial; color:#fff; margin: 2px; background-image: url('http://onlinetrick-ot.googlecode.com/svn/image/menubg2.PNG'); background-position: bottom; -webkit-transition: all 0.7s ease-in-out; -moz-transition: all 0.7s ease-in-out; -o-transition: all 0.7s ease-in-out; } #blog-pager a:hover, .pagenavi a:hover { background-position:top; } #blog-pager-older-link, #blog-pager-newer-link { float: none; } .pagenavi .current { background-position:top; }

#blog-pager, .pagenavi { clear: both; text-align: center; margin: 30px auto 15px; } .pagenavi .pages { display: none; } #blog-pager a, .pagenavi span, .pagenavi a { padding: 5px 10px; text-decoration: none; font-family: arial; color: white; margin: 2px; background: black; background-position: bottom; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; border-radius: 30px; font-size: 20px; } #blog-pager a:hover, .pagenavi a:hover { background: orange; } #blog-pager-older-link, #blog-pager-newer-link { float: none; } .pagenavi .current { background: orange; }

Step:6  Preview နဲ.အရင္ႀကည္.လိုက္ပါ။သေဘာက်ပီဆိုရင္ Template ကို Save လုပ္လို.ရပါျပီ။
အဆင္ေျပပါေစေနာ္။

Adblocker extension သံုးထားတဲ. visitors ေတြကိုကိုယ္.၀က္ဘ္ဆိုဒ္၊ဘေလာ.မွာ Block ထားမယ္

Adblocker ဆိုတာကေတာ. Browser extension ပါပဲ..Facebook / Google / Youtube/ website/blogs
ေတြကေႀကျငာေတြ၊ Pop up window ေတြ။ေဒါင္းလုဒ္လင္.ေတြက Ad ေတြကို Block ေပးနိုင္၊
ေက်ာ္လႊားသြားနိုင္မဲ. Extension ေလးပါ။ ဘေလာ.ဂါေတြအေနနဲ.အဲဒီလို Extension ေတြသံုးထားတဲ.
User ေတြကိုျပန္ Block မယ္ဆိုရင္ကိုယ္.ရဲ၀က္ဆိုဒ္၊ဘေလာ.က Template မွာကုဒ္ေလးအနည္းငယ္
ထည္.လိုက္မယ္ဆိုရင္ရပါျပီ..Adblocker Install လုပ္ထားတဲ. User ေတြအေနနဲ.extension ကို
Disable လုပ္ပီးမွဆိုဒ္ကို၀င္လို.ရေတာ.မွာပါ။ဘေလာ.ဂါေတြအေနနဲ.အဲဒီလိုမလုပ္ခင္မွာ
မူလပိုစ္.ပိုင္ရွင္ရဲ.အာေဘာ္ေလးနဲနဲေလာက္ဖတ္ႀကည္.လိုက္ပါ
။ျပီးမွထည္.တာ၊မထည္.တာကေတာ.ကာယက့ရွင္ရဲ.စိတ္ဆႏၵအတိုင္းပါပဲလို.။

 There are many pros and cons of this plugins.

Pros - 

1. You will have more income as ads are visible to all.
2. After adding Ad-blocker the UI of the website changes to an extent.
After adding this plugin all can see the actual page.

Cons- 

1. Bounce rate is going to be much higher
2. You may loose visitors.

A bloggers main job is helping others and not making money so I would personally recommend not to use this plugin. But if you think that you are not getting anything for the things you have been providing to your visitors you may add this plugins.

ထည္.မယ္လို.ဆႏၵရိွတယ္ဆိုရင္ေတာ.ေအာက္ကအတိုင္းပဲဆက္လုပ္လိုက္ပါ။

Step:1   Blogger Dashboard > Template > Edit HTML ကိုသြားပါ။
Step:2  Ctrl + F ကီုနွိပ္ပီး </body> ဆိုတဲ.ကုဒ္ေလးကိုရွာပါ။
Step:3  ေတြပီဆိုရင္ေအာက္မွာေပးထားတဲ.ကုဒ္ေတြကိုေကာ္ပီကူးပီးခုနက </body>
ဆိုတဲ.ကုဒ္ေလးရဲ.အေပၚမွာ Paste လုပ္ေပးလိုက္ပါ။

<div id="abt-adblock-container"> <script type='text/javascript'> //<![CDATA[ document.write('<\/SCR'+'IPT>'); //]]> </script> </div> <script type='text/javascript'> //<![CDATA[ if (document.getElementById("abt-adblock-container").clientHeight < 11 || document.getElementById("abt-adblock-container").style.position == "absolue") {window.location = "http://www.techigeek.com/abt-adblocker-blocker.html";} //]]> </script>  <br>

Step:4 Template ကို Save လုပ္လိုက္ပါ။

<Template တိုင္းမွာေတာ.အလုပ္မလုပ္နိုင္ပါဘူး>ကြ်န္ေတာ္က Adblocker Browser Extension
လည္းအင္စေတာလုပ္မထားသလို၊ကြ်န္ေတာ္.ဘေလာ.ေလးမွာလဲဘာ Ad မွခံမထားတဲ.အတြက္
မစမ္းသပ္လိုက္ျဖစ္တာကြ်န္ေတာ္.လိုအပ္ခ်က္ပါလို.ရိုးသားစြာ၀န္ခံပါတယ္။

Blogger ေတြအတြက္အလန္းစား Templates ေလးနွစ္ခု

Blogger ေတြအတြက္ကြ်န္ေတာ္ေတြ.မိသမွ်ထဲကအလန္းဆံုး Template ေလးနွစ္ခုတင္ေပးလိုက္ပါတယ္။ တစ္ခုေျပာစရာရိွပါတယ္။ ဒီလို Ready made Template ေတြမွာ Template Designer ေတြက သူတို.ရဲ. Template ကိုျပန္လည္ျပင္ဆင္ခြင္.ေတြကိုကန္.သတ္ထားပါတယ္။ HTML အေတာ္အတန္သေဘာေပါက္ရင္ေတာ. Template ထဲက ကုဒ္ေတြကိုကိုယ္လိုသလိုျဖည္.စြက္ျပင္ဆင္နိုင္ပါတယ္။ ကြ်န္ေတာ္ကေတာ. blogger.com ကအလကား ေပးတဲ. Template ကိုပဲသံုးပါတယ္။

Dyto Share template
ဒီေကာင္ေလးကဘယ္ညာဆိုဒ္ဘားနွစ္ဖက္နဲ.  Templateကိုလည္းေဘာင္ခတ္ထားတာေႀကာင္ .စနစ္က်သပ္ရပ္ျပီးေတာ္ေတာ္ႀကည္.လို.ေကာင္းပါတယ္။
ညာဖက္ဆိုဒ္ဘားေလးကေတာ. Loading နဲနဲေနာက္က်ပါတယ္

နမူနာႀကည္.ရန္

Dyto Share Template Download Link Below

  New Plus Blue Blogger Template
ဒီေကာင္ေလးကလဲဘယ္ညာဆိုဒ္ဘားနွစ္ဖက္ပါပဲ။ပို.စ္ေတြကိုႀကည္.ဖို. Read More ကိုနွိပ္လိုက္ရင္
ညာဖက္ဆိုဒ္ဘားတစ္ဖက္ေပ်ာက္သြားပီးပိုစ္.ေဘာ္ဒီကိုခ်ဲ.ေပးလိုက္ပါတယ္။ ေတာ္ေတာ္ေလးလန္း ပါတယ္။ Lay out မွာ Widget ေတြကို Drag and Move လုပ္တဲ.ေနရာမွာေတာ.နဲနဲလက္၀င္ပါတယ္။

နမူနာႀကည္.ရန္

New Plus Blue Template Download Link

ဘေလာ.အတြက္အသံုးျပဳဖို. Search box မ်ား

ဘေလာ.မွာ Search box ေလးထည္.ခ်င္သူေတြအတြက္ပါ။
 ေအာက္မွာနမူနာပံုနဲ.ကုဒ္ေတြေပးထားပါတယ္။
ကိုယ္သေဘာက်တာသာယူသံုးလိုက္ေနာ္။

1.  Go to Blogger Dashboard
2. Click Add a Gadget
3. Choose HTML/Java Script
4. Copy and Paste Code

<form id="searchThis" action="/search" style="display:inline;" method="get"> <input id="searchBox" name="q" type="text"/> <input id="searchButton" value="Go" type="submit"/></form>

<form id="searchthis" action="/search" style="display:inline;" method="get"> <input id="search-box" name="q" size="25" type="text" style="background: #ccccff; border: 2px solid #000066"/><input id="search-btn" value="Search" type="submit" style="background: #000066; border: 2px outset #ff0000; color: #ffffff; font-weight: bold;"/></form>

<form id="searchthis" action="/search" style="display:inline;" method="get"> <input id="search-box" name="q" size="25" type="text" value="Enter search terms"/><input id="search-btn" value="Search" type="image" src="http://dryicons.com/images/icon_sets/stickers_icon_set/png/16x16/search_magnifier.png" style="margin-left: 5px; margin: 3px 0 0 5px;"/></form>

ဘေလာ.ဂါေတြအတြက္အရမ္းလန္းတဲ. JQuery Sliding Panel ေလးပါ

ဒါေလးကေတာ.နိုင္ငံျခားဆိုဒ္တစ္ခုမွာေတြ.မိလို.အရမ္းသေဘာက်တာနဲ.သံုးခ်င္တဲ. ဘေလာ.ဂါေဘာ္ဒါမ်ားရိွရင္လဲသံုးနိုင္ေအာင္ျပန္လည္မွ်ေ၀ေပးလိုက္တာပါ Panel ထဲမွာဘာေတြပါသလဲဆိုေတာ. WELCOME message / Author info / Search box Categories / Email subscribe /  Facebook/RSS Feed/Google+/Twitter Follower စတာေတြပါ၀င္ပါတယ္။နမူနာႀကည္.ခ်င္ရင္ေတာ.ေအာက္က  Demo Link မွာသြားႀကည္.နိုင္ပါတယ္

သေဘာက်လို.သုံးခ်င္တယ္ဆိုရင္ေတာ.ေအာက္ကအတိုင္းပဲဆက္လုပ္လိုက္ပါ
Step.1 Blogger Dashboard ကို၀င္လိုက္ပါ။
Step.2 Template ကိုသြားပါ
Step.3 Edit HTML ကိုနွိပ္ပါ
Step.4 Ctrl + F ကိုနွိပ္ျပီး Search box ထဲမွာ <head> ဆိုတဲ.ကုဒ္ေလးရိုက္ျပီး enter ေခါက္ပါ။
ေတြ.ျပီဆိုရင္ေအာက္မွာေပးထားတဲ.ကုဒ္ေတြကိုေကာ္ပီကူးပီးအဲဒီ<head> ဆိုတဲ.
 tag ေလးရဲ.ေအာက္မွာ Paste ခ်လိုက္ပါ

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js' type='text/javascript'></script>
<script type='text/javascript'>
$(document).ready(function() {

$(&quot;#open&quot;).click(function(){
$(&quot;div#panel&quot;).slideDown(&quot;slow&quot;);
});

$(&quot;#close&quot;).click(function(){
$(&quot;div#panel&quot;).slideUp(&quot;slow&quot;);
});

$(&quot;#toggle a&quot;).click(function () {
$(&quot;#toggle a&quot;).toggle();
});

});</script>

<b:if cond='data:blog.pageType != &quot;item&quot;'>
<style>
body#layout #slide-top-panel {display:none !important;}
</style>
</b:if>


Step.5 Search box ထဲမွာ</head> ဆိုတဲ.ကုဒ္ေလးရိုက္ျပီးထပ္ရွာပါ။ေတြ.ပီဆိုရင္ေအာက္မွာေပး ထားတဲ.ကုဒ္ေတြကိုေကာ္ပီကူးယူပီးအဲဒီ </head>ဆိုတဲ.ကုဒ္ေလးရဲ.အေပၚမွာ Paste ခ်လိုက္ပါ.။

<style>
.clearfix:after {content: ".";display: block;height: 0;clear: both;visibility: hidden;}
.clearfix {display: inline-block;}
* html .clearfix {height: 1%;}
.clearfix {display: block;}
.clearfix {height: 1%;}
.clearfix {display: block;}

.tab {
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjRfD-LEfgbFsvnsXBfSARe6JcUy8wLBnSOSZDoCRLFYDQIA1pXNXbPapSBy5DFnHMl80FFNCXn3dE1zuNutRihEQoZ9sKFBFHxN3-8hT8iZq_Rf9ghjBype0fKwqi95ZWhwk9RPtwN3Cp8/s1600/sliding-panel-tab-0.png) repeat-x 0 0;
height: 42px;
position: relative;
top: 0;
z-index: 999;
}
.tab ul.login {
display: block;
position: relative;
float: right;
clear: right;
height: 42px;
width: auto;
font-weight: bold;
line-height: 42px;
margin: 0;
right: 150px;
color: white;
font-size: 80%;
text-align: center;
}
.tab ul.login li.left {
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgUrBH_mosl-mNy3oYGHi4MFdjYEJsfk_LzEM7LBU2ZbF6kLyPXnOHuvvOcR1KEeuTwonPluBoTCmjg9NgGygkmZRw-x8khCZJ2carQBmVIl6yhX21_EBeg1sg0dsE3cUOHx8c0rtxKbm9o/s1600/sliding-panel-tab-left.png) no-repeat left 0;
height: 42px;
width: 30px;
padding: 0;
margin: 0;
display: block;
float: left;
}
.tab ul.login li.right {
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhXbE3yyxqVMt4ErUxBl1eV33849mM7cfmCfW15B-1IfmltavKNjjpDLKHCizPTNJVhRRMNkakAK62FjHk64trh8O8MpYAyeR-IkkT4ztP2x_WJHBUqoTcvJluicXstc4zgWDCjE3A1rtrR/s1600/sliding-panel-tab-right.png) no-repeat left 0;
height: 42px;
width: 30px;
padding: 0;
margin: 0;
display: block;
float: left;
}
.tab ul.login li {
text-align: left;
padding: 0 6px;
display: block;
float: left;
height: 42px;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj48oflMo1L-veLUakA5R2tfozpPkFTWynW82fTrKf_Y5wjTfC7JzZVPYDnzHbJfUkcOf5Cq7it-PCeYHVT6iF5gztW5xu2OCJgakTUTvGwnMkOpZe8Zgip6-wed_LJnryo6bPuO7UEP4RL/s1600/sliding-panel-tab.png) repeat-x 0 0;
}

.tab ul.login li a {color: #15ADFF;}
.tab ul.login li a:hover {color: #FFFFFF;}
.tab .sep {color:#414141}

.tab a.open, .tab a.close {
height: 20px;
line-height: 20px !important;
padding-left: 30px !important;
cursor: pointer;
display: block;
width: 100px;
position: relative;
top: 11px;
}

.tab a.open {background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiYcMjSbBXEcjzMoSXegGV1wCRFh07Z9cpAI1GeooJAj3_8RZMeQ8PdER-LNXZ9kecXLyQPNMh7zhPPkH5fHXb3oEVAUejbh-JR4dhKSg0-IM7-l0eFAMUqZKc-KbzqOhqbt_qRw_zmh1d8/s1600/button-open.png) no-repeat left 0;}
.tab a.close {background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh4E7HM8t0F-EuRfDgYJ886WNHoTjQ0evvMmCPgpsQMnaCqwIPDNsl6bu5xNQViO0Z8skb1F4C1-h_gOIqR0kHP5P8QtTviXNm524y7lnd5RAgbxhXWrgOvn6rdxINWzsoRcl97Rpkp5Q9B/s1600/button-close.png) no-repeat left 0;}
.tab a:hover.open {background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiYcMjSbBXEcjzMoSXegGV1wCRFh07Z9cpAI1GeooJAj3_8RZMeQ8PdER-LNXZ9kecXLyQPNMh7zhPPkH5fHXb3oEVAUejbh-JR4dhKSg0-IM7-l0eFAMUqZKc-KbzqOhqbt_qRw_zmh1d8/s1600/button-open.png) no-repeat left -19px;}
.tab a:hover.close {background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh4E7HM8t0F-EuRfDgYJ886WNHoTjQ0evvMmCPgpsQMnaCqwIPDNsl6bu5xNQViO0Z8skb1F4C1-h_gOIqR0kHP5P8QtTviXNm524y7lnd5RAgbxhXWrgOvn6rdxINWzsoRcl97Rpkp5Q9B/s1600/button-close.png) no-repeat left -19px;}

#slide-top-panel {
position: absolute;
top: 0;
width: 100%;
z-index: 999;
text-align: center;
margin-left: auto;
margin-right: auto;
}
#panel {
width: 100%;
height: 230px;
color: #999999;
background: #272727;
overflow: hidden;
position: relative;
z-index: 3;
display: none;
}
#panel h4 {
font-size: 18px;
color: #F2F2F2;
text-align: center;
padding: 5px 0 10px;
margin: 0;
}
#panel p {
margin: 5px 0;
padding: 0px;
}
#panel a {
text-decoration: none;
color: #15ADFF;
}
#panel a:hover {
color: white;
}
#panel .content {
width: 960px;
margin: 0 auto;
padding-top: 15px;
text-align: left;
font-size: 0.85em;
}
#panel .content .left {
width: 280px;
float: left;
padding: 0 15px;
border-left: 1px solid #333;
}
#panel .content .right {
border-right: 1px solid #333;
}
#panel .content form {
margin: 0 0 10px 0;
}
#panel .content label {
float: left;
padding-top: 8px;
clear: both;
width: 280px;
display: block;
}
#panel .content input.field {
border: 1px #1A1A1A solid;
background: #545454;
border-radius: 10px;
margin-right: 5px;
margin-top: 4px;
width: 200px;
color: white;
height: 18px;
}
#panel .content input:focus.field {
background: #7F7F7F;
}
#panel .content input.button-register {
display: block;
clear: both;
height: 24px;
width: 94px;
color: white;
background: transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEinPfxfFOYninySNq9g8LI0IIYiHmiQmM4nLpKkhzHheg-T7KedFuJQFSom0kTw2MltW01KqKWQipbssrdBzuyByJ1NGiztl5uL8QQDc5VyWoGvWr70Vq9ldZWv1Dh2ZX39NK9VxRjU6t-U/s1600/button-register.png) no-repeat 0 0;
text-align: center;
cursor: pointer;
border: none;
font-weight: bold;
margin: 10px auto;
}
#sliding-panel {
width: 160px;
float: left;
}
#sliding-panel2 {
width: 160px;
float: right;
}
#sliding-panel ul, #sliding-panel2 ul{
font-family: Arial, Helvetica, sans-serif;
list-style-type:none;
margin:0;
padding:0;
}
#sliding-panel ul li a, #sliding-panel2 ul li a {
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiArFGuadzyTuaQTCZcpsV2Elabr1GV6IMdl2jAiVlMAwCdu2hCHQd4ePUcnw1Ff46O9fOBC6IPVMX5wEHXSgdMQ-pHrT-YBSAHuClrwJEDXp5PNx0QThJ8CiUo3Cq7xOuMZpc9eiWpJrJM/s1600/star-bullet.png) center left no-repeat;
margin:0;
padding:3px 3px 3px 18px;
}
#sliding-panel li, #sliding-panel2 li {
display: inline;
}
#sliding-panel a, #sliding-panel2 a{
color: #999999;
text-decoration: none;
font-size: 11px;
display: block;
padding: 3px;
width: 160px;
}
#sliding-panel a:link, #sliding-panel a:visited, #sliding-panel2 a:link, #sliding-panel2 a:visited {
color: #999999;
text-decoration: none;
}
#sliding-panel a:hover, #sliding-panel2 a:hover {
color: #FFFFFF;
}

#search-box22{
margin-top: 20px;
}

#search-box22 input[type="text"] {
float: right;
background: 10px 6px #444;
border: 0 none;
font: bold 12px Arial,Helvetica,Sans-serif;
color: #777;
width: 160px;
padding: 6px 15px 6px 35px;
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
border-radius: 20px;
text-shadow: 0 2px 2px rgba(0, 0, 0, 0.3);
-webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 3px rgba(0, 0, 0, 0.2) inset;
-moz-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 3px rgba(0, 0, 0, 0.2) inset;
box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 3px rgba(0, 0, 0, 0.2) inset;
-webkit-transition: all 0.7s ease 0s;
-moz-transition: all 0.7s ease 0s;
-o-transition: all 0.7s ease 0s;
transition: all 0.7s ease 0s;
}

#search-box22 input[type="text"]:focus {
width: 190px;
}

.about-author {
width: 100%;
text-transform: none;
margin-top: 15px;
}
.authorbox {
overflow: hidden;
padding: 0;
width: 100%;
}
.authorbox .authorinfo {
}
.authorbox .authorinfo img {
float: left;
margin: 4px 10px 4px 5px;
border-radius: 100%;
width: 20%;
background: #222;
padding: 5px;
}
.authorbox .authorinfo p {
margin: 0;
padding: 0 5px;
text-align: left;
}
.authorinfo p a {
text-decoration:none;
}
.authorbox h3 {
margin: 0;
display: inline-block;
}
h3.boxtitle {
font-size: 14px;
}
</style>

height: 230px; ဆိုတဲ.value ကိုအဆင္ေျပသလိုေျပာင္းလဲနိုင္ပါတယ္။


Step.6 ေနာက္ဆံုးအဆင္.အေနနဲ. Search box ထဲမွာ <body> ဆိုတဲ.ကုဒ္ေလးရိုက္ျပီးထပ္ရွာပါ။
           (www.blogger.com က Free ေပးတဲ. Awsome Inc./Water Mark အစရွိတဲ. Template ေတြမွာ
           အဲဒီ <body> ဆိုတဲ.ကုဒ္ေလးရွာေတြ.မွာမဟုတ္ပါဘူး။အဲဒီ Template ေတြမွာေအာက္ကကုဒ္
           ေလးကိုရိုက္ပီးရွာပါ)

<body expr:class='&quot;loading&quot; + data:blog.mobileClass'>
ေတြ.ပီဆိုရင္ေအာက္ကေပးထားတဲ.ကုဒ္ေတြကိုေကာ္ပီကူးယူျပီးအဲဒီ <body> သို.မဟုတ္
<body expr:class='&quot;loading&quot; + data:blog.mobileClass'> ဆိုတဲ.ကုဒ္ေတြရဲ.ေအာက္မွာ
Paste ခ်လိုက္ပါ ။

<!-- Start sliding panel -->
<div id='slide-top-panel'>
<div id='panel'>
<div class='content clearfix'>

<!-- first section -->
<div class='left' style='width:240px !important'>

<h4>Welcome to my blog!</h4>
<div class='about-author'>
<div class='authorbox'>
  <div class='authorinfo'>
<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi6wcYNqY01d-K2bWmsQhcfZV_vPq6r4nwWgqLkt0YwL_2vIkUCiUBIQnQuBIWOhe2Npky_Iuk3szdpNeORgSg0P4zx57-VV6Ky-Dq0vjvURQ5UL_9UoXdTq2Vekro19ZmaOPZcbiBb0-tK/s1600/profile-pic.png'/>
<h3 class='boxtitle'>Meet the Author</h3>
<p>Ut eleifend tortor aliquet, fringilla nunc non, consectetur magna. Suspendisse potenti.</p>
</div>
</div>
</div>
<p align="right" style="margin-top: 10px;">Looking for something?</p>
<form method="get" action="/search" id="search-box22">
  <input name="q" type="text" size="40" placeholder="Search..." />
</form>

</div>

<!-- second section -->
<div class='left' style='width:320px !important'>
<h4>Categories</h4>

<div id='sliding-panel'>
<ul>
<li><a href='Link URL'>Category 1</a></li>
<li><a href='Link URL'>Category 2</a></li>
<li><a href='Link URL'>Category 3</a></li>
<li><a href='Link URL'>Category 4</a></li>
<li><a href='Link URL'>Category 5</a></li>
<li><a href='Link URL'>Category 6</a></li>
<li><a href='Link URL'>Category 7</a></li>
</ul>
</div>

<div id='sliding-panel2'>
<ul>
<li><a href='Link URL'>Category 1</a></li>
<li><a href='Link URL'>Category 2</a></li>
<li><a href='Link URL'>Category 3</a></li>
<li><a href='Link URL'>Category 4</a></li>
<li><a href='Link URL'>Category 5</a></li>
<li><a href='Link URL'>Category 6</a></li>
<li><a href='Link URL'>Category 7</a></li>
</ul>
</div>
</div>

<!-- third section -->
<div class='left right' align="center">

<h4>Subscribe to this blog!</h4>
<p style="padding:0px 30px;">Receive the latest posts by email. Just enter your email below if you want to subscribe!</p>

<form action='http://feedburner.google.com/fb/a/mailverify?uri=Feed-Name' method='post' target='_blank'>
<input class='field' name='email' type='text/' value=''/>
<input name='uri' type='hidden' value='Feed-Name'/>
<input name='lang' type='hidden' value='en_EN'/>
<input class='button-register' type='submit' value='Subscribe'/></form>

<div align='center' style="clear: both;">
<a href='http://www.facebook.com/username'><img title="Follow on Facebook" src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgbdGOmtrSJYzjgFLHkeeNFnqE9_r2DSSRMxU7rgK2me3Dz8SmcLmoVWUe4Nyo1Lyz9Q6UjvPnOoMofSQpvDp1HWop120Wg5ohx7qgWE_qSuqmfYe7uM6g8g_Q5zEL1ddd7tQn3dPEffbCl/s1600/Facebook.png' style='padding:5px;' width='32'/></a>
<a href='http://blog-address.blogspot.com/atom.xml'><img title="RSS Feed" src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhfsOOCZjX9BnreXnO8RcaEYP24sNEH6CwEZDpRRd0eDDsyrejiLWMtXMzcNiX3w1U-gBLEVpp6m36eTSdL9aExL-yg4WbvDK0pCixD2GZzwYNLKTYfFkn8iZsA95kl3DAOI1uGkwMyb2_i/s1600/RSS.png' style='padding:5px;' width='32'/></a>
<a href='https://plus.google.com/username'><img title="Follow on Google" src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgZlxmr-z69M7LbMDLqpRweGPQyB1HMJA-vXBsNRoPJyuPnoeYRUY3ame65Gr9GqrnlgtB6NMtvmBXNiG_S-Owu5XZG3ymEdJxLvE5iD3eR_87_oID8ZjXDguCs9wn6A__y6vT4V0WHx_ZI/s1600/Google-plus.png' style='padding:5px;' width='32'/></a>
<a href='http://twitter.com/username'><img title="Follow on Twitter" src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiXQcjrdVYTq8UPd6sjby0dCi6asKbiR4Csp017d41lLeBvrZpy1XEppULC76A3iEa3uQL6JfE4_d5CrxqOurmF9pqdq4J1BMthuA9I8pzEn3RJPDGrzuzNskfN4Bdz7J2OYZpqo4nunJsl/s1600/Twitter.png' style='padding:5px;' width='32'/></a>
</div>

</div>
</div>
</div>

<div class='tab'>
<ul class='login'>
<li class='left'/>
<li>Hello guest!</li>
<li class='sep'>|</li>
<li id='toggle'>
<a class='open' href='#' id='open'>Open menu</a>
<a class='close' href='#' id='close' style='display: none;'>Close menu</a>
</li>
<li class='right'/>
</ul>
</div>
</div>


<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi6wcYNqY01d-K2bWmsQhcfZV_vPq6r4nwWgqLkt0YwL_2vIkUCiUBIQnQuBIWOhe2Npky_Iuk3szdpNeORgSg0P4zx57-VV6Ky-Dq0vjvURQ5UL_9UoXdTq2Vekro19ZmaOPZcbiBb0-tK/s1600/profile-pic.png'/> ဒီေနရာမွာကိုယ္.ရဲ. Author Profile ပံုလင္.ခ္နဲ.အစားထိုးေပးပါ။ က်န္တဲ.
High Light ျပထားတဲ.ေနရာေတြမွာလဲကိုယ္ပိုင္လင္.ေတြနဲ.အစားထိုးေပးပါ။သေဘာေပါက္အဆင္ေျပ
ႀကမယ္လို.ယံုႀကည္ပါတယ္။

ဘေလာ.မွာ Cool JavaScript Image Slider ေလးထည္.ခ်င္ရင္

ဘေလာ.မွာ Image Slider ေလးထည္.ခ်င္တဲ.ေဘာ္ဒါေတြအတြက္ေတြ.မိသမွ်ထဲကသေဘာက် တာေလးတစ္ခုျပန္လည္မွ်ေ၀လိုက္ပါတယ္။ေႀကျငာထည္.ခ်င္တဲ.ဘေလာ.ေတြအတြက္လဲ အဆင္ေျပမွာပါ။ ေႀကာ္ျငာေတြကို Slider ေလးနဲ.ျပထားေတာ. Visitor ေတြအတြက္လဲစိတ္၀င္စားမွဳ.ပိုတာေပါ။ဆႏၵရိွရင္ေတာ. ေအာက္ကအတိုင္းပဲဆက္လုပ္လိုက္ပါ။

1. Blogger Dashboard ကိုသြားပါ
2. Lay out ကိုကလစ္ပါ
3. Add a Gadget ကိုနွိပ္ပါ
4. HTML/Java Script ကိုနွိပ္ပီးေအာက္ကကုဒ္ေတြကိုေကာ္ပီကူးထည္.ေပးပါ

<style type="text/css">
 /* JavaScript Image Slider By http://www.santosh143.com/ */
#mcis {
 display: none;
}

#sliderFrame {
 position: relative;
 width: 500px;
 margin: 0 auto;
        border:5px solid #000;
}

#ribbon {
 width: 111px;
 height: 111px;
 position: absolute;
 top: -4px;
 left: -4px;
 background: url

(http://3.bp.blogspot.com/-h24njw0GVSg/UK6uVqF8G8I/AAAAAAAAVME/

jxT_9Ldj428/s1600/santosh143.com-ribbon.png)

 no-repeat;
 z-index: 7;
}

#slider {
 width: 500px;
 height: 218px;
 background: #fff url

(http://3.bp.blogspot.com/-

L1keIWvnKK0/UK6uWQsdqTI/AAAAAAAAVMQ/M-Xqyt5LopU/s1600/

santosh143.com-loading.gif) no-repeat 50% 50%;
 position: relative;
 margin: 0 auto;
 box-shadow: 0px 1px 5px #999999;
}

#slider img {
 position: absolute;
 border: none;
 display: none;
}

#slider a.imgLink {
 z-index: 2;
 display: none;
 position: absolute;
 top: 0px;
 left: 0px;
 border: 0;
 padding: 0;
 margin: 0;
 width: 100%;
 height: 100%;
}

div.mc-caption-bg, div.mc-caption-bg2 {
 position: absolute;
 width: 100%;
 height: auto;
 padding: 0;
 left: 0px;
 bottom: 0px;
 z-index: 3;
 overflow: hidden;
 font-size: 0;
}

div.mc-caption-bg {
 background-color: black;
}

div.mc-caption {
 font: bold 14px/20px Arial;
 color: #EEE;
 z-index: 4;
 padding: 10px 0;
 text-align: center;
}

div.mc-caption a {
 color: #FB0;
}

div.mc-caption a:hover {
 color: #DA0;
}

div.navBulletsWrapper {
 top: 250px;
 left: 190px;
 width: 150px;
 background: none;
 padding-left: 20px;
 position: relative;
 z-index: 5;
 cursor: pointer;
}

div.navBulletsWrapper div {
 width: 11px;
 height: 11px;
 background: transparent 

url(http://4.bp.blogspot.com/-HjlC19G85kE/

UK6uXI1zSOI/AAAAAAAAVMc/xE_EJOjwdcc/s1600/santosh143.com-bullet.png)

 no-repeat 0 0;
 float: left;
 overflow: hidden;
 vertical-align: middle;
 cursor: pointer;
 margin-right: 11px;
 _position: relative;
}

div.navBulletsWrapper div.active {
 background-position: 0 -11px;
}


#slider {
 transform: translate3d(0,0,0);
 -ms-transform: translate3d(0,0,0);
 -moz-transform: translate3d(0,0,0);
 -o-transform: translate3d(0,0,0);
 -webkit-transform: translate3d(0,0,0);
}

 </style>

<script src="http://santosh143.googlecode.com/svn/slider.js" 

type="text/javascript"></script>

<div id="sliderFrame">
     <div id="ribbon"></div>
            <div id="slider">


<a href="#"><img src="Image Url1" alt="ImageDescription"/></a>

<a href="#"><img src="Image Url 2" alt="ImageDescription"/></a>

<a href="#"><img src="Image Url 3" alt="ImageDescription"/></a>

<a href="#"><img src="Image Url 4" alt=ImageDescription""/></a>

<a href="#"><img src="Image Url5" alt="ImageDescription"/></a>

 </div></div>

 width: 500px;
 height: 218px;

width နဲ.height ေနရေတြမွာကိုယ္.ရဲ.Template width နဲ.အဆင္ေျပေအာင္ေျပာင္းလဲနိုင္ပါတယ္

http://image url

image url ေနရာမွာကိုယ္ထည္.ခ်င္တဲ.ပံု လင္.ကိုထည္.ေပးပါ

Image description

ပံုမွာကိုယ္ေဖၚျပခ်င္တဲ.စာသားကိုေရးပါ

#

ပံုကိုနွိပ္လိုက္ရင္ကိုယ္သြားေစခ်င္တဲ.လင္.ခ္ကိုထည္.ေပးပါ

Blogger Template မွာ Admin Control Panel ေလးထည္.ႀကမယ္

ဒါေလးကေတာ Blogger Template ကေန မိမိဘေလာ.ဂါအေကာင္.ကိုျပန္၀င္စရာမလိုပဲ တစ္ေနရာထဲကေနအားလံုးကိုအလြယ္တစ္ကူ ၀င္ေရာက္နိုင္မဲ.နည္းလမ္းေလးပါ ဒီ Admin Control Panel ကိုမိမိဘေလာ.Home page ရဲ.ထိပ္မွာ Menu ပံုစံ နဲ.ေတြ.ရမွာျဖစ္ပီးဘေလာ.ရဲ.Admin ေတြသာလွ်င္ေတြ.ျမင္နိုင္ပီး Visitor ေတြအေနနဲ.ေတြ.ရမွာမဟုတ္ပါဘူးAdmin ေတြအေနနဲ.လဲ  ဘေလာ.ဂါအေကာင္.Sign out လုပ္ထားပီးဘေလာ.ကို၀င္ႀကည္. မယ္ဆိုရင္မေတြ.ျမင္နိုင္ပါဘူး..ဒီ Admin Control Panel Menu  မွာဘာေတြပါပီးဘာေတြလုပ္နိုင္လဲဆိုေတာ.

• access to the Blogger's Homepage
•  create a New Page or Post
• view all your posts
• read your comments
• access the Blog's layout to add or rearrange gadgets
• edit the HTML of your Template
•  refresh current page or post
•  open a new tab with your blog's homepage
•  access the blog' settings
•  view your stats
• and finally, log out

Admin Control Panel Menu ကိုဘေလာ.ဂါ Template မွာဘယ္လိုထည္.မလဲ
ဒီAdmin Control Panel Menu ကိုဘေလာ.ဂါ Template မွာထည္.ဖို. သင္.ရဲ.ဘေလာ. ID ကိုသိဖို.လိုပါတယ္..  ဘေလာ. ID ကိုဘယ္လိုရွာရမလဲ....?  Sign in Blogger > Dashboard ကို၀င္လိုက္ပါ ေအာက္ကပံုမွာျပထားတဲ.Address bar ေပၚက ဂဏန္းေလးေတြဟာကိုယ္.ဘေလာ. ID ပါ အဲဒီဂဏန္းေလးေတြကိုေကာ္ပီကူးထားပါ

• Blogger Template ကိုသြားပါ
• Edit HTML ကိုကလစ္ပါ
• Ctrl + F ကုိနွိပ္ပီး Search box ထဲမွာေအာက္ကကုဒ္ေလးေတြရိုက္ပီးရွာပါ

<body expr:class='&quot;loading&quot; + data:blog.mobileClass'>
bloggerTemplateတစ္ခုနွင္.တစ္ခုမတူတတ္ပါဘူး..
အဲဒီကုဒ္ေလးေတြရွာမေတြ.ခဲရင္ေအာက္ကကုဒ္ေလးထပ္ရွာပါ
<body>
ေတြ.ပီဆိုရင္ေအာက္မွာေပးထားတဲ.ကုဒ္ေတြကိုေကာ္ပီကူးပီးခုနကရွာထားတဲ. ကုဒ္ေတြရဲ.ေအာက္မွာ Paste လုပ္လိုက္ပါ <span class='item-control blog-admin'>
<style>
.control-panel ul{z-index: 20; position: absolute; margin: 0px auto; background-color: #F6F6F6; width: 100%; }
.control-panel ul li{display: inline-block; float: left; padding: 7px 0px;}
.control-panel ul li a {color:#686868;padding: 7px 15px;border-right: 1px solid #E3E3E3;font-weight: bold;font-size: 13px;}
.control-panel a:hover {text-decoration:none; color:#FC8F44;}
</style>
<div class='control-panel'>
<ul>
<li><a href='http://www.blogger.com/home'>My Blogs</a></li>
<li><a href='http://www.blogger.com/blogger.g?blogID=XXXXXXXXXXXXX#editor/src=sidebar'>New Post</a></li>
<li><a href='http://www.blogger.com/blogger.g?blogID=XXXXXXXXXXXXX#editor/target=page'>New Page</a></li>
<li><a href='http://www.blogger.com/blogger.g?blogID=XXXXXXXXXXXXX#posts'>All Posts</a></li>
<li><a href='http://www.blogger.com/blogger.g?blogID=XXXXXXXXXXXXX#comments'>Comments</a></li>
<li><a href='http://www.blogger.com/blogger.g?blogID=XXXXXXXXXXXXX#pageelements'>Layout</a></li>
<li><a href='http://www.blogger.com/blogger.g?blogID=XXXXXXXXXXXXX#templatehtml'>Edit HTML</a></li>
<li><a href='#' onclick='location.reload(true); return false;'>Refresh</a></li>
<li><a href='/' target='_blank'>New Tab</a></li>
<li><a href='http://www.blogger.com/blogger.g?blogID=XXXXXXXXXXXXX#basicsettings'>Settings</a></li>
<li><a href='http://www.blogger.com/blogger.g?blogID=XXXXXXXXXXXXX#overviewstats'>Stats</a></li>
<li><a href='http://www.blogger.com/logout.g'>Logout</a></li>
</ul>
</div>
</span>

XXXXXXXXXXXXX  ဒီေနရာေတြမွာကိုယ္.ရဲ.ဘေလာ. ID ကိုထည္.ေပးပါ  Template ကို Save လုပ္လို.ရပါျပီ..အဆင္ေျပမယ္လို.ေမွ်ာ္လင္.ပါတယ္...

Blog ပို.စ္ေတြေအာက္က Subscribe to: Posts(Atom) ဆိုတာေလးျဖဳတ္ခ်င္ရင္

 

ဘေလာ.ပို.စ္ေတြေအာက္က Subscribe to: Posts(Atom) ဆိုတာေလးျဖဳတ္ခ်င္တဲ.သူေတြအတြက္ပါ

1. Blogger Dashboard ကိုသြားပါ
2. Template ကိုနွိပ္ပါ
3. Edit HTML ကိုကလစ္ပါ
4. Ctrl +F ကိုနွိပ္ပီး Search Box ထဲမွာေအာက္ကကုဒ္ေလးရိုက္ပီးရွာပါ

<b:include name='feedLinks'/> 

ပီးရင္အဲဒီကုဒ္ေလးကို Delete လုပ္လိုက္ပါ
Template ကို Save လုပ္လိုက္ပါ။

Css ကုဒ္သံုးျပီး hide လုပ္နည္းေနာက္တစ္နည္း

1. Blogger Dashboard ကိုသြားပါ
2. Template ကိုနွိပ္ပါ
3. Edit HTML ကိုကလစ္ပါ
4. Ctrl +F ကိုနွိပ္ပီး Search Box ထဲမွာေအာက္ကကုဒ္ေလးရိုက္ပီးရွာပါ

]]></b:skin>
အဲဒီကုဒ္ေလးရဲ.အေပၚမွာေအာက္ကကုဒ္ေတြေကာ္ပီကူးပီးထည္.ေပးလိုက္ပါ

.blog-feeds{display:none !important;}

Template ကို Save လို.ရပါျပီ..

ကိုယ္.ရဲ.ဘေလာ.ေလးကို Google Blog Search မွာအလြယ္တစ္ကူရွာေဖြနိုင္ေအာင္ Submit လုပ္မယ္

သင္ဟာဘေလာ.ဂါတစ္ေယာက္ျဖစ္ခဲ.မယ္ဆိုရင္ သင္.ရဲ.ဘေလာ.ေလးကို  Google Blog Search မွာအလြယ္တစ္ကူရွာေဖြနိုင္ဖို.Blog ကို Submit လုပ္သင္.တာေပါ.ေနာ္.. ဒီနည္းလမ္းေလးကေတာ.လြယ္ကူရိုးရွင္းပါတယ္ ..ကိုင္း..အခုပဲ ဒီလင္ခ္. ေလးကိုသြားလိုက္ပါ..

ကိုယ္.ဘေလာ.လိပ္စာ URL ျဖည္.ေပးပါ..ျပီးရင္ Submit Blog ဆိုတဲ.Button ေလးကိုနွိပ္လိုက္ပါ..

Blog ကို Submit လုပ္လို.ေတာ.ျပီးသြားပါျပီ..  Google Search Engine မွာစမ္းျပီးရွာႀကည္.ခ်င္တယ္ဆိုရင္ေတာ.  Go to Blog Search ဆိုတာေလးကိုနွိပ္ပါ..

ကိုယ္.ဘေလာ.လိပ္စာေလးရိုက္ထည္.ပီးရွာႀကည္.ပါ..