kp3နည္းပညာ၊၂၅၆၊Mozilla Firefox ရဲ ့Tabs ေတြ ကိုေရာင္စံုနဲ ့ေပၚေစခ်င္ရင္

အခုတင္တဲ့ Post ေလးကေတာ့က်ေနာ္လို Mozilla -Firefox ကိုစြဲြစြဲျမဲျမဲသံုးတဲ့ဘေလာ့မိတ္ေဆြေတြအတြက္ပါ။ က်ေနာ္တို႕ Tabs ေတြကိုၾကည့္လို ့လည္းလွသလို Firefox ကလည္းပ်င္းစရာလည္းမေကာင္း ေတာ့ဘူးေပါ့ေနာ္။ သိျပီးသားမိတ္ေဆြေတလည္းမ်ားမယ္ထင္ပါတယ္။မသိေသးတဲ့ဘေလာ့မိတ္ေဆြေတြနဲ ့Mozilla-Firefox ခ်စ္ တဲ့ သူ ေတြ အတြက္ပါ။ ေအာက္မွာပံုနဲ ့တကြ Download လင့္ခ္


ဒီမွာ သြားယူလိုက္ပါ။ Download လုပ္လုိက္ပါ။

မသိေသးတဲ႔မိတ္ေဆြေတြကိုအသိေပးမ်ွေဝေစခ်င္ပါတယ္၊
ေလာ့ဂါမိတ္ေဆြအားလံုးကိုအစဥ္ျမဲခ်စ္ခင္ေလးစားလၽွက္ kp3မိသားစု 

kp3နည္းပညာ၊၂၅၅၊ဘေလာ့မွာ Subscribe Section ကိုလွလွေလးထည့္နည္း (၁)

အခုတင္မယ့္ Post ေလးကေတာ့အခုတေလာအလုပ္ေတြေၾကာင့္အသစ္ေတြမတင္ျဖစ္လို႕ ဘေလာ့ မိတ္ေဆြ ေတြအတြက္ Subscribe Sectionလွလွေလးတခုထပ္တင္ေပးလိုက္ပါတယ္။ ဒီ Subscribe Section က အခုတင္ တာနဲ႕ဆိုရင္ႏွစ္မ်ိဳးရွိျပီေပါ့ေနာ္။ေအာက္မွာပံုနဲ႕တကြျပထားပါတယ္။ပထမတင္ ထားဒါေလးကေတာ့ kp-3နည္းပညာ၊၁၇၃၊  မွာရွိပါတယ္။ပထမနဲ႕ဒုတိယကြာျခားခ်က္ကေတာ့ ပထမမွာ HTML Code ကိုထည့္ရ တယ္၊ အခုဟာကေတာ့ CSS Code ထဲကိုထည့္ရတယ္ထာပါဘဲ။ ႏွစ္ခုစလံုးကေတာ့အတူတူပါဘဲ။


ပထမရဲ႕ DEMO ကိုဒီမွာသြားၾကည့္လို႕ရပါတယ္။

အခုတင္တဲ့ DEMO ကေတာ့ဒီမွာသြားၾကည့္လိုက္ပါ။

ပထမအဆင့္>>>

၁။Dashboard

၂။Layout

၃။Edit HTML

ေအာက္က Code ကိုရွာပါ၊
]]></b:skin>
ေတြ႕ျပီဆိုရင္အေပၚမွာေအာက္က Code ကိုထည့္လိုက္ပါ။
#subscribe{list-style:none; margin:0px}
#subscribe li{padding:10px 5px; position:relative; margin-top:0; margin-right:0; margin-bottom:5px; margin-left:0; height:64px; opacity:0.75; -moz-opacity:0.75}
#subscribe li:hover{ background-color:#f4f4f4; -moz-border-radius:5px; -webkit-border-radius:5px; border-radius:5px; -khtml-border-radius:5px; opacity:1; -moz-opacity:1; -webkit-transition:opacity 1s ease-out}
#subscribe li img{float:left; position:relative; padding:0px; margin:0px 10px 0px 0px}
#subscribe li h4{margin:-6px 0 3px 83px; font-size:15px; line-height:26px; color:#23a69d; text-shadow:1px 1px 0px #fff; font-family:Helvetica,Arial,sans-serif; font-weight:bold; clear:none}
#subscribe li p{margin:0 0 0 0; font-family:Trebuchet MS,sans-serif; font-size:13px; letter-spacing:-0.02em; clear:none; text-indent:0px}
#subscribe li a.linkblock{background:none; border:none; top:0; left:0; right:0; bottom:0; width:100%; height:100%; position:absolute; z-index:50}
၄။Save Template ကိုႏိုပ္ပါ။မျပီးေသးပါဘူးေနာက္တဆင့္က်န္ပါေသးတယ္ေအာက္မွာ>>>>

ဒုတိယအဆင့္>>>

၁။Layout

၂။Page Element

၃။Add a gadget သြားမယ္၊ေအာက္က

၄။Html/java script မွာေအာက္က Code ကိုထည့္လိုက္ပါ။
<ul id="subscribe">
<li>
<a class="linkblock" href="မိမိရဲ ့-FEED-URLကိုဒီမွာထည့္ေပးလိုက္ပါ"></a>
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhNkSqnDqQ_8t1bbfc6vtsooZvAP586APaf6qUO5WjbUeM_W578eOCeF5zLwK05esOBLO6Cf25XUixqfnz6WL_DkWDqM1jJZgoKbmXBu9ck6ogDqbo8y1eX3GMxynL_MERa4DiL5CyZG7so/" alt="RSS Feed" />
<h4>RSS Feed</h4>
<p>Subscribe To RSS Feed</p>
</li>
<li>
<a class="linkblock" href="မိမိရဲ ့-EMAIl-FEED-URLကိုဒီမွာထည့္ေပးလိုက္ပါ"></a>
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjgcKt0_-Qf03clxNQ0hE4OvQAdLvnCpOIhuKvy5z12vkpj2_5di4iUZ7ey1CFuGP-5UfiWAai_93QE96L5SJH9IrWrfbxtIuY_nQYUATUF720oaSJxHEE2cV3VH7doY_i8XZGkgrlCETU6/" alt="E-Mail Delivery" />
<h4>E-Mail Delivery</h4>
<p>Subscribe To Email</p>
</li>
<li>
<a class="linkblock" href="မိမိရဲ ့-TWITTER-URLကိုဒီမွာထည့္ေပးလိုက္ပါ" title="Follow us on Twitter"></a>
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgSb0ufllyTDvoUcgiRvfPlO4LW9o8cdMueWUGaDifY_yZZ6o2eTe-3_Kyg47zVBMRAlqsi2cstclpnhLqliZbnGEDjFlzfNywa7WtpBEXh5gaQE77a1bzkRLsDY6mHygn9W8s-eDHDOy5J/" alt="E-Mail Delivery" />
<h4>Twitter</h4>
<p>Follow Us On Twitter.</p>
</li>
</ul>
၅။Save ကိုႏိုပ္လိုက္ပါ။ျပီးပါျပီ။။

မသိေသးတဲ႔မိတ္ေဆြေတြကိုအသိေပးမ်ွေဝေစခ်င္ပါတယ္၊
ဘေလာ့ဂါမိတ္ေဆြအားလံုးကိုအစဥ္ျမဲခ်စ္ခင္ေလးစားလၽွက္ kp3မိသားစု
...Your html-escaped code goes here...

YOUR CODE HERE

kp3နည္းပညာ၊၂၅၄၊ဘေလာ့မွာလြယ္ကူတဲ ့KP-3ရဲ ့Horizontal CSS menu ေလးထည့္နည္း

ေနာက္ပိုင္းMenu ေတြကိုဘဲတင္ေတာ့မယ္လို ့စိတ္ကူးတဲ့အခ်ိန္မွာလဲ အီးေမးလ္ကေနဟိုဟာေတာင္းဆိုဒါ ေတာင္းဆိုနဲ ့ဒါေၾကာင့္ဘာမွမတင္လိုက္မိဘူး။ ဒါေပမယ့္ Kp-3 မိသားစုရဲ ့စိတ္တိုင္းက်လုပ္ထားတဲ့ Menu ေတာ္ေတာ္မ်ားမ်ားလည္းတင္ျပီးသားရွိပါတယ္။အခုတင္တဲ့ဟာေလးကေတာ့Horizontal CSS menu လို ့ေခၚ ပါတယ္ေအာက္မွာသြားၾကည့္လို ့ရေအာင္လည္း DEMO လင့္ခ္ေလးေပးထားပါတယ္။ ဘေလာ့ဂါမိတ္ေဆြအားလံုးကိုအဆင္ျမဲံခ်စ္ခင္ေလးစားလ်ွက္ kp-3မိသားစု

ဒီမွာသြားၾကည့္လိုက္ပါ။

၁။ Layout

၂။Edit HTML

ေအာက္က Code ကိုရွာပါ။
]]></b:skin>
ေတြ ့ျပီဆို၇င္အေပၚမွာေအာက္က Css Code ကိုထည့္ေပးလိုက္ပါ။
#nav
{
padding:0;
}

#nav li
{
display:inline;
}

#nav li a
{
font-family:Arial;
font-size:12px;
text-decoration: none;
float:left;
padding:10px;
background-color: #333333;
color:#ffffff;
border-bottom:1px;
border-bottom-color:#000000;
border-bottom-style:solid;
}


#nav li a:hover
{
background-color:#9B1C26;
padding-bottom:12px;
border-bottom:2px;
border-bottom-color:#000000;
border-bottom-style:solid;
margin:-1px;
}
၃။Save Template ေအာက္က Code Layout>>>Add a Gadget>>>HTML/JavaScript Add ထည့္ေပးလိုက္ပါ။
<ul id="nav">
<li><a href="http://kp3family.blogspot.com#">kp3မိသားစု</a></li>
<li><a href="http://kp3family.blogspot.com#">ဆက္သြယ္ရန္</a></li>
<li><a href="http://kp3family.blogspot.com#">နည္းပညာ</a></li>
<li><a href="http://kp3family.blogspot.com#">သတင္း</a></li>
<li><a href="http://kp3family.blogspot.com#">သီခ်င္းမ်ား<</a></li>
<li><a href="http://kp3family.blogspot.com#">အားကစား</a></li>
<li><a href="http://kp3family.blogspot.com#">အလုပ္အကိုင္</a></li>
</ul>
၄။Save ႏိုပ္လိုက္ပါ။ျပီးပါျပီ။ ။

မွတ္ခ်က္။ ။kp3family ႏွင့္ kp3လင့္ခ္ေတြကိုမိမိရဲ ့လင့္ခ္ေတြနဲ ့အစားထိုးေပးလိုက္ပါ။

မသိေသးတဲ႔မိတ္ေဆြေတြကိုအသိေပးမ်ွေဝေစခ်င္ပါတယ္၊
ဘေလာ့ဂါမိတ္ေဆြအားလံုးကိုအစဥ္ျမဲခ်စ္ခင္ေလးစားလၽွက္ kp3မိသားစု

kp3နည္းပညာ၊၂၅၃၊ဘေလာ့မွာအၿဖဴေရာင္သံစဥ္ေရဒီယို ထည့္ေလးထားခ်င္နည္း

အသစ္ေတြမတင္ျဖစ္တဲ့ေတာ္ေတာ္ၾကာေနပါျပီအ၇မ္းကိုအလုပ္ရွုပ္လို ့ပါနားလည္းေပးၾကမယ္လို ့ေမ်ာ္ လင့္ ပါတယ္။ အခ်ိန္မရတဲ့ၾကာထဲမွာCbox မွာေတာင္းဆိုထားတဲ့ အၿဖဴေရာင္သံစဥ္ေရဒီယိုထည့္နည္း ေလးနဲ ့ Code ကို Post အျဖစ္တင္လိုက္တာပါမတင္ေပးရင္စိတ္ေကာက္သြားမွာဆိုးလို ့ပါ။မအားတဲ့အေၾကာင္းရင္က ေတာ့မိတ္ေဆြ တစ္ေယာက္က Website လို ့ဖို ့ကမ္းလွန္းထားလို ့ပါ။ ဘေလာ့မိတ္ေဆြအားလံုးကိုအျမဲတမ္း အသစ္ဆန္းေလးေတြကိုၾကည့္ေစခ်င္တဲ့ Kp-3 မိသားစု

၁။Layout

၂။Page Element

၃။Add a gadget သြားမယ္၊ေအာက္က

၄။Html/java script မွာေအာက္က Code ကိုထည့္လိုက္ပါ။
<span class="smallfont"><strong></strong></span>





<div class="widget-content">
<a href="http://89.238.146.148/APYTZ" target="_blank"><img border="0" width="160" src="http://www.apytz.net/images/listenradio1.gif" height="82"/></a>
<script type="text/javascript"><br/><br/> <!-- function song(){ document.getElementById('music1').innerHTML="<embed type="'application/x-mplayer2'" id="'music2'" pluginspage="'http://www.microsoft.com/Windows/MediaPlayer/'" src="'" name="'MediaPlayer1'" width="'185'" height="'50'" controltype="'2'" showcontrols="'1'" showstatusbar="'1'" autostart="'false'"></embed>";<br /> }<br /> //--><br/> </script>
<div id="jukebox">
<span id="music1"><embed pluginspage="http://www.microsoft.com/Windows/MediaPlayer/" controltype="2" autostart="1" showstatusbar="1" type="application/x-mplayer2" height="50" src="http://wma2.viastreaming.net/APYTZ" id="music1" width="160" showcontrols="1" name="MediaPlayer1"></embed>
</span></div></div>
၅။Save ႏိုပ္လိုက္ပါ။ျပီးပါျပီ။။။။

မသိေသးတဲ႔မိတ္ေဆြေတြကိုအသိေပးမ်ွေဝေစခ်င္ပါတယ္၊
ဘေလာ့ဂါမိတ္ေဆြအားလံုးကိုအစဥ္ျမဲခ်စ္ခင္ေလးစားလၽွက္ kp3မိသားစု
...Your html-escaped code goes here...

YOUR CODE HERE

kp3နည္းပညာ၊၂၅၂၊ဘေလာ့မွာ Comments ေပးတဲ့သူနာမည္ေဘး မွာ Reply Comment ဆုိျပီးစားသားေလးထားနည္း

အခုတင္တဲ့ Post ေလးကေတာ့ဘေလာ့ဂါေလာကမွာအသစ္ေလးလို ့ေျပာရင္လည္းမွားမယ္မထင္ပါဘူး၊ က်ေနာ္တို ့ကိုComments လာေပးတဲ့မိတ္ေဆြေတြကိုျပန္ျပီ Reply လုပ္ခ်င္တဲ့ဘေလာ့မိတ္ေဆြ ေတြအတြက္ ပါ။ေအာက္မွာပံု နဲ ့တကြ Code ေပးထားပါတယ္ဘေလာ့ဂါ မိတ္ေဆြအားလံုးကိုခင္မင္ေလးစားလွ်က္ KP-3 မိသားစု

 ၁။Layout

၂။Edit Html

၃။Expand Widget Templatesမွန္ျခစ္လိုက္ပါ။

ေအာက္ကCode ကိုရွာပါ၊(Ctrl+F)
<data:commentPostedByMsg/>
ေတြ႕ျပီဆိုရင္ေအာက္မွာေအာက္က Code ကိုထည့္ေပးလိုက္ပါ။။
<span class='comment-reply'><a expr:href='&quot;https://www.blogger.com/comment.g?blogID=ဤေနရာမွာမိမိရဲ ့ဘေလာ့ ID ထည့္ေပးပါ&amp;postID=&quot; + data:post.id + &quot;&amp;isPopup=true&amp;postBody=%40%3C%61%20%68%72%65%66%3D%22%23&quot; + data:comment.anchorName + &quot;%22%3E&quot; + data:comment.author + &quot;%3C%2F%61%3E#form&quot;' onclick='javascript:window.open(this.href, &quot;bloggerPopup&quot;, &quot;toolbar=0,location=0,statusbar=1,menubar=0,scrollbars=yes,width=400,height=450&quot;); return false;'>[Reply to comment]</a></span>
၄။Save Template ကိုႏိုပ္ပါ။ျပီးပါျပီ။။

မွတ္ခ်က္။ ။ဘေလာ့ ID ကေအာက္မွာပံုနဲ ့တကြျပထားေပးပါတယ္။[Reply to comment]ေနရာမွာမိမိၾကိဳက္သ လိုျမန္မာလို ေရးလို ့လည္းရပါတယ္။

မသိေသးတဲ႔မိတ္ေဆြေတြကိုအသိေပးမ်ွေဝေစခ်င္ပါတယ္၊
ဘေလာ့ဂါမိတ္ေဆြအားလံုးကိုအစဥ္ျမဲခ်စ္ခင္ေလးစားလၽွက္ kp3မိသားစု
...Your html-escaped code goes here...

YOUR CODE HERE

kp3နည္းပညာ၊၂၅၁၊ဘေလာ့မွာ KP-3 ရဲ႕ Horizontal Menu အသစ္ေလးသံုးခ်င္၇င္

အခုတင္တဲ့ Post ေလးကကေတာ့ဘေလာ့မွာ Horizontal Menu ကိုသံုးခ်င္တဲ့မိတ္ေဆြေတြအတြက္ပါ။ ဘေလာ့ႏွင့္၀က္ဆိုက္ဒ္တခုလံုးျပည့္စံုလွပေစေအာင္ Mune ကလည္းတကယ့္ကိုအေရးၾကီးဆံုးနဲ႕အဓိက လို႕ေျပာလို႕ရပါတယ္။ဒါေၾကာင့္အခုေနာက္ပိုင္းရတဲ့အခ်ိန္ေလးေတြမွာ Menu ပိုင္းေတြကိုဘဲတင္ျဖစ္ဖို႕ မ်ားမယ္ထင္ပါတယ္။သြားၾကည့္လို႕ရေအာင္ DEMO လင့္ခ္ေပးထားပါတယ္။

ဒီမွာသြားၾကည့္လိုက္ပါ။

၁။ Layout

၂။Edit HTML

ေအာက္က Code ကိုရွာပါ။
]]></b:skin>
ေတြ ့ျပီဆို၇င္အေပၚမွာေအာက္က Css Code ကိုထည့္ေပးလိုက္ပါ။
#painters2 {
padding:0;
margin:0;
list-style-type:none;
}
#painters2 li {
width:75px;
height:20px;
float:left;
border:1px solid #000;
margin-right:2px;
}
#painters2 a em {
font-style:normal;
font-size:1em;
line-height:1.5em;
}
#painters2 a {
text-decoration:none;
color:#000;
position:absolute;
width:75px;
height:20px;
display:block;
text-align:center;
}
#painters2 a.red {background:#c00; color:#fff;}
#painters2 a.orange {background:#fc0; color:#000;}
#painters2 a.yellow {background:#ee0; color:#000;}
#painters2 a.green {background:#080; color:#fff;}
#painters2 a.blue {background:#00c; color:#fff;}
#painters2 a:hover {
width:120px;
height:28px;
z-index:200;
background:transparent url(../ads/opaque.gif);
}
#painters2 a:hover em {
font-size:1.5em;
line-height:1.1em;
overflow:hidden;
cursor:pointer;
background:#fff;
border:1px solid #000;
position:absolute;
width:120px;
height:25px;
left:-12px;
top:-4px;
}
#painters2 a:hover.red em {background:#c00;}
#painters2 a:hover.orange em {background:#fc0;}
#painters2 a:hover.yellow em {background:#ee0;}
#painters2 a:hover.green em {background:#080;}
#painters2 a:hover.blue em {background:#00c;}
၃။Save Template ေအာက္က Code Layout>>>Add a Gadget>>>HTML/JavaScript Add ထည့္ေပးလိုက္ပါ။
<ul id="painters2">
<li><a class="red" href="http://kp3family.blogspot.com#nogo"><em>kp3family</em></a></li>
<li><a class="orange" href="http://kp3family.blogspot.com#nogo"><em>kp3family</em></a></li>
<li><a class="yellow" href="http://kp3family.blogspot.com#nogo"><em>kp3family</em></a></li>
<li><a class="green" href="http://kp3family.blogspot.com#nogo"><em>kp3family</em></a></li>
<li><a class="blue" href="http://kp3family.blogspot.com#nogo"><em>kp3family</em></a></li>
</ul>
၄။Save ႏိုပ္လိုက္ပါ။ျပီးပါျပီ။ ။

မွတ္ခ်က္။ ။kp3family ႏွင့္ kp3လင့္ခ္ေတြကိုမိမိရဲ ့လင့္ခ္ေတြနဲ ့အစားထိုးေပးလိုက္ပါ။

မသိေသးတဲ႔မိတ္ေဆြေတြကိုအသိေပးမ်ွေဝေစခ်င္ပါတယ္၊
ဘေလာ့ဂါမိတ္ေဆြအားလံုးကိုအစဥ္ျမဲခ်စ္ခင္ေလးစားလၽွက္ kp3မိသားစု

kp3နည္းပညာ၊၂၅၀၊ဘေလာ့မွာ KP-3 ရဲ႕ Drop Down Menu အသစ္ေလးသံုးခ်င္၇င္

အခုတင္တဲ့ Post ေလးကေတာ့မေမ်ာ္လင့္ဘဲနဲ႕တင္ျဖစ္သြားတယ္လို႕ေျပာရင္မွားမယ္မထင္ပါဘူး။ ဒီေန႕ တင္တဲ Post ကဒါနဲ႕ဆိုရင္ ႏွစ္ခုေပါ့ေနာ္ေနာက္တစ္ခုကေတာ့ kp3နည္းပညာ၊၂၄၉၊ရွိပါတယ္၊ ဘာတင္ရင္ ေကာင္းမွာလဲဆိုျပီစဥ္းစားရင္နဲ႕စိတ္ထဲမွာေပၚလာလို႕ Drop Down Menu အသစ္ေလးကိုသူမ်ားေတြနဲ႕ မတူေအာင္လုပ္မယ္ဆိုျပီးလုပ္ျဖစ္သြားတာပါ.အသစ္ေလးပါဘဲေအာက္မွာသြားၾကည့္လို႕ရေအာင္လည္းနမူ နာလင့္ခ္ႏွင့္တကြ Code ေလးေပးထားပါတယ္ပံုကိုေတာ့မထားေတာ့ဘူးေနာ္။ ဘေလာ့မိတ္ေဆြအားလံုးလည္းေက်းဇူးကမ႓ာ

ဒီမွာသြားၾကည့္လိုက္ပါ။

၁။ Layout

၂။Edit HTML

ေအာက္က Code ကိုရွာပါ။
]]></b:skin>
ေတြ ့ျပီဆို၇င္အေပၚမွာေအာက္က Css Code ကိုထည့္ေပးလိုက္ပါ။
#outside{
border:1px solid #000099;
background:#000099;
}
#navigation-1 {
padding:1px 0;
margin:0px;
list-style:none;
width:100%;
height:21px;
border-top:1px solid #FFFFFF;
border-bottom:1px solid #FFFFFF;
font:normal 8pt verdana, arial, helvetica;
}
#navigation-1 li {
margin:0;
padding:0;
display:block;
float:left;
position:relative;
width:148px;
}
#navigation-1 li a:link, #navigation-1 li a:visited {
padding:4px 0;
display:block;
text-align:center;
text-decoration:none;
background:#000099;
color:#ffffff;
width:148px;
height:13px;
}
#navigation-1 li:hover a, #navigation-1 li a:hover, #navigation-1 li a:active {
padding:4px 0;
display:block;
text-align:center;
text-decoration:none;
background:#0066FF;
color:#ffffff;
width:146px;
height:13px;
border-left:1px solid #ffffff;
border-right:1px solid #ffffff;
}
#navigation-1 li ul.navigation-2 {
margin:0;
padding:1px 1px 0;
list-style:none;
display:none;
background:#ffffff;
width:146px;
position:absolute;
top:21px;
left:-1px;
border:1px solid #000099;
border-top:none;
}
#navigation-1 li:hover ul.navigation-2 {
display:block;
}
#navigation-1 li ul.navigation-2 li {
width:146px;
clear:left;
width:146px;
}
#navigation-1 li ul.navigation-2 li a:link, #navigation-1 li ul.navigation-2 li a:visited {
clear:left;
background:#000099;
padding:4px 0;
width:146px;
border:none;
border-bottom:1px solid #ffffff;
position:relative;
z-index:1000;
}
#navigation-1 li ul.navigation-2 li:hover a, #navigation-1 li ul.navigation-2 li a:active, #navigation-1 li ul.navigation-2 li a:hover {
clear:left;
background:#0066FF;
padding:4px 0;
width:146px;
border:none;
border-bottom:1px solid #ffffff;
position:relative;
z-index:1000;
}
#navigation-1 li ul.navigation-2 li ul.navigation-3 {
display:none;
margin:0;
padding:0;
list-style:none;
position:absolute;
left:145px;
top:-2px;
padding:1px 1px 0 1px;
border:1px solid #000099;
border-left:1px solid #000099;
background:#ffffff;
z-index:900;
}
#navigation-1 li ul.navigation-2 li:hover ul.navigation-3 {
display:block;
}
#navigation-1 li ul.navigation-2 li ul.navigation-3 li a:link, #navigation-1 li ul.navigation-2 li ul.navigation-3 li a:visited {
background:#000099;
}
#navigation-1 li ul.navigation-2 li ul.navigation-3 li:hover a, #navigation-1 li ul.navigation-2 li ul.navigation-3 li a:hover, #navigation-1 li ul.navigation-2 li ul.navigation-3 li a:active {
background:#0066FF;
}
#navigation-1 li ul.navigation-2 li a span {
position:absolute;
top:0;
left:132px;
font-size:12pt;
color:#fe676f;
}
#navigation-1 li ul.navigation-2 li:hover a span, #navigation-1 li ul.navigation-2 li a:hover span {
position:absolute;
top:0;
left:132px;
font-size:12pt;
color:#ffffff;
}
၃။Save Template ေအာက္က Code Layout>>>Add a Gadget>>>HTML/JavaScript Add ထည့္ေပးလိုက္ပါ။


<head>
<link rel="stylesheet" type="text/css" href="/menu/menu_style.css" />
</head>
<div id="outside">
<ul id="navigation-1">
<li><a href="http://kp3family.blogspot.com" title="kp3family" target="_self" >kp3family</a>
<ul class="navigation-2">
<li><a href="http://kp3family.blogspot.com" title="kp3family" target="_self" >kp3family</a></li>
<li><a href="http://kp3family.blogspot.com" title="kp3family" target="_self" >kp3family</a></li>
<li><a href="http://kp3family.blogspot.com" title="kp3family" target="_self" >kp3family</a></li>
<li><a href="http://kp3family.blogspot.com" title="kp3family" target="_self" >kp3family</a></li>
<li><a href="http://kp3family.blogspot.com" title="kp3family" target="_self" >kp3family</a></li>
<li><a href="http://kp3family.blogspot.com" title="kp3family" target="_self" >kp3family</a></li>
<li><a href="http://kp3family.blogspot.com" title="kp3family" target="_self" >kp3family</a></li>
<li><a href="http://kp3family.blogspot.com" title="kp3family" target="_self" >kp3family</a></li>
<li><a href="http://kp3family.blogspot.com" title="kp3family" target="_self" >kp3family</a></li>
<li><a href=""http://kp3family.blogspot.com" title="" target="" >kp3family</a></li>
<li><a href="http://kp3family.blogspot.com" title="" target="" >kp3family</a></li>
<li><a href="http://kp3family.blogspot.com" title="" target="" >kp3family</a></li>
<li><a href="http://kp3family.blogspot.com" title="" target="" >kp3family</a></li>
<li><a href="http://kp3family.blogspot.com" title="" target="" >kp3family</a></li>
</ul>
</li>
<li><a href="http://kp3family.blogspot.com" title="kp3famiy" target="_self" >kp3famiy</a>
</li>
<li><a href="http://kp3family.blogspot.com" title="kp3family" target="_self" >kp3family</a>
</li>
<li><a href="http://kp3family.blogspot.com" title="kp3family" target="_self" >kp3family</a>
</li>
<li><a href="http://kp3family.blogspot.com" title="kp3family" target="_self" >kp3family</a>
</li>
<li><a href="http://kp3family.blogspot.com" title="kp3family" target="_self" >kp3family</a>
</li>
<li><a href="http://kp3family.blogspot.com" title="kp3family" target="_self" >kp3family</a>
</li>
<li><a href="http://kp3family.blogspot.com" title="kp3family" target="_self" >kp3family</a>
</li>
</ul>
</div>

Save ႏိုပ္လိုက္ပါ။ျပီးပါျပီ။ ။

မွတ္ခ်က္။ ။kp3family ႏွင့္ kp3လင့္ခ္ေတြကိုမိမိရဲ  ့လင့္ခ္ေတြနဲ ့အစားထိုးေပးလိုက္ပါ။

မသိေသးတဲ႔မိတ္ေဆြေတြကိုအသိေပးမ်ွေဝေစခ်င္ပါတယ္၊
ဘေလာ့ဂါမိတ္ေဆြအားလံုးကိုအစဥ္ျမဲခ်စ္ခင္ေလးစားလၽွက္ kp3မိသားစု
...Your html-escaped code goes here...

YOUR CODE HERE

kp3နည္းပညာ၊၂၄၉၊မခမဲ့ Online ကေနမိမိရဲ ့Web Accounts ေတြကို Delate လုပ္ခ်င္၇င္

ဒါေလးကေတာ့အရမ္းကိုအသံုး၀င္မယ္ထင္လို ့တင္လိ္ုက္တာပါ၊က်ေနာ္တို ့မၾကိဳက္ေတာ့သည့္ ၀က္ဆိုက္ဒ္ သို ့ မဟုတ္တျခားအေကာင့္ေတြကို Online ကေနျပီ Delate လုပ္ခ်င္တဲ့ဘေလာ့ဂါမိတ္ေဆြေတြရွိခဲ့ ရင္ေပါ့ ေနာ္။ အရမ္းလည္းသံုးရတာအဆင္ေျပပါတယ္မၾကိဳက္တဲ့ Accountsေတြကို Delate လုပ္တာလည္းပိုျမန္တာ ေပါ့ေနာ္။ ေနာက္မွာ DelateAccounts ရဲ  ့လင့္ခ္ေလးနဲ႕Websites အခ်ိဳ  ့ရဲ  ့ နာမည္ေတြပါထည့္ေပးထားပါ တယ္။ ဘေလာ့မိတ္ေဆြအားလံုးလည္းေက်းဇူးကမ႓ာ




၁။Delete Your Account ကို၀င္သြားပါ။ေအာက္ပံုအတိုင္းေတြ  ့ရမွာပါ။






ေအာက္မွာဥပမာ၀က္ဆိုက္ဒ္အခ်ိုဳ  ့
  • eBay
  • Facebook
  • Flickr
  • FriendFeed
  • Amazon
  • AOL Instant Messenger (AIM)
  • Digg
  • Google
  • Hotmail
  • iTunes
  • Meebo
  • Monster
  • MyBlogLog
  • MySpace
  • Twitter
  • Wikipedia
  • WordPress
  • OkCupid
  • LinkedIn
  • Yahoo
  • YouTube
  • LiveJournal
  • Orkut
  • PayPal
  • Reddit
  • The Pirate Bay

kp3နည္းပညာ၊၂၄၈၊ဘေလာ့မွာ Facebook Like This Share Icon ထားနည္း

အခုတင္တဲ့ Post ေလးကေတာ့အသစ္ေလးပါ၊ဘေလာ့ Post ေအာက္မွာ Facebook Like This Share Icon ထည့္ နည္း ေလးပါ၊Facebook Like This Share Icon ကိုထည့္ခ်င္တဲ့ဘေလာ့မိတ္ေဆြေတြအတြက္ပါ။ ေအာက္မွာပံုနဲ ့တကြ Codeေပးထားပါတယ္။ဘေလာ့ဂါမိတ္ေဆြအားလံုးကိုအစဥ္ေလးစားလွ်က္KP3မိသားစု

 
၁။Layout

၂။Edit HTML

၃။Expand Widget Templates မွန္ျခစ္ေပးပါ၊ထည့္ပံုထည့္နည္းႏွစ္မ်ိဳးရွိပါတယ္။

ေအာက္က Code ကိုရွာပါ။
<data:post.body/>
ေတြ ့ျပီဆိုရင္ေအာက္မွာေအာက္က Code ကိုထည့္ေပးလိုက္ပါ။
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?href=&quot; + data:post.url + &quot;&amp;layout=standard&amp;show_faces=false&amp;width=100&amp;action=like&amp;font=arial&amp;colorscheme=light&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:450px; height:40px;'/>
</b:if>
၄။Save Temlateႏိုပ္ပါ၊ၿပီးပါၿပီ။

ေနာက္တစ္မ်ိဳးကေတာ့ေအာက္က Code ကိုရွာပါ။
<div class='post-header-line-1'>
ေတြ ့ျပီဆိုရင္ေအာက္ကမွာအေပၚက Code ကိုထည့္ေပးလိုက္ပါ။

မသိေသးတဲ႔မိတ္ေဆြေတြကိုအသိေပးမ်ွေဝေစခ်င္ပါတယ္၊
ဘေလာ့ဂါမိတ္ေဆြအားလံုးကိုအစဥ္ျမဲခ်စ္ခင္ေလးစားလၽွက္ kp3မိသားစု

kp3နည္းပညာ၊၂၄၇၊တျခားျမန္မာေဖာင့္ေတြကိုေဇာ္ဂ်ီေဖာင့္ အျဖင့္ေျပာင္းနည္း

အခုတင္တဲ့ Post ေလးကေတာ့ Cbox ကေတာင္းဆိုထားလို႕ပါ၊ဝင္းဘားမိစ္ကို ေဇာ္ဂ်ီနဲ႕ေျပာင္းခ်င္တဲ့ ဘေလာ့ မိတ္ေဆြတေယာက္ကေတာင္းဆိုထားပါတယ္။ဝင္းဘားမိစ္မေဖာင့္မဟုတ္ဘဲတျခားျမန္မာေဖာင့္မ်ိဳးစံုကို လည္း ေျပာင္း လို႕ရပါတယ္။မူရင္းကေတာ့ http://code.google.com/p/zawgyi/မွာပါဘဲ။အားလံုးအတြက္လိုအပ္တယ္ထင္ လို႕ Post အျဖင့္တင္လိုက္တာပါZawgyi-Forum ကိုလည္းအားလံုးအတြက္ေက်းဇူးအထူးပါ။ ေဖာင့္ေျပာင္းသည့္ ေနရာမွာ Comma တို႔ Spaceတို႔ကိုထည့္လို႕မရပါဘူး။ ေအာက္ကေပးထားတဲ့လင့္ခ္ကို၀င္သြားလိုက္ပါ။

တျခားျမန္မာေဖာင့္ေတြကိုေဇာ္ဂ်ီေျပာင္းမယ္ဆိုရင္ ဒီမွာ သြားလိုက္ပါ။

ဒီမွာ လည္းသြားသင့္ပါတယ္။

မသိေသးတဲ႔မိတ္ေဆြေတြကိုအသိေပးမ်ွေဝေစခ်င္ပါတယ္၊
ဘေလာ့ဂါမိတ္ေဆြအားလံုးကိုအစဥ္ျမဲခ်စ္ခင္ေလးစားလၽွက္ kp3မိသားစု
...Your html-escaped code goes here...

YOUR CODE HERE

kp3နည္းပညာ၊၂၄၆၊မေတာ္တဆဖ်က္မိတဲ့ Post ေတြျပန္ေခၚနည္း

အခုတင္တဲ့ Post ေလးကေတာ့မထင္မွတ္ဘဲဖ်က္မိတဲ့ Post ေလးေတြကိုျပန္ေခၚနည္းေလးပါ။ မေတာ္တဆ ျဖစ္ တတ္တာေလးေတြကိုပါ၊က်ေနာ္ကိုယ္တိုင္းေလးခဏခဏၾကံဳဖူးလို႕ပါ။က်ေနာ္လၾကံဳဖူးတဲ့ဘေလာ့မိတ္ေဆြေတြ အတြက္ပါေအာက္မွာပံုနဲ႕တကြျပထားေပးပါတယ္။

၁။Ctrl+H ကိုရိုက္လိုက္ပါ။ေဘးမွာဆိုက္ဘားေလးတခုတက္လားလိမ့္မည္ေအာက္ပံု

၂။Shift+ctrl+H နဲ႕လည္းရပါတယ္


ပံုမွာေတြ ့ရတဲ့အတိုင္းရက္ေလးေတြကိုျပန္ေရြးလိုက္ရင္ရပါျပီ။

မသိေသးတဲ႔မိတ္ေဆြေတြကိုအသိေပးမ်ွေဝေစခ်င္ပါတယ္၊
ဘေလာ့ဂါမိတ္ေဆြအားလံုးကိုအစဥ္ျမဲခ်စ္ခင္ေလးစားလၽွက္ kp3မိသားစု

kp3နည္းပညာ၊၂၄၅၊ဘေလာ့မွာ Gigya Tool Bar ေလးထည့္နည္း

လာျပန္ျပီဗ်ာ KP-3 ကေတာ့ Tool Bar ၾကီးဘဲလို႕ေျပာမိမွာလည္းေၾကာင့္ရတယ္ေနာ္၊Tool Bar ကေတာ့ ဒါနဲ႕ ၃ -၄ ခုေလာက္ေတာ့ရွိေလာက္ျပီထင္ပါတယ္။အခုဒီ Gigya Tool Bar ေလးကေတာ့ Face Book စတိုင္း Tool Bar ေလးပါဘဲ။  Tool Bar ေတြကမ်ားေနေပမယ့္တစ္ခုႏွင့္တစ္ခုေကာင္းတဲ့ေနရာေတြကေတာ့ မတူဘူး ေပါ့ေနာ္၊ အခုဒီ Tool Bar ကေတာ့ Twitter Updates လုပ္ေပးတဲ့ေနရာမွာတျခား Tool Bar ထက္ပိုျပီး ေကာင္း တယ္လို႕ က်ေနာ္ျမင္ပါတယ္။ေအာက္မွာသြားယူရမယ့္လင့္ခ္နဲ႕ပံုႏွင့္တကြသြားၾကည့္လို႕ရေအာင္ DEMO လင့္ခ္ေလး ပါေပးထားပါတယ္။

ဒီမွာ သြားၾကည့္လိုက္ပါ။

၁။ ဒီမွာ အရင္၀င္ပါ။ဒါမွမဟုတ္ ဒီမွာ လည္းရပါတယ္။ Signup လုပ္ေပးလိုက္ပါ။


၂။Signup ျပီးသြားရင္ေတာ့ထံုးစံတိုင္းပါဘဲမခက္ပါဘုူးေအာက္ပံုအတိုင္းေပါ့ေနာ္လြယ္ပါတယ္။


 
၃။အေပၚက Code ကိုေအာက္မွာျပထားသည္ပံုတိုင္းထည့္ေပးလိုက္ပါ။ Code ထည့္နည္းက ၂ မ်ိဳးရွိပါတယ္။
ေနာက္တစ္မ်ိဳးကေတာ့၀င္ၾကည့္ရင္သိသြားမွာပါ။Layout>>Add a Gadget>>HTML/JavaScript Add ထည့္လို႕လည္းရပါတယ္။


၄။Save Tamplate ကိုႏိုပ္လိုက္ပါ။ျပီးပါျပီ။ ။ ။

မသိေသးတဲ႔မိတ္ေဆြေတြကိုအသိေပးမ်ွေဝေစခ်င္ပါတယ္၊
ဘေလာ့ဂါမိတ္ေဆြအားလံုးကိုအစဥ္ျမဲခ်စ္ခင္ေလးစားလၽွက္ kp3မိသားစု

၂၄၄။မိမိ၇ဲ႕ဘေလာ့မွာ Spy effect လို႕ေခၚတဲ့ Recent Posts widget ေလးထည့္နည္း

ဒီေန႕တင္တဲ့ Post ေလးကေတာ့ဘေလာ့ဂါမိတ္ေဆြေတြလည္းၾကိဳၾကမယ္လို႕ေမ်ာ္လင့္ပါတယ္။ အေဟာင္း ထဲက အသစ္လို႕လည္းေျပာလို႕ရပါတယ္သံုးတဲ့သူေတြလည္းရွိပါတယ္။ဒါေပမယ့္နည္းပါေသးတယ္။ ဒီRecent Posts widget က Recent Posts ကိုပံုနဲ႕တကြအေပၚကေနေအာက္ကို တေျဖးေျဖးဆင္းသြားတာေပါ့ေနာ္။ ေအာက္မွာထည့္နည္းနဲ႕တကြ Code လည္းရွိပါတယ္။ၾကည့္လို႕လည္းရပါတယ္။

ဒီမွာသြားၾကည့္လိုက္ပါ။

၁။Layout

၂။Add a Gadget

၃။HTML/JavaScript Add မွာေအာက္က Code ကိုထည့္လိုက္ပါ။
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script>
<style type="text/css" media="screen">


<!--

#spylist {
overflow:hidden;
margin-top:5px;
padding:0px 0px;
height:350px;
}
#spylist ul{
width:270px;
overflow:hidden;
list-style-type: none;
padding: 0px 0px;
margin:0px 0px;
}
#spylist li {
width:250px;
padding: 5px 5px;
margin:0px 0px 5px 0px;
list-style-type:none;
float:none;
height:70px;
overflow: hidden;
background:#fff url(http://i879.photobucket.com/albums/ab351/bloggerblogimage/blogger/post.jpg) repeat-x;
border:1px solid #ddd;
}

#spylist li a {
text-decoration:none;
color:#4B545B;
font-size:11px;
height:18px;
overflow:hidden;
margin:0px 0px;
padding:0px 0px 2px 0px;
}
#spylist li img {
float:left;
margin-right:5px;
background:#EFEFEF;
border:0;
}
.spydate{
overflow:hidden;
font-size:10px;
color:#0284C2;
padding:2px 0px;
margin:1px 0px 0px 0px;
height:15px;
font-family:Tahoma,Arial,verdana, sans-serif;
}

.spycomment{
overflow:hidden;
font-family:Tahoma,Arial,verdana, sans-serif;
font-size:10px;
color:#262B2F;
padding:0px 0px;
margin:0px 0px;
}

-->
</style>

<script language='javascript'>

imgr = new Array();

imgr[0] = "http://i43.tinypic.com/orpg0m.jpg";

imgr[1] = "http://i43.tinypic.com/orpg0m.jpg";

imgr[2] = "http://i43.tinypic.com/orpg0m.jpg";

imgr[3] = "http://i43.tinypic.com/orpg0m.jpg";

imgr[4] = "http://i43.tinypic.com/orpg0m.jpg";
showRandomImg = true;

boxwidth = 255;

cellspacing = 6;

borderColor = "#232c35";

bgTD = "#000000";

thumbwidth = 70;

thumbheight = 70;

fntsize = 12;

acolor = "#666";

aBold = true;

icon = " ";

text = "Replys";

showPostDate = false;

summaryPost = 40;

summaryFontsize = 10;

summaryColor = "#666";

icon2 = " ";

numposts = 10;

home_page = "http://kp3family.blogspot.com/";

limitspy=4
intervalspy=4000

</script>

<div id="spylist">
<script type='text/javascript'>
//<![CDATA[
/*
* Recent Post with Spy effect for blogger.com
* Script combined from bloggerstricks.com and spy effect from jqueryfordesigners.com
* By Abu Farhan (www.abu-farhan.com)
*/
jQuery(function(){jQuery("ul.spy").simpleSpy(limitspy,intervalspy).bind("mouseenter",function(){jQuery(this).trigger("stop")}).bind("mouseleave",function(){jQuery(this).trigger("start")})});(function(e){e.fn.simpleSpy=function(f,g){f=f||4;g=g||5000;return this.each(function(){var l=e(this),k=true,i=[],m=f,o=0,h=l.find("> li:first").height();l.find("> li").each(function(){i.push("<li>"+e(this).html()+"</li>")});o=i.length;l.wrap('<div class="spyWrapper" />').parent().css({height:h*f});l.find("> li").filter(":gt("+(f-1)+")").remove();l.bind("stop",function(){k=false}).bind("start",function(){k=true});function n(){if(k){var p=e(i[m]).css({height:0,opacity:0,display:"none"}).prependTo(l);l.find("> li:last").animate({opacity:0},1000,function(){p.animate({height:h},1000).animate({opacity:1},1000);e(this).remove()});m++;if(m>=o){m=0}}setTimeout(n,g)}n()})}})(jQuery);function showrecentposts(z){document.write('<ul class="spy">');j=(showRandomImg)?Math.floor((imgr.length+1)*Math.random()):0;img=new Array();for(var o=0;o<numposts;o++){var w=z.feed.entry[o];var g=w.title.$t;var f;var p;if(o==z.feed.entry.length){break}for(var l=0;l<w.link.length;l++){if(w.link[l].rel=="alternate"){p=w.link[l].href;break}}for(var l=0;l<w.link.length;l++){if(w.link[l].rel=="replies"&&w.link[l].type=="text/html"){f=w.link[l].title.split(" ")[0];break}}if("content" in w){var r=w.content.$t}else{if("summary" in w){var r=w.summary.$t}else{var r=""}}postdate=w.published.$t;if(j>imgr.length-1){j=0}img[o]=imgr[j];s=r;a=s.indexOf("<img");b=s.indexOf('src="',a);c=s.indexOf('"',b+5);d=s.substr(b+5,c-b-5);if((a!=-1)&&(b!=-1)&&(c!=-1)&&(d!="")){img[o]=d}cmtext=(text!="no")?'<i><font color="'+acolor+'">('+f+" "+text+")</font></i>":"";var q=[1,2,3,4,5,6,7,8,9,10,11,12];var x=["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"];var u=postdate.split("-")[2].substring(0,2);var h=postdate.split("-")[1];var t=postdate.split("-")[0];for(var e=0;e<q.length;e++){if(parseInt(h)==q[e]){h=x[e];break}}var n=(showPostDate)?'<i><font color="'+acolor+'"> ('+u+" "+h+" "+t+")</font></i>":"";g=(aBold)?"<b>"+g+"</b>":g;var v='<li><a href="'+p+'"><img src="'+img[o]+'" width="'+thumbwidth+'" height="'+thumbheight+'" class="recent-thumb"/></a><a href="'+p+'" class="recent-link">'+g+'</a><div class="spydate">'+n+'</div><div class="spycomment">'+cmtext+"</div>";document.write(v);j++}document.write("</ul>")}document.write('<script src="'+home_page+"feeds/posts/default?max-results="+numposts+'&orderby=published&alt=json-in-script&callback=showrecentposts"><\/script>');
//]]>
</script>
</div>
မွတ္ခ်က္။ ။home_page = "http://kp3family.blogspot.com/"; ေနရာမွာမိမိရဲ႕ဘေလာ့ လင့္ခ္နဲ႕အစားထိုးေပး လိုက္ပါ။

မသိေသးတဲ႔မိတ္ေဆြေတြကိုအသိေပးမ်ွေဝေစခ်င္ပါတယ္၊
ဘေလာ့ဂါမိတ္ေဆြအားလံုးကိုအစဥ္ျမဲခ်စ္ခင္ေလးစားလၽွက္ kp3မိသားစု

kp3နည္းပညာ၊၂၄၃၊ဘေလာ့မွာFloating 'Subscribe' bar ေလးထည့္နည္း

 အခုတင္တဲ့ Post ေလးကလည္းက်ေနာ္တို႕ရဲ႕ဘေလာ့မွာ Subscribe Bar ကို Wibiya Tool Bar လိုေအာက္မွာ ေပၚေအာင္လုပ္ခ်င္တဲ့ဘေလာ့မိတ္ေဆြေတြအတြက္ပါ.ဒါေလးကေတာ့တခါဘဲေပၚျပီးျဖဳတ္ျပစ္ လိုက္ရင္ျပန္ မေပၚေတာ့ ဘူးေပါ့ေနာ္၊သံုးလို႕လည္းမဆိုးပါဘူးေကာင္းပါတယ္။သြားၾကည့္လို႕ရေအာင္လည္း DEMOလင့္ခ္ ေလးပါထည့္ေပးထားသလိုေအာက္မွာလည္း Code နဲ႕တကြပံုျပထားေပးပါတယ္။

 
ဒီမွာ သြားၾကည့္လိုက္ပါ။

ပထမအဆင့္

၁။Layout

၂။Edit HTML

၃။ေအာက္က Code ကိုရွာပါ။
]]></b:skin>
၄။ေတြ႕ျပီဆိုအေပၚမွာေအာက္က Code ကိုထည့္ေပးလိုက္ပါ။
#mta_bar {
background:#003366;
border-top: 3px solid #6699ff;
margin: 0;
padding: 7px 0;
z-index: 100;
bottom:0px;
right:0px;
width: 100%;
overflow: auto;
position: fixed;
}
* html #mta_bar{
/*IE6 hack*/
position: absolute;
width: expression(document.compatMode=="CSS1Compat"? document.documentElement.clientWidth+"px" : body.clientWidth+"px");
}
#mta_bar .left { float: left; text-align: center; font-family: Arial; font-size: 13px; font-weight: bold; font-style: normal; color: #0000FF; width:92%;}
#mta_bar .right {font-family: Arial, Helvetica, sans-serif; float: right; text-align: center; font-weight: normal; font-size: 10px;letter-spacing: 0; width: 30px; white-space: nowrap;}
#mta_bar .right a {font-size: 10px; color: #0000FF; text-decoration: underline;}
#mta_bar .right a:hover {font-size: 10px; color: #0000FF; text-decoration: none;}
#left_bar a {background: url('http://img229.imageshack.us/img229/3826/icorsstransthumb1bj4.png?imgmax=800') no-repeat; text-decoration: none; color: #fff; padding:5px 0px 5px 30px;}
#left_bar a:hover { text-decoration: underline; color: #fff; }
၆။ေနာက္တဆင့္ကေတာ့ ဒီေအာက္က Code
]]></b:skin>
ရဲ႕ေအာက္မွာ ေအာက္က Code ထပ္ထည့္ေပးပါ။
<script type='text/javascript'>
//<![CDATA[
var mta_arr = new Array();
var mta_clear = new Array();
function mtaFloat(mta) {
mta_arr[mta_arr.length] = this;
var mtapointer = eval(mta_arr.length-1);
this.pagetop = 0;
this.cmode = (document.compatMode && document.compatMode!="BackCompat") ? document.documentElement : document.body;
this.mtasrc = document.all? document.all[mta] : document.getElementById(mta);
this.mtasrc.height = this.mtasrc.offsetHeight;
this.mtaheight = this.cmode.clientHeight;
this.mtaoffset = mtaGetOffsetY(mta_arr[mtapointer]);
var mtabar = 'mta_clear['+mtapointer+'] = setInterval("mtaFloatInit(mta_arr['+mtapointer+'])",1);';
mtabar = mtabar;
eval(mtabar);
}
function mtaGetOffsetY(mta) {
var mtaTotOffset = parseInt(mta.mtasrc.offsetTop);
var parentOffset = mta.mtasrc.offsetParent;
while ( parentOffset != null ) {
mtaTotOffset += parentOffset.offsetTop;
parentOffset = parentOffset.offsetParent;
}
return mtaTotOffset;
}
function mtaFloatInit(mta) {
mta.pagetop = mta.cmode.scrollTop;
mta.mtasrc.style.top = mta.pagetop - mta.mtaoffset + "px";
}
function closeTopAds() {
document.getElementById("mta_bar").style.visibility = "hidden";
}
//]]>

</script>
၆။ေနာက္ဆံုအဆင့္ေပါ့ေနာ္ေအာက္က Code ကိုထပ္ရွာေပးပါ။
</body>
ေအာက္မွာေအာက္က Code ကိုထည့္ေပးလိုက္ပါ။
<div id='mta_bar'>
<div id='left_bar'><span class='left'><a href='ဒီမွာFEED-BURNER-ADDRESSကိုထည့္ေပးလိုက္ပါ' target='_blank'>To Get Latest Update Subscribe Now !!!</a></span></div>
<span class='right' onmouseout='self.status=&apos;&apos;' onmouseover='self.status=&apos;kp3family.blogspot.com.com&apos;;return true;'> <img align='absmiddle' border='0' onClick='closeTopAds();return false;' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgmLv7cp1o6Xi53tl3MjrY-pNl-SyMySMxwrC6bRzTyH4HdScXTr57lQ-saHT3VsOB1QRVMP9JgohbSFRioxfWF8qQ61tm5aIvNPdLB1axnlOD4zVbVUR9W5EnAwkiGQRBH3baxlnbuPPA/?imgmax=800' style='cursor:hand;cursor:pointer;'/></span></div>
၇။Save Setting ကိုႏိုပ္လုိက္ပါ။ျပီးပါျပီ။ ။ ။

မွတ္ခ်က္၊  ။kp3family ေနရာမွာမိမိရဲ့လိပ္စာကိုထည့္ေပးလိုက္ပါ။

မသိေသးတဲ႔မိတ္ေဆြေတြကိုအသိေပးမ်ွေဝေစခ်င္ပါတယ္၊
ဘေလာ့ဂါမိတ္ေဆြအားလံုးကိုအစဥ္ျမဲခ်စ္ခင္ေလးစားလၽွက္ kp3မိသားစု

kp3နည္းပညာ၊၂၄၂၊ဘေလာ့မွာ Dancing Links လို႕ေခၚတဲ့ Jquery Link Nudging ေလးသံုးနည္း

ဒီ Post ေလးကလည္းသံုးတဲ့သူေတြရွိေပမယ့္အရမ္းကိုနည္းပါေသးတယ္လို႕ေျပာရင္ရမယ္ထင္ပါတယ္၊ Jquery Link Nudging လင့္ခ္ေတြ Mouse နဲ႕ေထာက္လိုက္ရင္လင့္ခ္ေလးေတြကေရြ့ေနတယ္ဒါေၾကာင့္
Dancing Links  လို႕ေခၚပါတယ္။ကေနတဲ့အတိုင္းဆိုေတာ့က်ေနာ္ေအာက္မွာသြားၾကည့္လို့ရေအာင္လည္း DEMO လင့္ခ္ေလးပါျပထားေပးပါတယ္။

ဒီမွာသြားၾကည့္လို့လည္းရပါတယ္။

ပထမအဆင့္

၁။Layout

၂။Edit HTML

၃။ေအာက္က Code ကိုရွာပါ။
</head>
၄။ေတြ႕ျပီဆိုရင္ေအာက္မွာေအာက္က Code ေလးထည့္လိုက္ပါ။
<script src='http://code.jquery.com/jquery-latest.js' type='text/javascript'/>
<script type='text/javascript'>
$(document).ready(function() {
$('a.nudge').hover(function() { //mouse in
$(this).animate({ paddingLeft: '20px' },400);
}, function() { //mouse out
$(this).animate({ paddingLeft: 0 }, 400);
});
});
</script>
<!--DANCING-NUDGE-LINKS-STOPS-http://kp3family.blogspot.com-->
၅၊Save Tamplate ကိုႏိုပ္လိုက္ပါ။

ဒုတိယအဆင့္

၁။Layout

၂။Add a Gadget

၃။HTML/JavaScript Add မွာေအာက္က Code ကိုထည့္လိုက္ပါ။
<li><a href="http://kp3family.blogspot.com" class="nudge">kp-3နည္းပညာ</a><li>
<a href="http://kp3family.blogspot.com" class="nudge">kp-3နည္းပညာ</a><li>
<a href="http://kp3family.blogspot.com" class="nudge">kp-3နည္းပညာ</a><li>
<a href="http://kp3family.blogspot.com" class="nudge">kp-3နည္းပညာ</a><li>
<a href="http://kp3family.blogspot.com" class="nudge">kp-3နည္းပညာ</a><li>
<a href="http://kp3family.blogspot.com" class="nudge">kp-3နည္းပညာ</a><li>
<a href="http://kp3family.blogspot.com" class="nudge">kp-3နည္းပညာ</a><li>
<a href="http://kp3family.blogspot.com" class="nudge">kp-3နည္းပညာ</a><li>
<a href="http://kp3family.blogspot.com" class="nudge">kp-3နည္းပညာ</a></li></li></li></li></li></li></li></li></li>
၄။Save ႏိုပ္လို္က္ပါ။ ျပီးပါျပီ။ ။

မွတ္ခ်က္။ ။ http://kp3family.blogspot.com ႏွင့္ kp-3နည္းပညာေတြမွာမိမိရဲ့လင့္ခ္ေတြထည့္ေပးလို္က္ပါ။

မသိေသးတဲ႔မိတ္ေဆြေတြကိုအသိေပးမ်ွေဝေစခ်င္ပါတယ္၊
ဘေလာ့ဂါမိတ္ေဆြအားလံုးကိုအစဥ္ျမဲခ်စ္ခင္ေလးစားလၽွက္ kp3မိသားစု

kp3နည္းပညာ၊၂၄၂၊ဘေလာ့မွာ Dancing Links လို႕ေခၚတဲ့ Jquery Link Nudging ေလးသံုးနည္း

kp3နည္းပညာ၊၂၄၂၊ဘေလာ့မွာ Dancing Links လို႕ေခၚတဲ့ Jquery Link Nudging ေလးသံုးနည္း

kp3နည္းပညာ၊၂၄၁၊ဘေလာ့မွာ CSS-driven tabs Menu ေလးထည့္နည္း

အခုတင္တဲ့ Post ေလးကေတာ့က်ေနာ္တို႕ရဲ႕ဘေလာ့မွာCSS-driven tabs Menu ေလးကိုသံုးခ်င္တဲ့ဘေလာ့ဂါ မိတ္ေဆြေတြအတြက္ပါ၊ေအာက္ၾကည့္လို႕ရေအာင္နမူနာပံုလည္းျပထားသလိုသြားၾကည့္လို႕ရေအာင္DEMO လင့္ခ္ေလးပါထာ့္ေပးထားပါတယ္။ဘေလာ့မွာနည္းပညာအသစ္လို႕ေျပာလို႕ရတဲ့ႏွစ္မ်ိဳးကိုkp3နည္းပညာ၊၂၄၀၊ ႏွင့္ kp3နည္းပညာ၊၂၃၉၊ မွာရွိပါတယ္။

ဒီမွာသြားၾကည့္လိုက္ပါ။

ပထမအဆင့္

၁။Layout

၂။Edit HTML

၃။ေအာက္က Code ကိုရွာပါ။
]]></b:skin>
၄။ေတြ႕ျပီဆိုရင္အေပၚမွာေအာက္က Code ေလးထည့္လိုက္ပါ။
/*globalnav*/

#globalnav {
position:relative;
float:left;
width:100%;
padding:0 0 1.75em 1em;
margin:0;
list-style:none;
line-height:1em;
}

#globalnav LI {
float:left;
margin:0;
padding:0;
}

#globalnav A {
display:block;
color:#444;
text-decoration:none;
font-weight:bold;
background:#ddd;
margin:0;
padding:0.25em 1em;
border-left:1px solid #fff;
border-top:1px solid #fff;
border-right:1px solid #aaa;
}

#globalnav A:hover,
#globalnav A:active,
#globalnav A.here:link,
#globalnav A.here:visited {
background:#bbb;
}

#globalnav A.here:link,
#globalnav A.here:visited {
position:relative;
z-index:102;
}

/*subnav*/

#globalnav UL {
position:absolute;
left:0;
top:1.5em;
float:left;
background:#bbb;
width:100%;
margin:0;
padding:0.25em 0.25em 0.25em 1em;
list-style:none;
border-top:1px solid #fff;
}

#globalnav UL LI {
float:left;
display:block;
margin-top:1px;
}

#globalnav UL A {
background:#bbb;
color:#fff;
display:inline;
margin:0;
padding:0 1em;
border:0
}

#globalnav UL A:hover,
#globalnav UL A:active,
#globalnav UL A.here:link,
#globalnav UL A.here:visited {
color:#444;
}
၅၊Save Tamplate ကိုႏိုပ္လိုက္ပါ။

ဒုတိယအဆင့္

၁။Layout

၂။Add a Gadget

၃။HTML/JavaScript Add မွာေအာက္က Code ကိုထည့္လိုက္ပါ။
<ul id="globalnav">
<li><a href="ဒီမွာမိမိရဲ့လင့္ခ္ထည့္ေပးပါ#">Home</a></li>
<li><a href="ဒီမွာမိမိရဲ့လင့္ခ္ထည့္ေပးပါ#" class="here">About</a>
<ul>
<li><a href="ဒီမွာမိမိရဲ့လင့္ခ္ထည့္ေပးပါ#">Vision</a></li>
<li><a href="ဒီမွာမိမိရဲ့လင့္ခ္ထည့္ေပးပါ#">Team</a></li>
<li><a href="ဒီမွာမိမိရဲ့လင့္ခ္ထည့္ေပးပါ#">Culture</a></li>
<li><a href="ဒီမွာမိမိရဲ့လင့္ခ္ထည့္ေပးပါ#">Careers</a></li>
<li><a href="ဒီမွာမိမိရဲ့လင့္ခ္ထည့္ေပးပါ#" class="here">History</a></li>
<li><a href="ဒီမွာမိမိရဲ့လင့္ခ္ထည့္ေပးပါ#">Sponsorship</a></li>
</ul>
</li>
<li><a href="ဒီမွာမိမိရဲ့လင့္ခ္ထည့္ေပးပါ#">News</a></li>
<li><a href="ဒီမွာမိမိရဲ့လင့္ခ္ထည့္ေပးပါ#">Proof</a></li>
<li><a href="ဒီမွာမိမိရဲ့လင့္ခ္ထည့္ေပးပါ#">Process</a></li>
<li><a href="ဒီမွာမိမိရဲ့လင့္ခ္ထည့္ေပးပါ#">Expertise</a></li>
<li><a href="ဒီမွာမိမိရဲ့လင့္ခ္ထည့္ေပးပါ#">Help</a></li>
</ul>
၄။Save ႏိုပ္လို္က္ပါ။ ျပီးပါျပီ။ ။

မွတ္ခ်က္။  ။ မိမိရဲ့လင့္ခ္ေတြထည့္ျပီသြား၇င္လည္းနာမည္ေတြကိုလည္းမိမိရဲ့လင့္ခ္ရဲ့နာမည္ေျပာင္းေပးၾကပါ။

မသိေသးတဲ႔မိတ္ေဆြေတြကိုအသိေပးမ်ွေဝေစခ်င္ပါတယ္၊
ဘေလာ့ဂါမိတ္ေဆြအားလံုးကိုအစဥ္ျမဲခ်စ္ခင္ေလးစားလၽွက္ kp3မိသားစု
အခုတင္တဲ့ Post ေလးကေတာ့က်ေနာ္တို႕ရဲ႕ဘေလာ့မွာCSS-driven tabs Menu ေလးကိုသံုးခ်င္တဲ့ဘေလာ့ဂါ မိတ္ေဆြေတြအတြက္ပါ၊ေအာက္ၾကည့္လို႕ရေအာင္နမူနာပံုလည္းျပထားသလိုသြားၾကည့္လို႕ရေအာင္DEMO လင့္ခ္ေလးပါေပးထားပါတယ္။ဘေလာ့မွာနည္းပညာအသစ္လို႕ေျပာလို႕ရတဲ့ႏွစ္မ်ိဳးကို kp3နည္းပညာ၊၂၄၀၊ ႏွင့္kp3နည္းပညာ၊၂၃၉၊မွာရွိပါတယ္။

ဒီမွာသြားၾကည့္လိုက္ပါ။

ပထမအဆင့္

၁။Layout

၂။Edit HTML

၃။ေအာက္က Code ကိုရွာပါ။
]]></b:skin>

၄။ေတြ႕ျပီဆိုရင္အေပၚမွာေအာက္က Code ေလးထည့္လိုက္ပါ။




/*globalnav*/

#globalnav {
position:relative;
float:left;
width:100%;
padding:0 0 1.75em 1em;
margin:0;
list-style:none;
line-height:1em;
}

#globalnav LI {
float:left;
margin:0;
padding:0;
}

#globalnav A {
display:block;
color:#444;
text-decoration:none;
font-weight:bold;
background:#ddd;
margin:0;
padding:0.25em 1em;
border-left:1px solid #fff;
border-top:1px solid #fff;
border-right:1px solid #aaa;
}

#globalnav A:hover,
#globalnav A:active,
#globalnav A.here:link,
#globalnav A.here:visited {
background:#bbb;
}

#globalnav A.here:link,
#globalnav A.here:visited {
position:relative;
z-index:102;
}

/*subnav*/

#globalnav UL {
position:absolute;
left:0;
top:1.5em;
float:left;
background:#bbb;
width:100%;
margin:0;
padding:0.25em 0.25em 0.25em 1em;
list-style:none;
border-top:1px solid #fff;
}

#globalnav UL LI {
float:left;
display:block;
margin-top:1px;
}

#globalnav UL A {
background:#bbb;
color:#fff;
display:inline;
margin:0;
padding:0 1em;
border:0
}

#globalnav UL A:hover,
#globalnav UL A:active,
#globalnav UL A.here:link,
#globalnav UL A.here:visited {
color:#444;
}
၅၊Save Tamplate ကိုႏိုပ္လိုက္ပါ။ဒုတိယအဆင့္၁။Layout၂။Add a Gadget၃။HTML/JavaScript Add မွာေအာက္က Code ကိုထည့္လိုက္ပါ။
<ul id="globalnav">
<li><a href="ဒီမွာမိမိရဲ့လင့္ခ္ထည့္ေပးပါ#">Home</a></li>
<li><a href="ဒီမွာမိမိရဲ့လင့္ခ္ထည့္ေပးပါ#" class="here">About</a>
<ul>
<li><a href="ဒီမွာမိမိရဲ့လင့္ခ္ထည့္ေပးပါ#">Vision</a></li>
<li><a href="ဒီမွာမိမိရဲ့လင့္ခ္ထည့္ေပးပါ#">Team</a></li>
<li><a href="ဒီမွာမိမိရဲ့လင့္ခ္ထည့္ေပးပါ#">Culture</a></li>
<li><a href="ဒီမွာမိမိရဲ့လင့္ခ္ထည့္ေပးပါ#">Careers</a></li>
<li><a href="ဒီမွာမိမိရဲ့လင့္ခ္ထည့္ေပးပါ#" class="here">History</a></li>
<li><a href="ဒီမွာမိမိရဲ့လင့္ခ္ထည့္ေပးပါ#">Sponsorship</a></li>
</ul>
</li>
<li><a href="ဒီမွာမိမိရဲ့လင့္ခ္ထည့္ေပးပါ#">News</a></li>
<li><a href="ဒီမွာမိမိရဲ့လင့္ခ္ထည့္ေပးပါ#">Proof</a></li>
<li><a href="ဒီမွာမိမိရဲ့လင့္ခ္ထည့္ေပးပါ#">Process</a></li>
<li><a href="ဒီမွာမိမိရဲ့လင့္ခ္ထည့္ေပးပါ#">Expertise</a></li>
<li><a href="ဒီမွာမိမိရဲ့လင့္ခ္ထည့္ေပးပါ#">Help</a></li>
</ul>
၄။Save ႏိုပ္လို္က္ပါ။ ျပီးပါျပီ။

kp3နည္းပညာ၊၂၄၀၊ဘေလာ့ Apture Social Networking Bar ထည့္နည္း

ဒီ Post ေလးကေတာ့ျမန္မာဘေလာ့ဂါေလာကမွာသံုးတဲ့သူေတြမရွိေသးဘူးလို႕ေျပာရင္လည္းမွား မယ္မထင္ပါ ဘူး။ Apture Social Networking Bar လို႕ေခၚပါတယ္ဘေလာ့မိတ္ေဆြေတြအားလံုးလည္းၾကိဳက္ၾကမယ္ လို႕ လည္း ေမ်ာ္လင့္ပါတယ္။Wibiya Tool bar ရဲ႕ search engine ထက္ဒီ  Apture search engineကအလုပ္ကိုပိုျပီးလုပ္ တယ္လို႕ ေျပာလို႕ရပါတယ္။ အခုလက္ရွိက်ေနာ္သံုေနတဲ့ အေပၚကအစိမ္းေရာင္းေလးနဲ႕ Bar ကိုေျပာတာပါ.။ ေက်းဇူးျပဴျပီးအသိေပးေစခ်င္ပါတယ္။နည္းပညာအသစ္တစ္ခုကလည္း kp-3နည္းပညာ၊၂၃၉၊တင္ထားပါတယ္္။ ေအာက္ပံုသြားယူရမယ့္လင့္ခ္ပံုျပထားေပးပါတယ္။

ဒီမွာအရင္၀င္ပါ။ ေအာက္ပံုအတိုင္းေတြ.ရပါလိမ့္မည္။အရမ္းလြယ္ပါေအာက္မွာနမုူနာျဖည့္ထားေပး
ပါတယ္။

ျဖည့္ျပီးသြား၇င္ေအာက္က Code ကိုယုူျပီး

၁။Layout

၂။Add a Gadget

၃။HTML/JavaScript Add မွာေအာက္ကရလာတဲ့ Code ကိုထည့္ေပးလိုက္ပါ။


၄။Save ကိုႏိုပ္လိုက္ပါ။ျပီးပါျပီ။ ။ ။

 မသိေသးတဲ႔မိတ္ေဆြေတြကိုအသိေပးမ်ွေဝေစခ်င္ပါတယ္၊
ဘေလာ့ဂါမိတ္ေဆြအားလံုးကိုအစဥ္ျမဲခ်စ္ခင္ေလးစားလၽွက္ kp3မိသားစု 
...Your html-escaped code goes here...

YOUR CODE HERE

kp3နည္းပညာ၊၂၃၉၊ဘေလာ့in Title Bar မွာ အခ်ိန္နဲ႕၇က္စြဲေပၚေအာင္လုပ္နည္း


အခုတင္တဲ့Postေလးကေတာ့ရွားရွားပါးပါးေလးအသစ္ပါဘဲဘေလာ့မိတ္ေဆြအားလံုးၾကိဳက္ၾကမယ္လို႕လည္း ေမ်ာ္လင့္ ပါတယ္။ေက်းဇူးျပဳျပီးလည္းအသိေပးေစခ်င္ပါတယ္၊မိမိရဲ႕ဘေလာ့ Title Bar မွာအခ်ိန္နဲ႕ ၇က္စြဲေပၚ ေအာင္လုပ္နည္းေလးပါ။အားလံုးနမူနာၾကည့္လို႕ရေအာင္လည္းက်ေနာ္ရဲ႕ဆိုက္မွာသံုျပထားပါတယ္.၄.၅ ရက္ေလာက္အားလံုးနမူနာၾကည့္ရေအာင္သံုးထားမွာျဖစ္ပါတယ္။ အခုက်ေနာ္ရဲ႕ဆိုက္ကိုၾကည့္လိုက္ပါ Title Bar မွာအခ်ိန္နဲ႕၇က္စြဲေပၚေနတာေတြ႕ၾကမွာပါ။ေအာက္မွာပံုနဲ႕တကြ Codeအားလံုးကိုေက်းဇူးကမ႓ာ

၁။Layout

၂။Add a Gadget

၃။HTML/JavaScript Add မွာေအာက္က Code ကိုထည့္လိုက္ပါ။
<Script Language="JavaScript" Type="Text/JavaScript">

var mytime1=24;
function mytime2() {
mytime3=mytime1+6;
mytime4=mytime1+mytime3;
timexx=mytime1+mytime3+mytime4;
timexxx=timexx/mytime4*mytime1; twelfth=mytime4*mytime1/12*mytime3;
timexxxx=mytime1+mytime3/timexxx-16*timexx;
timexxxxx=twelfth*(mytime1-5)/mytime4+timexx;
timexxxxxx=timexxxxx/timexxxx+mytime1*mytime4-timexx;
mytime5=(timexxxxxx+mytime1/mytime4*timexx+mytime3*timexxx)/twelfth+timexxxxx-timexxxxxx-1;
mytime6=Math.floor(mytime5);
mytime8=mytime6*mytime3/2+100;
mytime7 = window.setTimeout("mytime2()", mytime8);
var mytime9 = new Date();
var mytime10= mytime9.toLocaleString();
document.title = mytime10;}
function op(){mytime2()}
window.onload=op;

</script>
၄။Save ကိုႏိုပ္လိုက္ပါ။ျပီးပါျပီ။ ။ ။

မသိေသးတဲ႔မိတ္ေဆြေတြကိုအသိေပးမ်ွေဝေစခ်င္ပါတယ္၊
ဘေလာ့ဂါမိတ္ေဆြအားလံုးကိုအစဥ္ျမဲခ်စ္ခင္ေလးစားလၽွက္ kp3မိသားစု

kp3နည္းပညာ၊၂၃၈၊ဘေလာ့ကေနတျခားဘေလာ့(သို့မဟုတ္) ၀က္ဆိုက္ကို Auto ကူးေျပာင္းနည္း

အခုတင္တဲ့ Post ေလးကေတာ့က်ေနာ္တို့ရဲ႕ဘေလာ့ကိုအရင္ျပီးအျခားဘေလာ့(သို့မဟုတ္)၀က္ဆိုက္ကို Auto ကူးေျပာင္းသြားေအာင္လုပ္နည္းေလးပါ။ဥပမာမိမိရဲ႕ဘေလာ့အေဟာင္းကေနဘေလာ့အသစ္ထဲကို သြားျပန္၀င္ေစခ်င္ရင္လည္းဒီနည္းနဲ႕လည္းပိုျပီးအဆင္ေျပမယ္ထင္ပါတယ္။ဘေလာ့မိတ္ေဆြေတြအတြက္ လိုအပ္ခဲ့ရင္သံုးလို့ရေအာင္ပါ။ ဘေလာ့ဂါမိတ္ေဆြအားလံုးကိုအဆင္ျမဲခ်စ္ခင္ေလးစားလွ်က္-kp-3မိသားစု ေအာက္မွာလုပ္နည္းနဲ့တကြ Code

၁။Layout

၂။Edit HTML

၃။ေအာက္က Code ကိုရွာပါ။

<head>
၄။ေတြ႕ျပီဆိုရင္ေအာက္မွာေအာက္က Code ေလးထည့္လိုက္ပါ။

<meta HTTP-EQUIV="REFRESH" content="0; url=ဤေနရာမွာမိမိရဲ႕ဘေလာ့ (သို့မဟတ္) ၀က္ဆိုက္လင့္ခ္ထည့္ေပးပါ။">
၅။Save Setting ကိုႏိုပ္လိုက္ပါ။ျပီးပါျပီ။ ။ ။မိမိရဲ႕ဘေလာ့ကိုျပန္ၾကည့္လုိက္ပါ။

မသိေသးတဲ႔မိတ္ေဆြေတြကိုအသိေပးမ်ွေဝေစခ်င္ပါတယ္၊
ဘေလာ့ဂါမိတ္ေဆြအားလံုးကိုအစဥ္ျမဲခ်စ္ခင္ေလးစားလၽွက္ kp3မိသားစု

kp3နည္းပညာ၊၂၃၈၊ဘေလာ့ကေနတျခားဘေလာ့(သို့မဟုတ္)၀က္ဆိုက္ကို Auto ကူးေအာင္နည္း

အခုတင္တဲ့ Post ေလးကေတာ့က်ေနာ္တို့ရဲ႕ဘေလာ့ကိုအရင္ျပီးအျခားဘေလာ့(သို့မဟုတ္)၀က္ဆိုက္ကို Auto  ကူးေျပာင္းသြားေအာင္လုပ္နည္းေလးပါ။ဥပမာမိမိရဲ႕ဘေလာ့အေဟာင္းကေန ဘေလာ့အသစ္ထဲ ကို ျပန္၀င္ေစခ်င္ရင္လည္းဒီနည္းနဲ႕လည္းပိုျပီးအဆင္ေျပမယ္ထင္ပါတယ္။ဘေလာ့မိတ္ေဆြေတြအတြက္လိုအပ္ခဲ့ ရင္သံုးလို့ရေအာင္ပါ။ ဘေလာ့ဂါမိတ္ေဆြအားလံုးကိုအဆင္ျမဲခ်စ္ခင္ ေလးစားလွ်က္-kp-3မိသားစု ေအာက္မွာလုပ္နည္းနဲ့တကြ Code

၁။Layout

၂။Edit HTML

၃။ေအာက္က Code ကိုရွာပါ။
<head>

၄။ေတြ႕ျပီဆိုရင္ေအာက္မွာေအာက္က Code ေလးထည့္လိုက္ပါ။
<meta HTTP-EQUIV="REFRESH" content="0; url=ဤေနရာမွာမိမိရဲ႕ဘေလာ့ (သို့မဟတ္) ၀က္ဆိုက္လင့္ခ္ထည့္ေပးပါ။">
၅။Save Setting ကိုႏိုပ္လိုက္ပါ။ျပီးပါျပီ။ ။ ။မိမိရဲ႕ဘေလာ့ကိုျပန္ၾကည့္လုိက္ပါ။



မသိေသးတဲ႔မိတ္ေဆြေတြကိုအသိေပးမ်ွေဝေစခ်င္ပါတယ္၊

ဘေလာ့ဂါမိတ္ေဆြအားလံုးကိုအစဥ္ျမဲခ်စ္ခင္ေလးစားလၽွက္ kp3မိသားစု








kp3နည္းပညာ၊၂၃၇၊ဘေလာ့မွာ Comments လာေပးဘေလာ့မိတ္ေဆြေတြရဲ့ Profile ပံုေပၚေအာင္လုပ္နည္း

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

ဒီမွာသြားၾကည့္လို႕၇ပါတယ္။

အဆင့္။၁။Dashboard--> Settings- -> Comments.ကိုသြားမယ္။ေအာက္ပံု



အဆင့္။၂။Dashboard--> Settings- -> Comments.ကိုသြားမယ္။ေအာက္ပံု



အေပၚပံုအတိုင္းလုပ္ျပီးသြားရင္ Save Settings ကိုႏိုပ္လိုက္ပါ။

အဆင့္။၃။

၁။Layout

၂။ Edit HTMLကို၀င္ျပီးသြားရင္

၃။Expand Widget Templates ကိုအမွန္ျခစ္ေပးပါ.။ေအာက္ပံု


၄။ေအာက္က Code ကိုရွာပါ။
&lt;dl expr:class='data:post.avatarIndentClass' id='comments-block'&gt;
အေပၚက Code အတိုင္းေတြ႕တယ္ဆိုရင္ေတာ့ရပါျပီ။တကယ္လိုအေပၚက Coden ကိုမေတြ႕ခ့ဲရင္ေတာ့စဥ္းစားရေတာ့မယ္။

၅။အေပၚက Code ကိုရွာမေတြ႕ရင္ေအာက္က Code ကိုရွာပါ။
<dl id='comments-block'>
သို႕မဟုတ္ ေအာက္က Code
<div id='comments-block'>
၆။ဒီအေပၚက Code ၂ခုထဲကေတာ့တစ္ခုခုရွိပါလိမ့္မည္။ေတြ႕ျပီဆိုရင္ေအာက္က Code နဲ႕အစားထိုးေပးလိုက္ပါ။
<dl expr:class='data:post.avatarIndentClass' id='comments-block'>
၇။ေအာက္က Code ကိုထပ္ရွာပါ။
<a expr:name='data:comment.anchorName'/>
၈။ေတြ႕ျပီဆိုရင္ေအာက္က Code နဲ႕အစားထိုးေပးလိုက္ပါ။
<b:if cond='data:comment.favicon'>
<img expr:src='data:comment.favicon' height='16px' style='margin-bottom:-2px;' width='16px'/>
</b:if>
<a expr:name='data:comment.anchorName'/>
<b:if cond='data:blog.enabledCommentProfileImages'>
<div expr:class='data:comment.avatarContainerClass'>
<data:comment.authorAvatarImage/>
</div>
</b:if>
၉။ေနာက္ဆံုအဆင့္ေအာက္က Code ကိုထပ္ရွာပါ။
]]></b:skin>
ေတြ႕ျပီဆိုရင္အေပၚမွာေအာက္က Code ကိုထည့္ေပးလိုက္ပါ။
/* Avatar */
.avatar-image-container img {
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiMbQBZoGg8gdiIEUwpymBaFoap7CFpzZCLuud_dcVaSOshLdr25O3Onqz1tsIVGTb70cGdfJW1f7HD-84aXW3DNRKlxgnH9bsJAxUkz1UXhvqslhPKStvBjTsHVp5zS51kgJI8v8fy33yV/+avatar.png);
width:35px;
height:35px;
}
၁၀။Save Template ကိုႏိုပ္လိုက္ပါ.ျပီးပါျပီ။ ။ဘေလာ့မိတ္ေဆြအားလံုအဆင္ေျပၾကပါေစ ။ ။

မသိေသးတဲ႔မိတ္ေဆြေတြကိုအသိေပးမ်ွေဝေစခ်င္ပါတယ္၊
ဘေလာ့ဂါမိတ္ေဆြအားလံုးကိုအစဥ္ျမဲခ်စ္ခင္ေလးစားလၽွက္ kp3မိသားစု

kp3နည္းပညာ၊၂၃၆၊ဘေလာ့ Anonymous Comments ေပးမရေအာင္လုပ္နည္း

ဒါေလးကေတာ့က်ေနာ္တို႕ဘေလာ့ေတြမွာျမင္ဖူးၾကမယ္လို႕ထင္ပါတယ္၊တခါတေလ Comment ေတြလာေပး ထားၾက တယ္.Anonymousဆိုျပီးအခုဒီ Post ေလးကေတာ့ Anonymousဆိုျပီး Comments ကိုေပးမရေအာင္ လုပ္ နည္းေလးပါ.။ ေအာက္မွာပံုနဲ႕တကြျပထားေပးပါတယ္။ က်ေနာ္လည္းခဏခဏေတြ႕ ဖူးတယ္ဒါေၾကာင့္ ဘေလာ့ မိတ္ေဆြေတြထဲမွာ Anonymous ဆိုျပီး Comments ကိုလက္မခံခ်င္ရင္ေအာက္ပံုအတိုင္း ေျပာင္းေပး
လိုက္ပါ။ဘေလာ့မိတ္ေဆြအားလံုးကိုႏွစ္သစ္မွာကိုယ္စိတ္ႏွျဖာ က်န္းမာရြွန္လန္းၾကပါေစလို႕ေတာင္း ဆုျပဳ လွ်က္  kp-3 မိသားစု

၁။ဘေလာ့ကို Sign in ၀င္မယ္။

၂။Dashboard

၃။Settings

၄။Comments.ေအာက္ပံု


အေပၚပံုအတိုင္းေျပာင္းေပးလိုက္ပါ။

၅။Save Setting ကိုႏိုပ္ပါ။ျပီးပါျပီ ။  ။   ။

မသိေသးတဲ႔မိတ္ေဆြေတြကိုအသိေပးမ်ွေဝေစခ်င္ပါတယ္၊
ဘေလာ့ဂါမိတ္ေဆြအားလံုးကိုအစဥ္ျမဲခ်စ္ခင္ေလးစားလၽွက္ kp3မိသားစု

kp3နည္းပညာ၊၂၃၅၊ဘေလာ့ Sidebar မွာ Multi Tabbed Navigation Widget ေလးထည့္နည္း

ဒါေလးကေတာ့ Multi Tabbed Navigation Widget ေလးပါဘဲ၊ဘေလာ့ Sidebar ထည့္ခ်င္တဲ့မိတ္ေဆြေတြ အတြက္ပါ။ဒါေလးကအရမ္းကိုရွင္းပါတယ္။ Code ကလည္းနည္းနည္းေလးပါဘဲ ဒီ Tabbed Navigation Widget ကေတာ့ပံုစံအမ်ိဳးမ်ိဳးရွိပါတယ္။အေရာင္ႏွင့္ျဖင့္ေစအမ်ားၾကီးအမ်ားၾကီးပါဘဲ။က်ေနာ္အခုတင္တာေလးကေတာ့ နမူနာ သြားၾကည့္လို႕ရေအာင္လည္း DEMO လင့္ခ္ေလးပါေပးထားပါတယ္။

ဒီမွာသြားၾကည့္လို႕ရပါတယ္။

၁။Layout

၂။Edit HTML

၃။ေအာက္က Code ကိုရွာပါ။

</head>

ေတြ႕ျပီဆိုရင္ေအာက္မွာ ေအာက္က Code ကိုထည့္ေပးလိုက္ပါ။
<script src='http://www.tricksmachine.com/wp-content/uploads/2010/02/tabber.js' type='text/javascript'/>
<link MEDIA='screen' TYPE='text/css' href='http://www.tricksmachine.com/wp-content/uploads/2010/02/example.css' rel='stylesheet'/>
၄။Save Tamplate ကိုႏိုပ္လိုက္ပါ။

ဒုတိယအဆင့္။ ။

၅။Layout

၆။Add a Gadget

၇။HTML/JavaScript Add မွာေအာက္က Code ကိုထည့္လိုက္ပါ။
<div class="tabber">

<div class="tabbertab">
<h2>Tab 1</h2>
<p>Tab 1Code ဒီမွာထည့္ပါ.</p>
</div>


<div class="tabbertab">
<h2>Tab 2</h2>
<p>Tab 2 Code ဒီမွာထည့္ပါ.</p>
</div>


<div class="tabbertab">
<h2>Tab 3</h2>
<p>Tab 3 Code ဒီမွာထည့္ပါ.</p>
</div>
</div>
၈။Save ကိုႏိုပ္လိုက္ပါ။ျပီးပါျပီ။ ။

မွတ္ခ်က္။ ။Tab 1,Tab 2,Tab 3 ေနရာေတြမွာမိမိၾကိဳက္သလိုနာမည္ျပန္ေျပာင္းေပးၾကပါ။

မသိေသးတဲ႔မိတ္ေဆြေတြကိုအသိေပးမ်ွေဝေစခ်င္ပါတယ္၊
ဘေလာ့ဂါမိတ္ေဆြအားလံုးကိုအစဥ္ျမဲခ်စ္ခင္ေလးစားလၽွက္ kp3မိသားစု 

kp3နည္းပညာ၊၂၃၄၊ဘေလာ့ Header ကိုႏိုပ္ရင္တျခား၀က္ဆိုက္ေရာက္သြားေအာင္လုပ္နည္း

အခုတင္တဲ့ Post ေလးကေတာ့က်ေနာ္တို႕ရဲ့ဘေလာ့ Header လင့္ခ္ကိုႏိုပ္ရင္အျခားမိမိရဲ႕ဘေလာ့၀က္ဆိုက္ သို႕မဟုတ္မိမိႏွစ္သက္တဲ့ဘေလာ့လင့္ခ္၀က္ဆိုက္လင့္ခ္ကိုတခါထဲ ေရာက္သြားေအာင္ လုပ္နည္းေလးပါ။ ေအာက္မွာလုပ္နည္းနဲ႕တကြ Code

၁။Layout

၂။Edit HTML

၃။Expand Widgets Templateကိုအမွန္ျခစ္ေပးပါ။

ေအာက္က Code ကိုရွာပါ၊
<div class='titlewrapper'>
<h1 class='title'>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<data:title/>
<b:else/>
<a expr:href='data:blog.homepageUrl'><data:title/></a>
</b:if>
</h1>
</div>
ေတြ႕ျပီဆိုရင္ေအာက္က Code ႏွင့္အစားထိုးေပးလိုက္ပါ။
<div class='titlewrapper'>
<h1 class='title'>
<a expr:href='ဤေနရာမွာမိမိရဲ႕ဘေလာ့ သို့မဟုတ္ ၀က္ဆိုက္လင့္ခ္ကိုထည့္ေပးပါ'><data:title/></a>
</h1>
</div>
၄။Save Template ကိုႏိုပ္ပါ။ျပီးပါျပီ။။။

မသိေသးတဲ႔မိတ္ေဆြေတြကိုအသိေပးမ်ွေဝေစခ်င္ပါတယ္၊
ဘေလာ့ဂါမိတ္ေဆြအားလံုးကိုအစဥ္ျမဲခ်စ္ခင္ေလးစားလၽွက္ kp3မိသားစု

kp3နည္းပညာ၊၂၃၃၊ကြန္ပ်ဴတာ Window ကစာလံုးေတြကိုလြယ္ကူစြာခ်ဲ႕နည္း

အခုင္တဲ့ Post ေလးကေတာ့က်ေနာ္တို႕ကြန္ပ်ဴတာမွာဥပမာ-ဘေလာ့ျဖစ္ေစ၀က္ဆိုက္ေတြရဲ့စလံုးေတြေသးေန တယ္ဆိုရင္ Keyboard ကိုသံုးျပီးလြယ္ကူစြာသလံုေတြကိုခ်ဲ႕နည္းေလးပါ။ ဘေလာ့မိတ္ေဆြအားလံုးလည္းၾကိဳက္ ၾက မယ္လို႕လည္းေမ်ာ္လင့္ပါ။၀က္ဆိုက္ေတြဘေလာ့ေတြသတင္းေတြျဖစ္ေစဖတ္သည့္ေနရာမွာစလံုးေတြေသး ေနရင္ အဆင္မေျပရင္ KeyBoard မွာ (Ctrl ႏွင့္ Mouse ) သံုးျပီးလြယ္ကူစြာခ်ဲ့လို့ရပါတယ္။ ေအာက္မွာပံုနဲ့တကြျပထားေပးပါတယ္။









မသိေသးတဲ႔မိတ္ေဆြေတြကိုအသိေပးမ်ွေဝေစခ်င္ပါတယ္၊
ဘေလာ့ဂါမိတ္ေဆြအားလံုးကိုအစဥ္ျမဲခ်စ္ခင္ေလးစားလၽွက္ kp3မိသားစု

kp3နည္းပညာ၊၂၃၂၊ဘေလာ့မွာ Feed2JS Recent Posts Widget ေလးထည့္နည္း

ဒါေလးကေတာ့ Feed2JS လို႕ေခၚပါတယ္။ဘေလာ့မွာ Recent Posts Widgetကိုေနာက္တစ္မ်ိဳးသံုးျပီး ထည့္ခ်င္တဲ့ ဘေလာ့မိတ္ေဆြေတြအတြက္ပါ။ေအာက္မွာသြးရမယ့္ေနရာရဲ႕လင့္ခ္ေလးက္ိုပံုနဲ႕ တကြျပထားေပးပါတယ္။ လိုအပ္တဲ့ဘေလာ့မိတ္ေဆြေတြရွိခဲ့ရင္ေပါ့ေနာ္။ႏွစ္သစ္မွာေပ်ာ္ရြသ္ႏိုင္ၾကပါေစလို႕ kp3မိသားစုမွ ဆုမြန္ေကာင္း ေတာင္းလွ်က္..ရြွင္လန္းခ်မ္းေျမ့ၾကပါေစ။။

၁။Feed2JS ဒီကို၀င္ပါ။ေအာက္ပံုအတိုင္းေတြ႕ရပါလိမ့္မည္။






URL Enter the web address of the RSS Feed ရဲ႕ေအာက္မွာ မိမိရဲ့RSS Feed ကိုထည့္လိုက္ပါ။

ဥပမာ-http://kp3family.blogspot.com/feeds/posts/default

(kp3family)ကိုမိမိရဲ့လိပ္စာနဲ႕အစားထိုးေပးလို္က္ပါ။



Generate JavaScript ကိုႏိုပ္လိုက္ပါ။ေအာက္ပံုအတိုင္း Code ေပၚလာလိမ့္မည္၊ Copy ကူးျပီးေအာက္မွာ ထည့္နည္းျပထားပါတယ္။





ထည့္ျပီးသြား၇င္ Save ႏို္ပ္လိုက္ပါ။ျပီးပါျပီ။ ။ ။

မသိေသးတဲ႔မိတ္ေဆြေတြကိုအသိေပးမ်ွေဝေစခ်င္ပါတယ္၊
ဘေလာ့ဂါမိတ္ေဆြအားလံုးကိုအစဥ္ျမဲခ်စ္ခင္ေလးစားလၽွက္ kp3မိသားစု 

kp3နည္းပညာ၊၂၃၁၊ဘေလာ့မွာFeedburner Recent Posts Widget ေလးထည့္နည္း

ဒါေလးကေတာ့ Feedburner ကေနျပီးမိမိရဲ့ Recent Post Widget ေလးလုပ္နည္းေလးပါ။ အခုက်ေနာ္ဘေလာ့ မွာလည္းေတြ႕ၾကမယ္လို႕ထင္ပါတယ္။Feedburner Account ရွိတဲ့ဘေလာ့မိတ္ေဆြအားလံုးလုပ္လုပ္ရပါ တယ္။ ေအာက္မွာပံုနဲ႕တကြျပထားေပးပါတယ္။ၾကိဳက္ၾကမယ္လို႕လည္းေမ်ာ္လင့္ပါတယ္။



၁။ Feedbunner.com ကိုအရင္၀င္ပါ။

၂။ Login ထပ္၀င္ျပီးသြားရင္ေအာက္ကပံုအတိုင္းလုပ္လိုက္ပါ။ျမားႏွင့္ျပထားပါတယ္။ ။.

၃။

၄။

၅။

၆။Save ကိုႏိုပ္လိုက္ရင္..Code ေလးေပၚလာလိမ့္မည္။ရလာတဲ့ Codeကိုမိမိၾကိဳက္တဲ့ေနရာမွာထည့္လို့ ရပါ တယ္။ေအာက္ပံု Code ထည့္နည္း


၇။


၈။ Save ႏိုပ္လိုက္ပါျပီးပါျပီး ။ ။ ။ ။

မသိေသးတဲ႔မိတ္ေဆြေတြကိုအသိေပးမ်ွေဝေစခ်င္ပါတယ္၊
ဘေလာ့ဂါမိတ္ေဆြအားလံုးကိုအစဥ္ျမဲခ်စ္ခင္ေလးစားလၽွက္ kp3မိသားစု

kp3နည္းပညာ၊၂၃၀၊ဘေလာ့ Post အေပၚက Older Posts Links ႏွင့္ Newer Post Links ကိုျဖဳတ္နည္း

အခုတင္တဲ့ Post ကေတာ့ Cbox မွာေတာင္းဆိုထားလို႕ပါ၊ Older Posts Links ႏွင့္ Newer Post Links ကအေပၚမွာေရာက္ေနတာမၾကိဳက္ဘူးဆိုရင္ျဖဳတ္နည္းေလးေပါ့ေနာ္။ တကယ္ေတာ့ျဖဳတ္စရာေတာ့ မလိုပါ ဘူး Tamplate ေျပာင္းလိုက္ရင္ပိုျပီးအဆင္ေျပတာေပါ့ေနာ္။ ဒါေပမယ့္အၾကိဳက္ခ်င္ေတာ့ ဘယ္တူမွာ လဲေနာ္ ေအာက္မွာျဖဳတ္ခ်င္တဲ့မိတ္ေဆြေတြအတြက္ပါ။ ဘေလာ့မိ္တ္ေဆြအားလံုးကိုခ်စ္ခင္ေလးစားတဲ့ kp3မိသားစု

၁။Dashboard

၂။Layout

၃။Edit HTML

၄။Expand Widget Templates မွန္ျခစ္ေပးလိုက္ပါ။

ေအာက္က Code ကိုရွာပါ၊
<b:includable id='main' var='top'>
<!-- posts -->
<div class='blog-posts'>
၅။ေတြ႕ျပီဆိုရင္ေအာက္က Code နဲ႕အစားထိုးေပးလိုက္ပါ။
<!-- navigation -->
<b:include name='nextprev'/>
၆။Save ကိုႏိုပ္လိုက္ပါ။ျပီးပါျပီ။။

မသိေသးတဲ႔မိတ္ေဆြေတြကိုအသိေပးမ်ွေဝေစခ်င္ပါတယ္၊
ဘေလာ့ဂါမိတ္ေဆြအားလံုးကိုအစဥ္ျမဲခ်စ္ခင္ေလးစားလၽွက္ kp3မိသားစု

kp3နည္းပညာ၊၂၂၉၊ဘေလာ့မွာ"Newer Posts" ႏွင့္ "Older Posts"ျဖဳတ္နည္း

ဒါေလးကေတာ့က်ေနာ္တို႕ရဲ့ဘေလာ့မွာ ဘေလာ့မွာ"Newer Posts" ႏွင့္ "Older Posts"ျဖဳတ္ခ်င္တဲ့ ဘေလာ့ မိတ္ေဆြေတြအတြက္ပါ။ လိုအပ္ရင္တဲ့ဘေလာ့မိတ္ေဆြေတြအတြက္ပါ။ ေအာက္မွာလုပ္နည္း ေလးျပထား ပါ တယ္။ ႏွစ္သစ္မွာေပ်ာ္ရြင္ႏိုင္ၾကပါေစလို႕ kp3မိသားစုမွဆုမြန္ေကာင္းေတာင္းလွ်က္။

၁။Dashboard

၂။Layout

၃။Edit HTML

ေအာက္က Code ကိုရွာပါ၊
#blog-pager-newer-link {
float: left;
}

#blog-pager-older-link {
float: right;
}

#blog-pager {
text-align: center;
}
၄။ေတြ႕ျပီဆိုရင္ေအာက္က Code နဲ႕အစားထိုးေပးလိုက္ပါ။
#blog-pager-newer-link {
display: none;
}

#blog-pager-older-link {
display: none;
}

#blog-pager {
display: none;
}
၅။Save ကိုႏိုပ္လိုက္ပါ။ျပီးပါျပီ။။

မသိေသးတဲ႔မိတ္ေဆြေတြကိုအသိေပးမ်ွေဝေစခ်င္ပါတယ္၊
ဘေလာ့ဂါမိတ္ေဆြအားလံုးကိုအစဥ္ျမဲခ်စ္ခင္ေလးစားလၽွက္ kp3မိသားစု

kp3နည္းပညာ၊၂၂၈၊ဘေလာ့မွာလြယ္ကူစြာ Contents ထည့္နည္း

ဒါေလးကေတာ့က်ေနာ္တို့ရဲ႕တင္ထားတဲ့ Post ေတြကိုေန့စြဲအလိုက္ေခါင္းစဥ္ေတြကိုဘဲေပၚ ေအာင္လုပ္နည္း ေလးပါ။ အ၇မ္းကိုလြယ္ကူပါတယ္ဘေလာ့မိတ္ေဆြအားလံုလည္းၾကိဳက္ၾကမယ္လို႕ လည္းေမ်ာ္လင့္ပါတယ္။ ဥပမာၾကည့္လို႕၇ေအာင္လည္း kp3ရဲ႕ Table Contents လင့္ခ္ေပးထားပါတယ္။ ဘေလာ့မိတ္ေဆြ အားလံုး ဒီႏွစ္သႀကၤန္မွာ ကိုယ္စိတ္ႏွာျဖာက်န္းမာခ်မ္းသာ ၾကေစလို႕ဆုမြန္ေကာင္းေတာင္းလွ်က္ kp3-မိသားစု

ဒီမွာ သြားၾကည့္လိုက္ပါ။

၁။Dashboard

၂။Posting

၃။New Post

၄။Edit HTML ကိုသြာျပီးေအာက္က Code ကိုထည့္လိုက္ပါ။
<script style="text/javascript" src="http://abu-farhan.com/script/daftarisibloggerarchive/tocbyarchivemin.js"></script>
<script src="http://kp3family.blogspot.com/feeds/posts/default?max-results=500&alt=json-in-script&callback=loadtoc"></script>

၅။Publish Post ကိုႏိုပ္လိုက္ပါ။ ျပီးပါျပီ။ ။။

မသိေသးတဲ႔မိတ္ေဆြေတြကိုအသိေပးမ်ွေဝေစခ်င္ပါတယ္၊
ဘေလာ့ဂါမိတ္ေဆြအားလံုးကိုအစဥ္ျမဲခ်စ္ခင္ေလးစားလၽွက္ kp3မိသားစု

kp3နည္းပညာ၊၂၂၇၊ဘေလာ့ Post ေအာက္မွာ Comments Bubble ေလးထည့္နည္း

အခုတင္တဲ့ Post ေလးကလည္းအသစ္ေလးလို႕ေျပာလို႕ရပါတယ္။ႏွစ္သစ္လက္ေဆာင္ေပါ့ေနာ္၊ က်ေနာ္တို႕ ဘေလာ့ Post ေအာက္က Labels ေဘးနားမွာComment ဆိုတဲ့စာေၾကာင္းေလးရဲ႕အေပၚမွာသူ႕ရဲ့  Comments Bubble Icon ေလးထပ္ထည့္ေပးခ်င္ရင္ပါ.ေအာက္မွာပံုနဲ႕တကြျပထားေပးပါတယ္။ ပိုျပီးလွသြားသလို
ပါပဲၾကိဳက္တယ္ဆိုရင္ေတာ့ေအာက္မွာထည့္နည္းေလးျပထားပါတယ္။မိမိၾကိဳက္တဲ့ပံုကိုလည္းျပန္ေျပာင္း လို႕လည္းရပါတယ္။




၁။Layout

၂။Edit HTML

၃။Expand Widgets Templateကိုအမွန္ျခစ္ေပးပါ။

ေအာက္က Code ကိုရွာပါ၊
<span class='post-comment-link'>
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:if cond='data:post.allowComments'>
<a class='comment-link' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><b:if cond='data:post.numComments ==
1'>1 <data:top.commentLabel/><b:else/><data:post.numComments/> <data:top.commentLabelPlural/></b:if></a>
</b:if>
</b:if>
ေတြ႕ျပီဆိုရင္ေအာက္က Code ႏွင့္အစားထိုးေပးလိုက္ပါ။။။
<span class='post-comment-link'>
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:if cond='data:post.allowComments'>
<a class='comment-link' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><b:if cond='data:post.numComments ==
1'>1 <data:top.commentLabel/><b:else/><data:post.numComments/> <data:top.commentLabelPlural/></b:if></a><img src='http://i39.tinypic.com/33z5njo.jpg' style='border:0px'/>
</b:if>
</b:if>
</span>
၄။Save Template ကိုႏိုပ္ပါ။ျပီးပါျပီ။။။

ေအာက္ကဟာေလးကပံုရဲ့လင့္ခ္ပါ။ ။
<img src='http://i39.tinypic.com/33z5njo.jpg' style='border:0px'/>

မသိေသးတဲ႔မိတ္ေဆြေတြကိုအသိေပးမ်ွေဝေစခ်င္ပါတယ္၊
ဘေလာ့ဂါမိတ္ေဆြအားလံုးကိုအစဥ္ျမဲခ်စ္ခင္ေလးစားလၽွက္ kp3မိသားစု
...Your html-escaped code goes here...




YOUR CODE HERE


kp3နည္းပညာ၊၂၂၆၊ဘေလာ့မွာ ShareThis Widget ေလးထည့္နည္း

ဒီ Post ေလးကလည္းအရမ္းကိုအသံုး၀င္တယ္လို့ေျပာလို႕ရပါတယ္။ShareThis Widget ေလးကေန၇ာ က်ဥ္းက်ဥ္းေလးနဲ႕ျပည့္စံုပါတယ္၊ SOCIAL BOOKMARKING ေတြထက္ပိုျပီးျပည့္စံုပါတယ္ ShareThis မွာအားလံုး ပါျပီး သားပါဘဲ။မိမိရဲ႕ဘေလာ့မွာထည့္ခ်င္တဲ့ဘေလာ့မိတ္ေဆြေတြအတြက္ပါ။ ShareThis လင့္ခ္ေပးထားပါတယ္ အေကာင့္ေလးျဖည့္ေပးလိုက္ရင္မိမိေပၚေစခ်င္တဲ့အတိုင္းေရြးလို႕လည္းရပါတယ္၊ ရလာတဲ့Code ကို Copy ကူးျပီး Add a Gadget>>HTML/JavaScript Addမွာထည့္ေပးလိုက္ပါ။ ဘေလာ့မိတ္ေဆြအေပါင္းအား ႏွစ္သစ္မွာ ကိုယ္စိတ္ႏွျဖာ က်န္းမာရြင္လန္းၾကပါေစလို႕ kp3မိသားစုမွ ဆုမြန္ ေကာင္းေတာင္းလ်ွက္ က်က္သေရအေပါင္း ႏွင့္ျပည့္စံုေသာႏွစ္သစ္ေလးျဖစ္ပါေစ။ ေအာက္မွာနမူနာပံုေလးနဲ႕ျပထားေပးပါတယ္။

တစ္ခါထည္းထည့္ခ်င္တယ္ဆိုရင္ေအာက္ကက်ေနာ္ေပးထားတဲ့ Code ကိုယူလိုက္ပါ။ ႏွစ္သစ္လက္ေဆာင္ေပါ့ေနာ္။ ။ ။

ကိုယ္ပိုင္လုပ္ခ်င္ရင္ေတာ့ ဒီမွာ သြားယုူလိုက္ပါ။

ဘေလာ့ Post ရဲ့ Labels ေဘးမွာေအာက္ပံုအတိုင္းေပၚမွာျဖစ္ပါတယ္။


 Mouse နဲ႕ေထာက္လိုက္ရင္ေအာက္ပံုအတိုင္းေပၚမွာျဖစ္ပါတယ္။


အထဲမွာပါ၀င္တဲ့ဟာေတြၾကည့္လို႕ရပါတယ္။


<script type="text/javascript">var _sttoolbar = {}</script><script type="text/javascript" src="http://w.sharethis.com/widget/stblogger.js"></script><script type="text/javascript">stBlogger.init("http://w.sharethis.com/button/sharethis.js#publisher=b2f4685d-b9fc-4f6e-a81c-9859ead9fd6f&amp;type=blogger");</script>

မသိေသးတဲ႔မိတ္ေဆြေတြကိုအသိေပးမ်ွေဝေစခ်င္ပါတယ္၊
ဘေလာ့ဂါမိတ္ေဆြအားလံုးကိုအစဥ္ျမဲခ်စ္ခင္ေလးစားလၽွက္ kp3မိသားစု
...Your html-escaped code goes here...




YOUR CODE HERE


ဒီ Post ေလးကလည္းအရမ္းကိုအသံုး၀င္တယ္လို့ေျပာလို႕ရပါတယ္။ShareThis Widget ေလးကေန၇ာက်ဥ္းက်ဥ္း
ေလးနဲ႕ျပည့္စံုပါတယ္၊SOCIAL BOOKMARKING ေတြထက္ပိုျပီးျပည့္စံုပါတယ္ ShareThis မွာအားလံုးပါျပီးသားပါဘဲ။
မိမိရဲ႕ဘေလာ့မွာထည့္ခ်င္တဲ့ဘေလာ့မိတ္ေဆြေတြအတြက္ပါ။ShareThis လင့္ခ္ေပးထားပါတယ္ အေကာင့္ေလးျဖည့္ေပး
လိုက္ရင္မိမိေပၚေစခ်င္တဲ့အတိုင္းေရြးလို႕လည္းရပါတယ္၊ရလာတဲ့Code ကို Copy ကူးျပီး Add a Gadget>>HTML/JavaScript Add
မွာထည့္ေပးလိုက္ပါ။ဘေလာ့မိတ္ေဆြအေပါင္းအားႏွစ္သစ္မွာကိုယ္စိတ္ႏွျဖာက်န္းမာရြင္လန္းၾကပါေစလို႕kp3မိသားစုမွဆုမြန္ေကာင္း
ေတာင္းလ်ွက္က်က္သေရအေပါင္းႏွင့္ျပည့္စံုေသာႏွစ္သစ္ေလးျဖစ္ပါေစ။ေအာက္မွာနမူနာပံုေလးနဲ႕ျပထားေပးပါတယ္။

တစ္ခါထည္းထည့္ခ်င္တယ္ဆိုရင္ေအာက္ကက်ေနာ္ေပးထားတဲ့ Code ကိုယူလိုက္ပါ။ႏွစ္သစ္လက္ေဆာင္ေပါ့ေနာ္။ ။ ။



<script type="text/javascript">var _sttoolbar = {}</script><script type="text/javascript" src="http://w.sharethis.com/widget/stblogger.js"></script><script type="text/javascript">stBlogger.init("http://w.sharethis.com/button/sharethis.js#publisher=b2f4685d-b9fc-4f6e-a81c-9859ead9fd6f&amp;type=blogger");</script>

kp3နည္းပညာ၊၂၂၅၊ဘေလာ့မွာFacebook Profile Badge ေလးထည့္နည္း

ဒါေလးကေတာ့အခုတေလာဘေလာ့မွာေတာ္ေတာ္မ်ားမ်ားကထည့္ထားၾကတာေတြ႕ၾကမယ္ထင္ပါတယ္။ Facebook Profile Badge ေလးပါ က်ေနာ္ Facebook Profile Badge ရဲ့လင့္ခ္ေလးပါ ေပးထားပါတယ္။ Profile Badge တခုထဲမဟုတ္ပါဘူးအျခား Facebook  Badge ေတြလည္းရိွပါတယ္၊ၾကိဳက္တာယူလိုက္ယံုပါဘဲ။ Facebook Profile Badge ကိုသြားယူမယ္ဆိုရင္ပထမ ဒီမွာ ၀င္ပါ။ပံုနဲ႕ျပေပးထားပါတယ္။






မသိေသးတဲ႔မိတ္ေဆြေတြကိုအသိေပးမ်ွေဝေစခ်င္ပါတယ္၊
ဘေလာ့ဂါမိတ္ေဆြအားလံုးကိုအစဥ္ျမဲခ်စ္ခင္ေလးစားလၽွက္ kp3မိသားစု