KP-3 နည္းပညာ

FaceBook Account အခမဲ့ဖြင့္ေပးမည္။

2014-07-14T20:52:00.001-07:00

အခုတေလာဝဘ္ဆိုဒ္တခ်ိဴ့ မွာေဖ့ဘုတ္ဝန္ေဆာင္းမူေပးေနတာေတြ ့ရေတာ့စိတ္မေကာင္းျဖစ္မိပါတယ္။ ဒါေၾကာင့္ျမန္မာျပည္မွာ Facebook Account ဖြင့္တာအခက္ခဲရွိရင္ေတာ့။ျပီးေတာ့ယံုၾကည္မွူအျပည့္ဝရွိရင္ေတာ့ ေကပီသရီးမိသားစုကေန အခမဲ့ဝန္ေဆာင္မွုေပးသြားမွာျဖစ္ပါတယ္လို့သတင္းေကာင္းပါးလိုက္ပါတယ္။မိမိသံုးခ်င္တဲ့Passwordနဲ့႕email ျပီးေတာ့User name ေတြပို ့ေပးလိုက္ပါ။ မွတ္ခ်က္။ဝန္ေဆာင္းမွုအတြက္တစ္ျပားမွေပးစရာမလိုပါ။

အားလံုးမေတြ ့တာၾကာျပီေနေကာင္းၾကလား၊။

2014-07-08T03:19:00.000-07:00

ဘေလာ့မိတ္ေဆြအားလံုးကိုအျမဲသတိယလွ်က္ပါ။ အခ်ိန္၇၇င္ပိုစ္အသစ္ေတြ ျပန္တင္ႏိုင္ေအာင္ ၾကိဳးစား သြားမွာပါ။

Kp3နည္းပညာ၊၄၉ဝ၊ဘေလာ့ Tamplate ေျပာင္းနည္း

2012-05-29T09:34:00.000-07:00

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

ok.က်ေနာ္ Tamplate ရွိတဲ့လင့္ခ္ ဒီမွာ ႏိုပ္လိုက္ပါ။

ဝင္သြားျပီးဆိုရင္မိမိၾကိဳက္တဲ့Tamplate ဆိုက္ဒ္ကိုေရြးျပီးမိမိၾကိဳက္တဲ့Tamplate download ယူလိုက္ပါ။ေအာက္ပံု ဥပမာျပထားေပးပါတယ္.။

၁။

၂။

Desktop မွာသိမ္းထားမယ္ေနာ္မိမိရဲ႕Tamplate ကုဒ္ ok
၃။

ဟုတ္ျပီေနာ္။ဒီထ္ိ ၄။

က်ေနာ္အနီေရာင္းနဲ႕လုပ္ထားေပးတာကမိမိdownloadယူလိုက္တဲ့Tamplate Code ပါ။ Ok
က်ေနာ္ဘေလာ့ထဲမွာစထည့္ရေတာ့မယ္။
၅။

Edit Html ႏိုပ္မယ္။အေပၚပံု

၆။

၇။

ပံုမွာျပထားတဲ့အတိုင္းၾကည့္ပါ.Browse ကို Tamplate အသစ္ထည့္ဖုိ႕ႏိုပ္လိုက္တာ။windowတစ္ခုတက္လာပါ

တယ္။အေပၚပံုေနာ္Desktopကိုႏိုပ္ျပီးDesktopမွာသိမ္းထားတဲ့ပံု-၃နဲ႕ပံု-၄ကTamplateကုဒ္ကိုေရြးေပးလိုက္ပါ။

၈။

Desktopကသိမ္းထားတဲ့Tamplate Code ေရာက္သြားျပီေနာ္။အေပၚပံုမွာျပထားတဲ့Uploadကုိႏိုပ္ေပးလိုက္ပါ။

၉။

အေပၚပံုကိုၾကည့္ပါ.။ျပီးသြားပါျပီ။

၁၀။

မိမိရဲ႕Tamplateကေျပာင္းျပီသြားေၾကာင္းေဖၚျပထားတဲ့အေပၚကပံုအတိုင္းေတြ႕ရမွာျဖစ္ပါတယ္.။

အားလံုးအဆင္ေျပၾကမယ္လို႕ေမ်ာ္လင့္ပါတယ္။.

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

မၾကာမွီေမ်ာ္

2012-05-24T07:27:00.000-07:00

တကယ္လာေတာ့မွာပါ။သီးခံေပးၾကတဲ့အတြက္္ေက်းဇူးျပန္ဆပ္ပါ့မယ္ေနာ္

ေက်းဇူးတင္လႊာနဲ႕တကြအေၾကာင္းၾကားစာ

2012-03-23T03:17:00.000-07:00

TheVoiceWeeklyJournalကkp3family.blogspot.comကိုျပည္သူေတြအတြက္မထင္မွတ္ဘဲဆက္လက္ေဝမွ်ေပး တာကိုအထူးဘဲေက်းဇူးတင္ရွိပါေၾကာင္းနဲ႕KP_3မိသားစုမွဆုမြန္ေကာင္းေတာင္းရင္းေက်းဇူးကမာၻ
က်ေနာ္ဒီေန႕ေျပာခ်င္တာကေတာ့က်ေနာ္ပိုစ္အသစ္မတင္ႏိုင္တာကလည္းတစ္၁ေလာက္ရွိသြားပါျပီ။မွ်ေဝခ်င္တဲ့
နည္းပညာသစ္ေတြမ်ားေပးမယ့္လုံးဝအခ်ိန္မရေသးလို႕အေၾကာင္းၾကားရင္လာျပီးခြင့္တိုင္တဲ့သေဘာပါဘဲ၊။အထူးသျဖင့္
Commentsမွာေမးထားတာေတြမ်ားပါတယ္။အခ်ိန္မရေသးလို႕ျပန္ျပီးမေျဖေပးႏိုင္တာရယ္။တခ်ိဳ႕ေမးထားတာေတာ္
ေတာ္မ်ားမ်ားကလည္းပိုစ္မွာတင္ျပီးသားရွိပါတယ္။ေကာင္းေကာင္းျပန္ရွာေပးၾကပါလို႕လည္းေျပာခ်င္ပါတယ္။ျပီးေတာ့
အခုတေလာအလုပ္မ်ားေနလို႕ေမးခ်င္တာရွိရင္အီးေမးလ္ကေနပို႕ေပးၾကပါလို႕လည္းေျပာခ်င္ပါတယ္။
အီးေမးလ္ကေတာ့အခ်ိန္နည္းနည္းရရင္လည္းက်ေနာ္တို႕ဖုန္းကေနလည္းၾကည့္ျဖစ္တာေပါ့ေနာ္။အခ်ိန္မီွအေၾကာင္းမျပန္ႏိုင္တာ
ကိုလည္းခြင့္လြတ္ေပးၾကပါလို႕ေတာင္းပန္ပါရေစ။ခြင့္လြတ္ၾကမယ္လို႕လည္းေမ်ာ္လင့္ပါတယ္။ဘေလာ့မိတ္ေဆြအား
လံုးကိုထာဝရခ်စ္ခင္ေလးစားလွ်က္ေကပီသရီးမိသားစု

The Voice Weekly Journal

https://sites.google.com/site/thevoiceweeklymyanmar/

မွတ္ခ်က္။ ။ပိုစ္သစ္နည္းပညာသစ္ေတြကို ၄ လပိုင္းလလယ္ေလာက္မွျပန္တင္ႏိုင္မွာျဖစ္ပါတယ္။

မသိေသးတဲ့ဘေလာ့မိတ္ေဆြအသိေပးၾကပါလို႕ေျပာပါေစ။

Kp3နည္းပညာ၊၄၈၉၊ဘေလာ့မွာCss3ကိုသံုးျပီး3DTextထည့္ခ်င္ရင္

2012-02-06T23:56:00.000-08:00

အခုတင္တာေလးကေတာ့မိမိဘေလာ့မွာဘာSoftwareမွသံုးစရာမလိုဘဲ3DTextေလးလုပ္နည္းေလးပါ။Css3ကုဒ္ကိုသံုးတာ
ေပါ့ေနာ္။ကုဒ္ကေတာ့ရွင္းပါတယ္။ေအာက္မွာပံုနဲ႕တကြျပထားေပးပါတယ္။မိမိၾကိဳက္တဲ့စသားေျပာင္းထည့္ေပးလို႕ရပါတယ္။
http://kp3family.blogspot.comေနရာမွာမိမိၾကိဳက္တဲ့လင့္ခ္နဲ႕အစားထိုးေပးလိုက္ပါ။အသစ္ေလးေတြေပါ့ေနာ္အမ်ားၾကီး
ရွိေသတယ္ေနာ္တင္စရာေတြ၊ဘေလာ့မိတ္ေဆြအားလံုးကိုခင္မင္ေလးစားလွ်က္ေကပီသရီးမိသားစု

Sample
Example
Effects
Blogger

Design>>Add a Gadget>>HTML/JavaScript Add ထည့္ေပးလိုက္ပါ။

<style>
#animationWrapper  {
  width:200px;
  font-family:"proxima-nova-1","proxima-nova-2","Helvetica Neue","Arial",sans-serif;
  background:#222;
  padding:40px;
}

/* link which encapsulates SPANs */
#animationWrapper a {
  font-weight: 800;
  text-transform: uppercase;
  font-size: 42px;
  line-height: 0.9em;
  margin-bottom: 10px;
  display: block;
  position: relative;
  color: #E58;
  text-decoration: none
}

/* span and a - "workers" */
#animationWrapper a, #animationWrapper span {
  -webkit-transition: all 0.12s ease-out;
  -moz-transition: all 0.12s ease-out;
  -o-transition: all 0.12s ease-out;
  -ms-transition: all 0.12s ease-out;
  transition: all 0.12s ease-out;
}

#animationWrapper span {
  display: block;
  color: #555;
  text-shadow: 1px 1px black, 2px 2px black, 3px 3px black, 4px 4px black, 5px 5px black, 6px 6px black, 7px 7px black, 8px 8px black;
}

/* special size for the first item */
#animationWrapper .span1 {
  font-size: 56px;
  line-height: 0.8em;
}

#animationWrapper a:hover {
    color: #fff ;
    top: -3px;
    left: -3px;
}

/* all spans become white */
#animationWrapper a:hover span {
  color:#fff;
}

/* different colors for each SPAN */
#animationWrapper a:hover .span1 {
    text-shadow: 1px 1px #58E, 2px 2px #58E, 3px 3px #58E, 4px 4px #58E, 5px 5px #58E, 6px 6px #58E, 7px 7px #58E, 8px 8px #58E, 9px 9px #58E, 10px 10px #58E, 11px 11px #58E;
}

#animationWrapper a:hover .span2 {
    text-shadow: 1px 1px #F90, 2px 2px #F90, 3px 3px #F90, 4px 4px #F90, 5px 5px #F90, 6px 6px #F90, 7px 7px #F90, 8px 8px #F90, 9px 9px #F90, 10px 10px #F90, 11px 11px #F90;
}

#animationWrapper a:hover .span3 {
    text-shadow: 1px 1px #3C7, 2px 2px #3C7, 3px 3px #3C7, 4px 4px #3C7, 5px 5px #3C7, 6px 6px #3C7, 7px 7px #3C7, 8px 8px #3C7, 9px 9px #3C7, 10px 10px #3C7, 11px 11px #3C7;
}

#animationWrapper a:hover .span4 {
    text-shadow: 1px 1px #E58, 2px 2px #E58, 3px 3px #E58, 4px 4px #E58, 5px 5px #E58, 6px 6px #E58, 7px 7px #E58, 8px 8px #E58, 9px 9px #E58, 10px 10px #E58, 11px 11px #E58;
}
</style>
<center>
<div id="animationWrapper">
  <a href="http://kp3family.blogspot.com">
    <span class="span1">Sample</span>
    <span class="span2">Example</span>
    <span class="span3">Effects</span>
    <span class="span4">Blogger</span>
  </a>
</div>
</center>

Kp3နည္းပညာ၊၄၈၈၊ဘေလာ့မွာPopularPostsကိုSlideပံုစံေျပာင္းနည္း

2012-02-06T00:58:00.000-08:00

ဒီေန႕တင္တဲ့နည္းပညာကလည္းတကယ္လည္းလန္းတယ္ဗ်ာအသစ္ေလးပါ၊ဘေလာ့ဂါေလာမွာေခတ္စာေနတဲ့Content
Sliderေတြကိုခက္ခက္ခဲခဲအခ်ိန္ကုန္ျပီးလုပ္စရာမလိုေတာ့ပါဘူး။မိမိရဲ႕PopularPostsေတြကိုSliderပံုစံေျပာင္းလုပ္ၾကရ
ေအာင္ေနာ္၊ကုဒ္ကေတာ့အရမ္းရွင္းပါတယ္၊က်ေနာ္ေအာက္မွာပံုနဲ႕တကြျပထားေပးသလိုကုဒ္ထည့္ရမယ့္ေနရာေတြလည္း
ျပထားေပးပါတယ္။ဘေလာ့မိတ္ေဆြအားလံုးလည္းဝမ္သားမယ္လို႕လည္းေမ်ာ္လင့္သလိုအရမ္းၾကိဳက္ၾကမယ္လို႕လည္း
ထင္ပါတယ္။Htmlကုဒ္ထဲမွာဝင္စရာလည္းမလိုေတာ့ပါဘူးဗ်ာ။အီးေမးလ္မွာေတာင္းဆိုထားတဲဘေလာ့မိတ္ေဆြလည္းရွိပါတယ္။
တစ္ခ်က္ခုတ္ႏွစ္ခ်က္ျပတ္ဆိုသလိုေပါ့ေနာ္။ဘေလာ့မိတ္ေဆြအားလံုးကိုခင္မင္ေလးစားလွ်က္ေကပီသရီးမိသားစု

မွတ္ခ်က္။ ။ပံုကအၾကီးနဲ႕ၾကည့္ခ်င္ရင္ပံုကိုထက္ျပီးClickႏိုပ္လိုက္ပါ။

မိမိရဲ႕ဘေလာ့Add A Gadget က Popular Postsကိုေအာက္ပံုမွာျပထားတဲ့အတိုင္းထည့္ေပးလိုက္ပါ။

ေအာက္ကေပးထားတဲ့ကုဒ္ကလည္းအေပၚမွာထည့္ေပးရမယ့္ေနရာျပထားေပးပါတယ္။

<style>
@charset "utf-8";
/* CSS Document */
.lof-slidecontent, .lof-slidecontent a {
 color:#FFF;
}
.lof-slidecontent a.readmore{
 color:#58B1EA;
 font-size:95%;

}
.lof-slidecontent{
 position:relative;
 overflow:hidden;
 border:#F4F4F4 solid 1px;
}
.lof-slidecontent .preload{
 height:100%;
 width:100%;
 position:absolute;
 top:0;
 left:0;
 z-index:100000;
 text-align:center;
 background:#FFF
}
.lof-slidecontent .preload div{
 height:100%;
 width:100%;
 background:transparent url(http://i879.photobucket.com/albums/ab351/bloggerblogimage/blogger/load-indicator.gif) no-repeat scroll 50% 50%;
}
.lof-main-outer{
 position:relative;
 height:100%;
 width:800px;
 z-index:3px;
 overflow:hidden;
}

/*******************************************************/
.lof-main-item-desc{
 z-index:100px;
 position:absolute;
 bottom:50px;
 left:0px;
 width:350px;
 background:url(http://i879.photobucket.com/albums/ab351/bloggerblogimage/blogger/bg_trans.png);
 height:100px;
 /* filter:0.7(opacity:60) */
 padding:10px;
}
.lof-main-item-desc p{
 margin:0 8px;
 padding:8px 0
}
.lof-main-item-desc h3{
 padding:0;
 margin:0
}
.lof-main-item-desc h2{
 padding:0;
 margin:15px 0 0 0px;
}
.lof-main-item-desc h3 a{
 margin:0;
 background:#C01F25;
 font-size:75%;
 padding:2px 3px;
 font-family:"Trebuchet MS",Trebuchet,Arial,Verdana,sans-serif;
 text-transform:uppercase;
 text-decoration:none
}
.lof-main-item-desc h3 a:hover{

 text-decoration:underline;
}
.lof-main-item-desc h3 i {
 font-size:70%;
}

/* main flash */
ul.lof-main-wapper{
 /* margin-right:auto; */
 overflow:hidden;
 background:transparent url(http://i879.photobucket.com/albums/ab351/bloggerblogimage/blogger/load-indicator.gif) no-repeat scroll 50% 50%;
 padding:0px;
 margin:0   !important;
 position:absolute;
 overflow:hidden;
}

ul.lof-main-wapper li{
 overflow:hidden;
 padding:0px   !important;
 margin:0px;
 float:left;
 position:relative;
}
.lof-opacity  li{
 position:absolute;
 top:0;
 left:0;
 float:inherit;
}
ul.lof-main-wapper li img{
 padding:0px  !important;
}

/* item navigator */
.lof-navigator-wapper {
 position:absolute;
 bottom:10px;
 right:10px;
 background:url(http://i879.photobucket.com/albums/ab351/bloggerblogimage/blogger/transparent_bg.png) repeat;
 padding:5px 0px;
}
.lof-navigator-outer{
 position:relative;
 z-index:100;
 height:180px;
 width:310px;
 overflow:hidden;
 color:#FFF;
 float:left
}
ul.lof-navigator{
 top:0;
 padding:0;
 margin:0;
 position:absolute;
 width:100%;
 background:none !important;
 margin-top: 0 !important;
 margin-left: 0 !important;
 margin-right: 0 !important;
}
ul.lof-navigator li{
 cursor:hand !important;
 cursor:pointer !important;
 list-style:none !important;
 padding:0 !important;
 margin-left:0px !important;
 overflow:hidden !important;
 float:left !important;
 display:block !important;

 text-align:center !important;

}
ul.lof-navigator li img{
 border:#666 solid 3px;
}
ul.lof-navigator li.active img, ul.lof-navigator li:hover img {
 border:#A8A8A8 solid 3px;
}
.lof-navigator-wapper .lof-next,  .lof-navigator-wapper .lof-previous{
 display:block;
 width:22px;
 height:30px;
 color:#FFF;
 cursor:pointer;

}
.lof-navigator-wapper .lof-next {
 float:left;
 text-indent:-999px;
 margin-right:5px;
 background:url(http://i879.photobucket.com/albums/ab351/bloggerblogimage/blogger/arrow-l.png) no-repeat right center;
}
.lof-navigator-wapper .lof-previous {
 float:left;
 text-indent:-999px;
 margin-left:5px;
 background:url(http://i879.photobucket.com/albums/ab351/bloggerblogimage/blogger/arrow-r.png) no-repeat left center;
}
#lofslidecontent45 {width:880px;height:340px;}
.lof-main-outer {width:880px; height:340px;}

.lof-main-wapper img {height:340px !important; width:880px !important}
.lof-navigator-wapper img {height:32px !important; width:80px !important}
</style>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
<script type="text/javascript" src="http://accordion-for-blogger.googlecode.com/svn/trunk/jquery.easing.js"></script>
<script language="javascript" type="text/javascript" src="http://accordion-for-blogger.googlecode.com/svn/trunk/scriptlofblogv2.js"></script>
<script type="text/javascript">
 $(document).ready( function(){
  var buttons = { previous:$('#lofslidecontent45 .lof-previous') ,
      next:$('#lofslidecontent45 .lof-next') };

  $obj = $('#lofslidecontent45').lofJSidernews( { interval : 4000,
            direction  : 'opacitys',
             easing   : 'easeOutBounce',
            duration  : 1200,
            auto    : true,
            maxItemDisplay  : 10,
            navPosition     : 'horizontal', // horizontal
            navigatorHeight : 32,
            navigatorWidth  : 80,
            mainWidth:880,
            buttons   : buttons} );
 });
</script>

Kp3နည္းပညာ၊၄၈၇၊ဘေလာ့မွာ SCM MP3Player သစ္ေလးသံုးခ်င္ရင္

2012-02-04T05:55:00.000-08:00

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

ဒီမွာ သြားျပီးၾကိဳက္တဲ့အေရာင္ကိုေရြးၾကေတာ့ေဟ့kp3ကမလိုက္ေတာ့ဘူးေနာ္။မအားလို႕ဟီ...........။.။

Kp3နည္းပညာ၊၄၈၆၊ဘေလာ့မွာMicrosoftStyleTranslateသံုးခ်င္ရင္

2012-02-03T22:49:00.000-08:00

ဒီေန႕တင္တာေလးကေတာ့အဂၤလိပ္လိုဘေလာ့ေရးတဲ့သူေတြအတြက္Microsoftရဲ႕TranslateWidgetေလးပါ။က်ေနာ္ေအာက္
မွာျပထားသလိုပါဘဲ။ကုဒ္နဲ႕တကြေပးထားပါတယ္။လွလည္းလွတယ္ေနာ္ၾကိဳက္ၾကမယ္လို႕ေမ်ာ္လင့္ပါတယ္။ဘေလာ့မိတ္ေဆြ
အားလံုးကိုခင္မင္ေလးစားလွ်က္ေကပီသရီးမိသားစု
ေအာက္မွာထည့္ေပးရမယ့္ကုဒ္ေနရာကိုကပံုနဲ႕တကြျပထားပါတယ္။

<div id="MicrosoftTranslatorWidget" style="width: 200px; min-height: 83px; border-color: #3A5770; background-color: #78ADD0;"><noscript><a href="http://www.microsofttranslator.com/bv.aspx?a=http%3a%2f%2fkp3family.blogspot.com%2f">Terjemahkan laman ini</a><br />Diberdayakan oleh <a href="http://www.microsofttranslator.com">MicrosoftÂ® Translator</a></noscript></div> <script type="text/javascript"> /* <![CDATA[ */ setTimeout(function() { var s = document.createElement("script"); s.type = "text/javascript"; s.charset = "UTF-8"; s.src = ((location && location.href && location.href.indexOf('https') == 0) ? "https://ssl.microsofttranslator.com" : "http://www.microsofttranslator.com" ) + "/ajax/v2/widget.aspx?mode=manual&from=id&layout=ts"; var p = document.getElementsByTagName('head')[0] || document.documentElement; p.insertBefore(s, p.firstChild); }, 0); /* ]]> */ </script>

မွတ္ခ်က္။ ။kp3family.blogspot.comေနရာမွာမိမိဘေလာ့လင့္ခ္နဲ႕အစားထိုးေပးပါ။

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

Kp3နည္းပညာ၊၄၈၅၊AUniqueStyleDropDownBarNavigationMenuသံုးခ်င္ရင္

2012-02-02T05:08:00.000-08:00

အခ်ိန္ရတုန္း၊AUniqueStyleDropDownBarNavigationMenuေလးတင္ေပးလိုက္ပါ။ဒီMenuကသံုးတဲ့သူေတြအရမ္းနည္းပါ
တယ္။မရွိသေလာက္ပါဘဲ၊Menuထဲမွာkp3အၾကိဳက္ဆံုးလို႕လည္းေျပာရင္ရပါတယ္။က်ေနာ္ေအာက္မွာသြားၾကည့္လို႕ရေအာင္
လည္းDEMOလင့္ခ္ေလးေပးသလိုပံုနဲ႕တကြျပထားေပးပါတယ္။ၾကိဳက္ၾကမယ္လို႕လည္းေမ်ာ္လင့္ပါတယ္။Menuမတင္တာလည္း
ၾကာျပီဆိုေတာ့ဘေလာ့မိတ္ေဆြအားလံုးကိုခင္မင္ေလးစားျမဲေကပီသရီးမိသားစု
ဒီမွာသြားၾကည့္လိုက္ပါ။
မွတ္ခ်က္။ ။ပံုကိုၾကည့္ရတာအဆင္မေျပရင္Clickထပ္ႏိုပ္ေပးလိုက္ပါ။

၁။ေအာက္ကကုဒ္ကိုရွာပါ။

]]></b:skin>

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

.nav {
height:35px;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEilmqmEO7nttHVuu9xtVEecQm-AOvUV9T_P1lwva-oVo4DROBxzjz2gClb8cA5-e66uBF7lfsTaUHeglYhBEWzt0sIJv3Y2vYT8TsHa6yczbj5xyaBT3jiIFImVYLXgnVeTOZXr8zjOq79e/s1600/bg.gif) repeat-x;
position:relative;
font-family:arial, verdana, sans-serif;
font-size:11px;
width:100%;
z-index:100;
margin:0;
padding:0;
}

.nav .table {
display:table;
margin:0 auto;
}

.nav .select,
.nav .current {
margin:0;
padding:0;
list-style:none;
display:table-cell;
white-space:nowrap;
}

.nav li {
margin:0;
padding:0;
height:auto;
float:left;
}

.nav .select a {
display:block;
height:35px;
float:left;
font-weight:bold;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEilmqmEO7nttHVuu9xtVEecQm-AOvUV9T_P1lwva-oVo4DROBxzjz2gClb8cA5-e66uBF7lfsTaUHeglYhBEWzt0sIJv3Y2vYT8TsHa6yczbj5xyaBT3jiIFImVYLXgnVeTOZXr8zjOq79e/s1600/bg.gif);
padding:0 30px 0 30px;
text-decoration:none;
line-height:35px;
white-space:nowrap;
color:#2b3238;
}


.nav .select a:hover,
.nav .select li:hover a {
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgM4sJfw4H61oM5dzqS22f7AjmzvMxncsU3h1mz2ZUO_-KwKQ9DpmhRC0bDuDUqd_fCA3EjuxO8DUU2YTyS0t-sBJx9Gv0lf98V0mkhbRxfBINs3AcJJ2g29ZtKEUZsDHyVICQDPNuMKVUU/s1600/hover.gif);
padding:0 0 0 15px;
cursor:pointer;
color:#2b3238;
}

.nav .select a b{
font-weight:bold;
}

.nav .select a:hover b,
.nav .select li:hover a b {
display:block;
float:left;
padding:0 30px 0 15px;
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgM4sJfw4H61oM5dzqS22f7AjmzvMxncsU3h1mz2ZUO_-KwKQ9DpmhRC0bDuDUqd_fCA3EjuxO8DUU2YTyS0t-sBJx9Gv0lf98V0mkhbRxfBINs3AcJJ2g29ZtKEUZsDHyVICQDPNuMKVUU/s1600/hover.gif) right top;
cursor:pointer;
}

.nav .select_sub {
display:none;
}

/* IE6 only */
.nav table {
border-collapse:collapse;
margin:-1px;
font-size:1em;
width:0;
height:0;
}

.nav .sub {
display:table;
margin:0 auto;
padding:0;
list-style:none;
}

.nav .sub_active .current_sub a,
.nav .sub_active a:hover {
background:transparent;
color:#2b3238;
}

.nav .select :hover .select_sub,
.nav .current .show {
display:block;
position:absolute;
width:100%;
top:35px;
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgb2FCuj6DZrwmJl-2bi6OtJmG5nFn9c00bZHiAvprv6O54dzxZWjM7G7P9HHFSZW7jV9bnRmUk4qy_lVrx5UXcrzqL9ul_4OiX_twHa6z66RrbqlI-_QnlJhiD0WkAKJzn2fKq-uIc-7if/s1600/back.gif);
padding:0;
z-index:100;
left:0;
text-align:center;
}

.nav .current .show {
z-index:10;
}

.nav .select :hover .sub li a,
.nav .current .show .sub li a {
display:block;
float:left;
background:transparent;
padding:0 10px 0 10px;
margin:0;
white-space:nowrap;
border:0;
color:#2b3238;
}

.nav .current .sub li.sub_show a {
color:#2b3238;
cursor:default;
}

.nav .select .sub li a {
font-weight:normal;
}

.nav .select :hover .sub li a:hover,
.nav .current .sub li a:hover {
visibility:visible;
color:#73a0d2;
}

၃။ေအာက္ကကုဒ္ကိုျပထားတဲ့ပံုအတိုင္းထည့္ေပးလို္က္ပါ။

<div class="nav">
<div class="table">

<ul class="select"><li><a href="လင့္ခ္ထည့္ရန္#"><b>kp3နည္းပညာ</b></a></li></ul>

<ul class="select"><li><a href="လင့္ခ္ထည့္ရန္#"><b>kp3နည္းပညာ</b></a>
<div class="select_sub">
<ul class="sub">
<li><a href="လင့္ခ္ထည့္ရန္#">kp3နည္းပညာ</a></li>
<li><a href="လင့္ခ္ထည့္ရန္#">kp3နည္းပညာ</a></li>
<li><a href="လင့္ခ္ထည့္ရန္#">kp3နည္းပညာ</a></li>

<li><a href="လင့္ခ္ထည့္ရန္#">kp3နည္းပညာ</a></li>
<li><a href="လင့္ခ္ထည့္ရန္#">kp3နည္းပညာ</a></li>
</ul>
</div>
</li>
</ul>

<ul class="select"><li><a href="လင့္ခ္ထည့္ရန္#"><b>kp3နည္းပညာ</b></a>
<div class="select_sub">
<ul class="sub">

<li><a href="လင့္ခ္ထည့္ရန္#">kp3နည္းပညာ</a></li>
<li><a href="လင့္ခ္ထည့္ရန္#">kp3နည္းပညာ</a></li>
<li><a href="လင့္ခ္ထည့္ရန္#">kp3နည္းပညာ</a></li>
<li><a href="လင့္ခ္ထည့္ရန္#">kp3နည္းပညာ</a></li>
<li><a href="လင့္ခ္ထည့္ရန္#">kp3နည္းပညာ</a></li>
</ul>

</div>
</li>
</ul>


<ul class="select"><li><a href="လင့္ခ္ထည့္ရန္#"><b>kp3နည္းပညာ</b></a>
<div class="select_sub">
<ul class="sub">
<li><a href="လင့္ခ္ထည့္ရန္#">kp3နည္းပညာ</a></li>
<li><a href="လင့္ခ္ထည့္ရန္#">kp3နည္းပညာ</a></li>
<li><a href="လင့္ခ္ထည့္ရန္#">kp3နည္းပညာ</a></li>

<li><a href="လင့္ခ္ထည့္ရန္#">kp3နည္းပညာ</a></li>
<li><a href="လင့္ခ္ထည့္ရန္#">kp3နည္းပညာ</a></li>
</ul>
</div>
</li>
</ul>


<ul class="select"><li><a href="လင့္ခ္ထည့္ရန္#"><b>kp3နည္းပညာ</b></a>
<div class="select_sub">
<ul class="sub">

<li><a href="လင့္ခ္ထည့္ရန္#">kp3နည္းပညာ</a></li>
<li><a href="လင့္ခ္ထည့္ရန္#">kp3နည္းပညာ</a></li>
<li><a href="လင့္ခ္ထည့္ရန္#">kp3နည္းပညာ</a></li>
<li><a href="လင့္ခ္ထည့္ရန္#">kp3နည္းပညာ</a></li>
<li><a href="လင့္ခ္ထည့္ရန္#">kp3နည္းပညာ</a></li>
</ul>

</div>
</li>
</ul>

</div>
</div>

က်ေနာ္အေပၚကကုဒ္မွာေရးထားသလိုလင့္ခ္ေတြကိုထည့္ျပီးရင္kp3နည္းပညာေနရာေတြမွာမိမိရဲ႕လင့္ခ္အမည္ကိုေရးေပးပါ။

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

Kp3နည္းပညာ၊၄၈၄၊ဘေလာ့ေျခရင္းကPowered by Bloggerဆိုတာေလးအစားထိုးနည္း

2012-01-30T04:15:00.000-08:00

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

ေအာက္မွာပံုနဲ႕တကြျပထားေပးပါတယ္။အီးေမးလ္မွာေတာင္းဆိုထားတဲ့ဘေလာ့မိတ္ေဆြေတြလည္းဒီမွာၾကည့္လိုက္ၾကေပါ့ေနာ္။
မွတ္ခ်က္။ ။ပံုကိုၾကည့္ရတာအဆင္မေျပရင္Clickထပ္ႏိုပ္ေပးလိုက္ပါ။
ပံု-၁

ပံု-၂

ပံု-၃

ပံု-၄

Kp3နည္းပညာ၊၄၈၃၊အေကာင္းဆံုးMediaPlayer(၅)ခု

2012-01-27T00:27:00.000-08:00

အလုပ္ေတြမ်ားေနလို႕ပိုစ္ေတြမတင္နိုင္တာကိုနားလည္ေပးၾကတဲ့က်ေနာ့္ဘေလာ့မိတ္ေဆြအားလံုးကိုအထူးဘဲေက်းဇူးတင္
ပါတယ္။Softwarေတြလည္းမတင္ျဖစ္တာၾကာေတာ့ဒီကေန႕MediaPlayerအတြက္ေကာင္းဆံုးျဖစ္တဲ့Formatအားလံုးကိုလည္း ၾကည့္ႏိုင္တဲ့Software(၅)ခုရဲ႕မူရင္းဆိုက္ဒ္လင့္ခ္ေတြကိုတင္ေပးလိုက္ပါ။မိမိၾကိဳက္တာကိုDownloadသြားယူလိုက္ပါ။
ဘေလာ့မိတ္ေဆြအားလံုးကိုခင္မင္ေလးစားလွ်က္ေကပီသရီးမိသားစု

၁။GOM Media Player

၂။DivX Plus Player

၃။Kantaris Media Player

၄။KPlayer

၅။VLC Media Player

Kp3နည္းပညာ၊၄၈၂၊Gmailပို႕ရင္ေနာက္ခံအေ၇ာင္ပါေအာင္လုပ္နည္း

2011-12-30T10:28:00.000-08:00

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

၁။

၂။

၃။

Kp3နည္းပညာ၊၄၈၁၊ဘေလာ့ဆိုက္ဘားနဲ႕ပိုစ္Bodyကိုဘယ္ညာေျပာင္းနည္း

2011-12-29T09:33:00.000-08:00

က်ေနာ္ဒီေန႕ထပ္တင္ေပးတာကလည္းဘေလာ့မွာနည္းပညာအသစ္မဟုတ္ေပမယ့္သိျပီးသားသူေတြမ်ားမယ္မထင္ပါဘူး။
ဒါေၾကာင့္က်ေနာ္ဘေလာ့မိတ္ေဆြေတြအတြက္မိမိဘေလာ့ဆိုက္ဘားကိုဘယ္ညာထားခ်င္တဲ့ေနရာထားလို႕ရေအာင္တင္ေပး
လိုက္ပါ။ဘေလာ့ပိုစ္အသစ္မတင္ႏိုင္တာ၂လဝန္းက်င္မွာဒီေန႕တင္တာေလးကေတာ့ဒုတိယေျမာက္ပိုစ္ေပါ့ေနာ္။ပထမပိုစ္က
ေတာ့ဘေလာ့မိတ္ေဆြေတြျမင္ေတြ႕ၾကတဲ့အတိုင္းနည္းပညာသစ္ျဖစ္တဲ့BloggerPageNavigationWidgetGeneratorေလးပါ။
kp3နည္းပညာ၊၄၈ဝ။မွာရွိပါတယ္။ေအာက္မွာလုပ္နည္းနဲ႕တကြကုဒ္ေပးထားပါတယ္။ဘေလာ့မိတ္ေဆြအားလံုးကိုခင္မင္ေလး
စားလွ်က္ေကပီသရီးမိသားစု

၁။Blogger > Design > Edit HTMLကိုသြားပါ။
၂။TemplateကိုBackupလုပ္ေပးရန္မေမ့ၾကပါနဲ႕
၃။ေအာက္ကကုဒ္ကိုရွာပါ။

#main-wrapper { float: left; width: 600px; margin: 0; padding: 0 0 20px; }

ေတြ႕ျပီဆိုရင္အေပၚကုဒ္က float: left;ကို float: right;အျဖစ္ေျပာင္းေပးလိုက္ပါ။
က်ေနာ္တို႕ပိုစ္Bodyကိုေနရာေျပာင္းလို႕ျပီးသြားရင္sidebarကိုလည္းျပန္ေျပာင္းေပးဖို႕လိုပါတယ္။

၄။ေအာက္ကကုဒ္ကိုထပ္ရွာပါ။ထင္သေလာက္မခက္ခဲပါဘူး၊

#sidebar-wrapper { float: right; width: 320px; margin: 0; padding: 0 0 10px; display: inline; }

ေတြ႕ျပီဆိုရင္အေပၚကအတိုင္းfloat:right;ကိုfloat:left;ဆိုျပီးျပန္ေျပာင္းေပးလိုက္ပါ။အဆင္ေျပၾကပါေစလို႕ေျပာပါရေစ။
ေရာက္လာမယ့္ႏွစ္သစ္မွာကိုယ္စိတ္ႏွျဖာက်န္မားရြင္းလန္းၾကပါေစလို႕ေကပီသရီးမိသားစုမွာဘေလာ့မိတ္ေဆြအားလံုးအတြက္
ဆုမြန္ေကာင္းေတာင္းလွ်က္ပါ။

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

Kp3နည္းပညာ၊၄၈ဝ၊ဘေလာ့Page Navigation Widget Generatorသံုးခ်င္ရင္

2011-12-27T09:32:00.000-08:00

ဘေလာ့ပိုစ္အသစ္ေတြတင္စရာအမ်ားၾကီးရွိေပမယ့္အခ်ိန္မရေသးလို႕မတင္ႏိုင္တာကိုခြင့္လြတ္နားလည္ေပးၾကတဲ့
က်ေနာ္ဘေလာ့မိတ္ေဆြအားလံုးကိုေကပီသရီးမိသားစုျပန္လာျပီဆိုတဲ့သတင္းေကာင္းပါးရင္ဘေလာ့မိတ္ေဆြအားလံုးကို
ေရာက္လာမယ့္ႏွစ္သစ္မွာနည္းပညာေတြပိုျပီးတိုးပြားႏိုင္ၾကပါေစလို႕ဆုမြန္ေကာင္းေတာင္းရင္က်ေနာ္ႏွစ္သစ္လက္ေဆာင္
အျဖစ္နည္းပညာသစ္ျဖစ္တဲ့BloggerPageNavigationWidgetGeneratorကိုတင္ေပးလိုက္ပါတယ္။အားလံုးၾကိဳက္ၾကမယ္
လို႕ေမ်ာ္လင့္ပါတယ္။မူရင္းလင့္ခ္လည္းရွိပါတယ္၊ကိုယ္တိုင္သြားယူလို႕လည္းရပါတယ္။ဘေလာ့မိတ္ေဆြအားလံုးကိုခင္မင္
ေလးစားလွ်က္ေကပီသရီးမိသားစု
ေအာက္မွာမိမိၾကိဳက္တဲ့အေရာင္းကိုေရြးလိုက္ပါ။ရွယ္ဘဲေနာ္

မိမိၾကိဳက္တဲ့ပံုစံေရြးပါ http://kp3family.blogspot.com ဘေလာ့မိတ္ေဆြအားလံုးကိုခ်စ္ ခင္ေလးစားျမဲKP-3family

အေနာက္စာမ်က္ႏွာသို႕
အေရွ႕စာမ်က္ႏွာသို႕
စုစုေပါင္းပိုစ္အေရအတြက္ေရြးရန္
ေရွ႕နဲ႕အေနာက္မွာမိမိေပၚေစခ်င္တဲ့ပိုစ္အေရအတြက္

Kp3နည္းပညာ၊၄၇၉၊ဘေလာ့ဘေလာ့Text Resizing Widget သံုးခ်င္ရင္

2011-10-18T03:26:00.000-07:00

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

ေအာက္ကပံုကိုၾကည့္ပါ။ဒီမွာသြားျပီးClickသြားလုပ္လိုက္ပါ။

<span style="padding: 2px 5px; background-color: #DDD; float: center;"><a href="javascript:void(0);" onclick="resizeText(1)" id="plustext">စလံုးအၾကီးေျပာင္းရန္</a> | <a href="javascript:void(0);" onclick="resizeText(-1)" id="minustext">စလံုးအေသးေျပာင္းရန္</a></span>
<div id="wrap-content">မိမိၾကိဳက္တဲ့စာသားကိုဒီမွာေရးေပးလိုက္ပါ။</div>
<script type="text/javascript"> var c = document.getElementById("wrap-content"); function resizeText(multiplier) { if (c.style.fontSize == "") { c.style.fontSize = "1.0em"; } c.style.fontSize = parseFloat(c.style.fontSize) + (multiplier * 0.2) + "em"; } </script> 
<script charset='utf-8' type='text/javascript'>
$(&quot;plustext&quot;).addEvent(&quot;click&quot;, function() {resizeText(1);});
$(&quot;minustext&quot;).addEvent(&quot;click&quot;, function() {resizeText(-1);});
</script>

Kp3နည္းပညာ၊၄၇၈၊ဘေလာ့CommentsFormကိုအလယ္မွာထားနည္း

2011-10-09T04:47:00.000-07:00

အလုပ္ေတြအ၇မ္းမ်ားေနလို႕နည္းပညာသစ္ေလးေတြမွ်ေဝခ်င္ေပမယ့္အခ်ိန္မ၇ႏိုင္တာကိုနားလည္ေပးၾကတဲ့က်ေနာ္ဘေလာ့မိတ္ေဆြအားလံုးကိုအထူးေက်းဇူးတင္ေၾကာင္းအ၇င္
ဆံုးေျပာခ်င္ပါတယ္။ေနာက္တစ္ခုက်ေနာ္ထပ္ျပီးေတာင္းပန္ခ်င္တာကေတာ့က်ေနာ္ကိုေမးလ္မွာျဖစ္ျဖစ္Commentsမွာေမးတာေလးေတြကိုက်ေနာ္တခ်ို႕ျပန္ေျဖသလိုမေျဖေသးတာေတြ
လည္းမ်ားမယ္ထင္ပါတယ္။အခ်ိန္ကလံုးဝမ၇လို႕ပါခြင့္လြတ္ေပးၾကမယ္လို႕က်ေနာ္ေမ်ာ္လင့္ပါတယ္။ဒါေတြကိုေတာင္းပန္၇င္းနဲ႕က်ေနာ္နည္းပညာသစ္ေလးျဖစ္တဲ့မိမိ၇ဲ႕ဘေလာ့
CommentsFormကိုဘေလာ့၇ဲ႕အလယ္တည့္တည့္မွာထားခ်င္တဲ့ဘေလာ့မိတ္ေဆြေတြအတြက္အလြယ္ကူဆံုးလုပ္နည္းျဖစ္သလိုအ၇မ္းကို၇ွင္းလင္းတဲ့ကုတ္ေလးေအာက္မွာပံုနဲ႕တကြနမူနာ
ျပထားေပးပါတယ္။ဘေလာ့တစ္ခုလံုးကိုပိုျပီးလွပျပည့္စံုသြားေစတဲ့Codeေလးလို႕ေျပာ၇င္လည္း၇ပါတယ္။ဘေလာ့မိတ္ေဆြအားလံုးကိုခင္မင္ေလးစားလွ်က္kp3မိသားစု

ဒီမွာသြားၾကည့္ခ်င္၇င္၇ပါတယ္။

ေအာက္ကပံုကိုျပန္ၾကည့္ပါ

၁။Design>>>Edit Html>>>ေအာက္ကCodeကို၇ွာပါ။

]]></b:skin>

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

.comment-form{
margin-right: auto;
margin-left: auto;
}

Save Tamplateကိုႏိုပ္လိုက္ပါ။မိမိ၇ဲ႕ကြန္မင့္Formေန၇ာကိုျပန္ၾကည့္လိုက္ပါ။

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

ဘေလာ့မိတ္ေဆြအားလံုးကိုခ်စ္ခင္ေလးစားျမဲေကပီသ၇ီးမိသားစု

2011-08-21T03:23:00.000-07:00

ေကပီသ၇ီးမိသားစုအလုပ္မ်ားေနလို႕နည္းပညာသစ္ေလးေတြဝမွ်ခ်င္ေပမယ့္အခ်ိန္မ၇ႏိုင္တာကိုနားလည္းေပးတဲ့ဘေလာ့မိတ္ေဆြအားလံုးကို
ေက်းဇူးအထူးတင္ပါတယ္။.မၾကာခင္မွာအ၇င္အတိုင္းဘဲနည္းပညာသစ္ေလးေတြ ျပန္တင္ႏိုင္ေတာ့မွာပါလို႕အသိေပး၇င္ဘေလာ့မိတ္ေဆြ
အားလံုးကိုအစဥ္ျမဲခ်စ္ခင္ေလးစားလွ်က္ေကပီသ၇ီးမိသားစု

Kp3နည္းပညာ၊၄၇၇၊ဘေလာ့ပိုစ္မွာDemoလင့္ခ္ေတြကိုလင့္ခ္ထည့္နည္း

2011-07-29T05:26:00.000-07:00

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

၁။

၂။

၃။

၄။

Kp3နည္းပညာ၊၄၇၆၊ဘေလာ့မွာဇယားကြက္ေလးေတြလြယ္ကူစြာသံုးခ်င္ရင္

2011-07-28T05:28:00.000-07:00

အခုတင္တဲ့ပိုစ္ေလးကလဲဘေလာ့မိတ္ေဆြေတြအတြက္အသံုးဝင္မယ့္Htmlကုဒ္အခ်ိဳ႕ပါ၊မိမိရဲ႕ဘေလာ့ပိုစ္သို႕မဟုတ္ဆိုက္ဘားမွာTablesဇယားကြက္
ေလးကိုသံုးျပီးအမည္စရင္းတို႕ဘာညာေတြေတြကိုတည္ေဆာက္ခ်င္တဲ့ဘေလာ့မိတ္ေဆြေတြအတြက္ပါ။ဘေလာ့ေရးတဲ့သူေတြအတြက္အသံုးဝင္တဲ့ကုဒ္
ဆိုရင္လည္းမွားမယ္မထင္ပါတယ္၊သိထားေတာ့လိုအပ္ရင္ရွာစရာမလိုေတာ့ဘူးေပါ့ေနာ္။ေအာက္မွာကုဒ္ေတြနဲ႕တကြဇယားပံုေလးေတြေပးထားပါတယ္။
ဘေလာ့မိတ္ေဆြအားလံုးကိုခင္မင္ေလးစားလွ်က္ေကပီသရီးမိသားစု

၁။ေအာက္မွာျပထားေပးပါတယ္။

kp3 1, kp3 1	kp3 1, kp3 2
kp3 2, kp3 1	kp3 2, kp3 2
kp3 3, cell 1	row 3, cell 3

ေအာက္ကကုဒ္

<table border="1">
    <tr>
    <td>kp3 1, kp3 1</td>
    <td>kp3 1, kp3 2</td>
    </tr>
    <tr>
    <td>kp3 2, kp3 1</td>
    <td>kp3 2, kp3 2</td>
    </tr>
    <tr>
    <td>kp3 3, kp3 1</td>
    <td>kp3 3, kp3 3</td>
    </tr>
    </table>

၂။
<tr> - table row

<td> - table cell
----------

kp3 2, kp3 1
kp3 2, kp3 2
kp3 2, kp3 3
kp3 2, kp3 4
kp3 2, kp3 5

ေအာက္ကကုဒ္

<tr>
<td>kp3 2, kp3 1</td>
<td>kp3 2, kp3 2</td>
<td>kp3 2, kp3 3</td>
<td>kp3 2, kp3 4</td>
<td>kp3 2, kp3 5</td>
</tr>

၃။Table Headers<th> </th>

နာမည္	ဖုန္းနံပါတ္
ေကပီသရီးအဖြဲ႕	ဝ၁၆-၆ဝဝ၅၇၆၂

ေအာက္ကကုဒ္

<table border="1">
    <tr>
    <th>နာမည္</th>
    <th>ဖုန္းနံပါတ္</th>
    </tr>
    <tr>
    <td>ေကပီသရီးအဖြဲ႕</td>
    <td>ဝ၁၆-၆ဝဝ၅၇၆၂</td>
    </tr>
    </table>

၄။Vertical header ပံုစံ

နာမည္	ေကပီသရီးအဖြဲ႕
ဖုန္းနံပါတ္	ဝ၁၆-၆၀၀၅၇၆၂

ေအာက္ကကုဒ္

<table border="1">
    <tr>
    <th>နာမည္:</th>
    <td>ေကပီသရီးအဖြဲ႕</td>
    </tr>
    <tr>
    <th>ဖုန္းနံပါတ္</th>
    <td>ဝ၁၆-၆၀၀၅၇၆၂</td>
    </tr>
    </table>

၅။Columns ၂ခု

နာမည္	ဖုန္းနံပါတ္
ေကပီသရီးအဖြဲ႕	ဝ၁၆-၆၀၀၅၇၆၂	ဝ၁၆-၆၇၈၀၉၁၂

ေအာက္ကကုဒ္

<table border="1">
    <tr>
    <th>နာမည္</th>
    <th colspan="2">ဖုန္းနံပါတ္</th>
    </tr>
    <tr>
    <td>ေကပီးသ၇ီးအဖြဲ႕</td>
    <td>ဝ၁၆-၆၀၀၅၇၆၂</td>
    <td>ဝ၁၆-၆၇၈၀၉၁၂</td>
    </tr>
    </table>

၆။Rows ၂ခု

နာမည္	ေကပီသရီအဖြဲ႕
ဖုန္းနံပါတ္	ဝ၁၆-၆၀၀၅၇၆၂
ဖုန္းနံပါတ္	ဝ၁၆-၆၇၈၀၉၁၂

ေအာက္ကကုဒ္

<table border="1">
<tr>
<th>နာမည္:</th>
<td>ေကပီသရီးအဖြဲ႕</td>
</tr>
<tr>
<th rowspan="2">ဖုန္းနံပါတ္</th>
<td>ဝ၁၆-၆၀၀၅၇၆၂</td>
</tr>
<tr>
<td>ဝ၁၆-၆၇၈၀၉၁၂</td>
</tr>
</table>

၇။

နာမည္	အသက္
ေကပီသရီး	၉၉

ေအာက္ကကုဒ္

<table border="1" cellpadding="10">
    <tr>
    <th>နာမည္</th>
    <th>အသက္</th>
    </tr>
    <tr>
    <td>ေကပီသရီး</td>
    <td>၉၉</td>
    </tr>
    </table>

၈။

နာမည္	အသက္
ေကပီသရီး	၉၉

ေအာက္ကကုဒ္

<table border="1" cellspacing="10">
    <tr>
    <th>နာမည္</th>
    <th>အသက္</th>
    </tr>
    <tr>
    <td>ေကပီသရီး</td>
    <td>၉၉</td>
    </tr>
    </table>

၉။ေနာက္ခံပံုအေရာင္းသို႕မဟုတ္ပံုသံုးခ်င္ရင္

နာမည္	အသက္
ေကပီသရီး	၉၉

ေအာက္ကကုဒ္

<table border="1" style="background-color:yellow">
    <tr>
    <th>နာမည္</th>
    <th>အသက္</th>
    </tr>
    <tr>
    <td>ေကပီသ၇ီး</td>
    <td>၉၉</td>
    </tr>
    </table>

၁၀။ကေတာ့ေနာက္ခံပံုထည့္နည္းေလးပါ.။နံပါတ္၉နဲ႕ႏွိုင္းယဥ္ၾကည့္ရင္သိသြားမယ္ထင္တယ္လြယ္ကူပါတယ္။

<table border="1" style="background-image:url('IMAGE LINK')">
    <tr>
    <th>Name</th>
    <th>Rank</th>
    </tr>
    <tr>
    <td>James</td>
    <td>701</td>
    </tr>

Kp3နည္းပညာ၊၄၇၅၊ဘေလာ့မွာFacebookStyleDropDownMenuသံုးခ်င္ရင္

2011-07-21T06:37:00.000-07:00

က်ေနာ္Menuေကာင္းေလးထပ္တင္ေပးလိုက္ပါတယ္။နည္းပညာသစ္ျဖစ္တဲ့မိမိရဲ႕ဘေလာ့ပိုစ္ကိုPasswordနဲ႕ေသာ့ခတ္နည္းကိုလည္းမနက္ကတင္တဲ့
Kp3နည္းပညာ၊၄၇၄၊မွာရွိပါတယ္။အခုတင္တဲ့Menuကေတာ့FacebookStyleDropDownMenuေလးပါသူမ်ားရဲ႕Menuနဲ႕မတူေအာင္သံုးခ်င္တဲ့ဘေလာ့
မိတ္ေဆြေတြအတြက္ပါ။ထံုးစံတိုင္းသြားၾကည့္လို႕ရေအာင္DEMOလင့္ခ္ေပးထားပါတယ္။ေအာက္မွာထည့္နည္းနဲ႕တကြMenuCodeေလးေပးထားပါတယ္။
ဘေလာ့မိတ္ေဆြအားလံုးကိုခင္မင္ေလးစားျမဲေကပီသရီးမိသားစု

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

၂။Add a Gadgetကိုသြားျပီး HTML/JavaScript မွာေအာက္ကကုဒ္ကိုထည့္္ေပးလိုက္ပါ။

<style>
    #mbtnavbar {
        background: #3B5998;
        width: 100%;
    
        color: #FFF;
            margin: 10px 0;
            padding: 0;
            position: relative;
            border-top:0px solid #960100;
            height:35px;

    }


    #mbtnav {
        margin: 0;
        padding: 0;
    }
    #mbtnav ul {
        float: left;
        list-style: none;
        margin: 0;
        padding: 0;
    }
    #mbtnav li {
        list-style: none;
        margin: 0;
        padding: 0;
         
    }
    #mbtnav li a, #mbtnav li a:link, #mbtnav li a:visited {
        color: #FFF;
        display: block;
       font:bold 12px Helvetica, sans-serif;
       margin: 0;
        padding: 9px 12px 11px 12px;
            text-decoration: none;
            border-right:0px solid #627AAD;

    }
    #mbtnav li a:hover, #mbtnav li a:active {
        background: #627AAD;
        color: #FFF;
        display: block;
        text-decoration: none;
            margin: 0;
        padding: 9px 12px 11px 12px;
         
     
         
    }

    #mbtnav li {
        float: left;
        padding: 0;
    }
    #mbtnav li ul {
        z-index: 9999;
        position: absolute;
        left: -999em;
        height: auto;
        width: 160px;
        margin: 0;
        padding: 0;
    }
    #mbtnav li ul a {
        width: 140px;
    }
    #mbtnav li ul ul {
        margin: -25px 0 0 161px;
    }

    #mbtnav li:hover ul ul, #mbtnav li:hover ul ul ul, #mbtnav li.sfhover ul ul, #mbtnav li.sfhover ul ul ul {
        left: -999em;
    }
    #mbtnav li:hover ul, #mbtnav li li:hover ul, #mbtnav li li li:hover ul, #mbtnav li.sfhover ul, #mbtnav li li.sfhover ul, #mbtnav li li li.sfhover ul {
        left: auto;
    }
    #mbtnav li:hover, #mbtnav li.sfhover {
        position: static;
    }
    #mbtnav li li a, #mbtnav li li a:link, #mbtnav li li a:visited {
        background: #EDEFF4;
        width: 120px;
        color: #3B5998;
        display: block;
        font:normal 12px Helvetica, sans-serif;
        margin: 1px 0 0 0;
        padding: 9px 12px 10px 12px;
            text-decoration: none;
    z-index:9999;
    border:1px solid #ddd;

    -moz-border-radius:4px;
    -webkit-border-radius:4px;

     
    }
    #mbtnav li li a:hover, #mbtnav li li a:active {
        background: #627AAD;
        color: #FFF;
        display: block;
     
    }


    #mbtnav li li li a, #mbtnav li li li a:link, #mbtnav li li li a:visited {

        background: #EDEFF4;
        width: 120px;
        color: #3B5998;
        display: block;
        font:normal 12px Helvetica, sans-serif;
        padding: 9px 12px 10px 12px;
            text-decoration: none;
    z-index:9999;
    border:1px solid #ddd;
        margin: 1px 0 0  -14px;
     
     
    }
    #mbtnav li li li a:hover, #mbtnav li li li a:active {
        background: #627AAD;
        color: #FFF;
        display: block;
    }

    </style>
    <div id='mbtnavbar'>
              <ul id='mbtnav'>
                <li>
                  <a href='ဒီမွာလင့္ခ္ထည့္ေပးပါ#'>လင့္ခ္အမည္ထည့္ပါ</a>
                </li>
                <li>
                  <a href='ဒီမွာလင့္ခ္ထည့္ေပးပါ#'>လင့္ခ္အမည္ထည့္ပါ</a>
               </li>
                <li>
                  <a href='ဒီမွာလင့္ခ္ထည့္ေပးပါ#'>လင့္ခ္အမည္ထည့္ပါ</a>
                </li>
          <li>
                   <a href='ဒီမွာလင့္ခ္ထည့္ေပးပါ#'>လင့္ခ္အမည္ထည့္ပါ</a>

                    <ul>
                        <li><a href='ဒီမွာလင့္ခ္ထည့္ေပးပါ#'>လင့္ခ္အမည္ထည့္ပါ #1</a></li>
                        <li><a href='ဒီမွာလင့္ခ္ထည့္ေပးပါ#'>လင့္ခ္အမည္ထည့္ပါ #2</a></li>
                        <li><a href='ဒီမွာလင့္ခ္ထည့္ေပးပါ#'>လင့္ခ္အမည္ထည့္ပါ #3</a>
                       <ul>
                        <li><a href='ဒီမွာလင့္ခ္ထည့္ေပးပါ#'>လင့္ခ္အမည္ထည့္ပါ #1</a></li>
                        <li><a href='ဒီမွာလင့္ခ္ထည့္ေပးပါ#'>လင့္ခ္အမည္ထည့္ပါ #2</a></li>
                        <li><a href='ဒီမွာလင့္ခ္ထည့္ေပးပါ#'>လင့္ခ္အမည္ထည့္ပါ#3</a></li>
                      </ul>
    </li>
                      </ul>
                </li>

              </ul>
            </div>

Kp3နည္းပညာ၊၄၇၄၊ဘေလာ့ပိုစ္ေတြကိုသူမ်ားဖတ္မရေအာင္ေသာ့ခတ္နည္း

2011-07-15T09:21:00.000-07:00

အခုတေလာအခ်ိန္မရလို႕နည္းပညာသစ္ေလးေတြတင္ခ်င္ေပမယ့္မတင္ႏိုင္ဘူးျဖစ္ေနတယ္။ေကပီသရီးကိုလာသြားၾကတဲ့ဘေလာ့မိတ္ေဆြေတြ
ကိုလည္းအားနာလွပါျပီ၊ဒါေၾကာင့္က်ေနာ္ဒီေန႕ဘေလာ့အတြက္တကယ့္နည္းပညာသစ္ျဖစ္တဲ့မိမိရဲ႕ဘေလာ့ပိုစ္ေတြကိုPassWordနဲ႕ေသာ့ခတ္တဲ့နည္း
ပညာသစ္ေလးမ်ွေဝေပးလိုက္ပါတယ္။မိမိရဲ႕ပိုစ္ေတြကိုသူငယ္ခ်င္အခ်ိဳ႕ဘဲဖတ္ခိုင္းခ်င္ရင္ေပါ့ေနာ္။Passwordေလးရိုက္ထည့္လိုက္ရင္မိမိဖြတ္ထားတဲ့
ပိုစ္ေလးပြင့္လာလာလိမ့္မည္။မိမိရဲ႕PassWordကိုသူငယ္ခ်င္ရဲ႕အီးေမးလ္ကေနအသိေပးလိုက္ေပါ့ေနာ္။ၾကိဳက္ၾကမယ္လို႕ေတာ့ေမ်ာ္လင့္ပါတယ္၊
ေအာက္မွာထံုးစံတိုင္းနာမူနာသြားၾကည့္လို႕ရေအာင္က်ေနာ္DEMOလင့္ခ္ေလးေပးထားပါတယ္။နမူနာပိုစ္ရဲ႕PassWordကေတာ့kp3ပါသြားဖြင့္ၾကည့္
လိုက္ပါ။ၾကိဳက္သြားမယ္ေနာ္ဟီး...။
ဒီမွာ DEMO နမူနာ Post သြားျပီး Password-kp3ရိုက္ထည့္ျပီးPostကိုၾကည့္လိုက္ပါ။
ပထမဆံုးဒီလင့္ခ္http://www.vincentcheung.ca/jsencryption/ သြားလိုက္ပါတယ္။

Design >>> Edit HTM ေအာက္ကCodeကိုရွာပါ။

]]></b:skin>

ေတြ႕ျပီဆိုရင္ေအာက္မွာေအာက္ကေပးထားတဲ့KP3 PASSWORD PROTECT CODEကိုထည့္ေပးလိုက္ပါ။

<!--KP3 PASSWORD PROTECT CODE --> <script type="text/javascript" src="http://yourjavascript.com/11117261018/kp3family.txt.js"></script>

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

ပံုမွာအားလံုးနားလည္ေအာင္အဆင့္ဆင့္ျပထားေပးတာပါ။ကိုယ္တိုင္းဝင္ျပီးလုပ္ၾကည့္လိုက္ရင္လြယ္လြယ္ေလးပါ။
ပံု-၁

ပံု-၂

ပံု-၃

ပံု-၄

ပံု-၅

ပံု-၆

ပံု-၇

Kp3နည္းပညာ၊၄၇၃၊Firefoxမွာဘေလာ့ဝင္ရင္BadRequestError400ျဖဳတ္နည္း

2011-06-30T09:19:00.000-07:00

ဒီေန႕တင္တာေလးေတာ့က်ေနာ္တို့ဘေလာ့ေရးတဲ့သူအခ်ိဳ႕ကလည္းၾကံဳဖူးၾကမယ္ထင္ပါတယ္။Gmailဝင္ရင္လည္းတခါတေလးၾကံဳတတ္တဲ့ျပႆနာပါ။
က်ေနာ္တို႕႕ရဲ႕ဘေလာ့အေကာင့္ကိုဝင္ဖို႕Blogger.comဝင္လိုက္ရင္BadRequestError400ဆိုျပီးေပၚေပၚေနတယ္။ဒါကိုဘယ္လိုလုပ္ရမယ္ဆိုတာ
က်ေနာ္ေအာက္မွာပံုနဲ႕တကြအဆင့္ဆင့္ျပထားေပးပါတယ္။အသံုးဝင္တယ္သိထားသင့္တယ္ထင္လို႕ပိုစ္မွာတင္လိုက္တာပါ၊မသိေသးတဲ့ဘေလာ့မိတ္ေဆြ
ေတြအတြက္။ဘေလာ့မိတ္ေဆြအားလံုးကိုခင္မင္ေလးစားလွ်က္ေကပီသရီးမိသားစု

Kp3နည္းပညာ၊၄၇၂၊ဘေလာ့မွာအလြယ္ကူဆံုး Accordion Menu သံုးခ်င္ရင္

2011-06-29T05:20:00.000-07:00

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

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

Design>>>Add a Gadget>>>HTML/JavaScript မွာေအာက္ကကုဒ္ကိုထည့္ေပးလိုက္ပါ။

<!-kp-3နည္းပညာ-http://kp3family.blogspot.com-->   
<style type="text/css">
h5 {
font-family: arial, trebuchet-ms, tahoma;
font-size: 13px;
font-weight:bold;
padding: 0 0 1em;

color: #ffffff;
}
.msg_list {
list-style: none;
padding: 0;
margin: 0;
width: 100%;
}
.msg_head {
padding: 5px 10px;
cursor: pointer;
position: relative;
margin:1px;
background-color: #6D7B8D;
}
.msg_body {
padding: 5px 10px 15px;
background-color: #98AFC7;
}
</style>

<script type="text/javascript" src=" https://sites.google.com/site/teknikbuatblog/tbb/menuaccordion.js?attredirects=0&d=1 "></script>

<script type="text/javascript">
$(document).ready(function()
{
//hide the all of the element with class msg_body
$(".msg_body").hide();
//slides the element with class "msg_body" when paragraph with class "msg_head" is clicked
$("#firstpane h5.msg_head").click(function()
{
$(this).next("div.msg_body").slideToggle(700).siblings("div.msg_body").slideUp("slow");
});
//slides the element with class "msg_body" when mouse is over the paragraph
$("#secondpane h5.msg_head").mouseover(function()
{
$(this).next("div.msg_body").slideDown("slow").siblings("div.msg_body").slideUp("slow");
});
});
</script>

<div class="msg_list" id="secondpane">
<h5 class="msg_head">ဒီမွာေခါင္းစဥ္ေရးပါ</h5>
<div class="msg_body">
ေခါင္းစဥ္ရဲ႕ကုဒ္ထည့္ရန္

</div>

<h5 class="msg_head">ဒီမွာေခါင္းစဥ္ေရးပါ</h5>
<div class="msg_body">

ေခါင္းစဥ္ရဲ႕ကုဒ္ထည့္ရန္

<h5 class="msg_head">ဒီမွာေခါင္းစဥ္ေရးပါ</h5>
<div class="msg_body">

ေခါင္းစဥ္ရဲ႕ကုဒ္ထည့္ရန္

</div>
</div>
<!--kp3Accordion Menu-http://kp3family.blogspot.com-->

Kp3နည္းပညာ၊၄၇၁၊ဘေလာ့မွာCSS3 Multi Level Drop Down Menu သံုးနည္း

2011-06-28T05:55:00.000-07:00

အခုတင္တဲ့ပုိစ္ေလးကလည္းCSS3MultiLevelDropDownMenuလို႕ေခၚတဲ့အသစ္ေလးပါ။Menuမတင္တာၾကာေတာ့ဘေလာ့မိတ္ေဆြေတြပ်င္းသြားထင္
လို႕Menuသစ္ေလးတင္လိုက္တာပါ။က်ေနာ္တင္ဖူးတဲ့Menuေတြလည္းမနည္းေတာ့ဘူးဆုိတာသိၾကမယ္ထင္ပါတယ္။Menuေတြကိုလြယ္ကူစြာရွာခ်င္ရင္Labelsကေနဝင္
ျပီးရွာရင္ပိုျပီးမ်ားတာေပါ့ေနာ္။အခုတင္တဲ့Menuကနမူနာသြားၾကည့္လို႕ေအာင္DEMOလင့္ခ္ေလးေပးထားပါ။Kp3တင္တဲ့Menuတိုင္းမွာDEMOလင့္ခ္အျမဲတမ္းလိုလိုထား
ေပးပါတယ္။ၾကိဳက္ၾကမယ္လို႕လဲေမ်ာ္လင့္ပါတယ္။ဘေလာ့မိတ္ေဆြအားလံုးကိုခင္မင္ေလးစားျမဲေကပီသရီးမိသားစု

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

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

]]></b:skin>

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

#nav {
        float: left;
        font: bold 12px Arial, Helvetica, Sans-serif;
        border: 1px solid #121314;
        border-top: 1px solid #2b2e30;
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        border-radius: 5px;
        overflow: hidden;
}

#nav ul {
        margin:0;
        padding:0;
        list-style:none;
}

#nav ul li {
        float:left;
}

#nav ul li a {
        float: left;
        color:#d4d4d4;
        padding: 10px 20px;
        text-decoration:none;
        background:#3C4042;
        background: -webkit-gradient( linear, left bottom, left top, color-stop(0.09, rgb(59,63,65)), color-stop(0.55, rgb(72,76,77)), color-stop(0.78, rgb(75,77,77)) );
        background: -moz-linear-gradient( center bottom, rgb(59,63,65) 9%, rgb(72,76,77) 55%, rgb(75,77,77) 78% );
        background: -o-linear-gradient( center bottom, rgb(59,63,65) 9%, rgb(72,76,77) 55%, rgb(75,77,77) 78% );
        box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1) inset, 0 0 5px rgba(0, 0, 0, 0.1) inset;
        border-left: 1px solid rgba(255, 255, 255, 0.05);
        border-right: 1px solid rgba(0,0,0,0.2);
        text-shadow: 0 -1px 1px rgba(0, 0, 0, 0.6);
}

#nav li ul {
        background:#3C4042;
        background-image: -webkit-gradient( linear, left bottom, left top, color-stop(0.09, rgb(77,79,79)), color-stop(0.55, rgb(67,70,71)), color-stop(0.78, rgb(69,70,71)) );
        background-image: -moz-linear-gradient( center bottom, rgb(77,79,79) 9%, rgb(67,70,71) 55%, rgb(69,70,71) 78% );
        background-image: -o-linear-gradient( center bottom, rgb(77,79,79) 9%, rgb(67,70,71) 55%, rgb(69,70,71) 78% );
        border-radius: 0 0 10px 10px;
        -moz-border-radius: 0 0 10px 10px;
        -webkit-border-radius: 0 0 10px 10px;
        left: -999em;
        margin: 35px 0 0;
        position: absolute;
        width: 160px;
        z-index: 9999;
        box-shadow: 0 0 15px rgba(0, 0, 0, 0.4) inset;
        -moz-box-shadow: 0 0 15px rgba(0, 0, 0, 0.4) inset;
        -webkit-box-shadow: 0 0 15px rgba(0, 0, 0, 0.4) inset;
        border: 1px solid rgba(0, 0, 0, 0.5);
}

#nav li ul a {
        background: none;
        border: 0 none;
        margin-right: 0;
        width: 120px;
        box-shadow: none;
        -moz-box-shadow: none;
        -webkit-box-shadow: none;
        border-bottom: 1px solid transparent;
        border-top: 1px solid transparent;
}
#nav ul li a:hover,
#nav ul li:hover > a {
        color: #252525;
        background:#3C4042;
        background: -webkit-gradient( linear, left bottom, left top, color-stop(0.09, rgb(77,79,79)), color-stop(0.55, rgb(67,70,71)), color-stop(0.78, rgb(69,70,71)) );
        background: -moz-linear-gradient( center bottom, rgb(77,79,79) 9%, rgb(67,70,71) 55%, rgb(69,70,71) 78% );
        background: -o-linear-gradient( center bottom, rgb(77,79,79) 9%, rgb(67,70,71) 55%, rgb(69,70,71) 78% );
        text-shadow: 0 1px 0 rgba(255, 255, 255, 0.2), 0 -1px #000;

}

#nav li ul a:hover,
#nav ul li li:hover > a  {
    color: #2c2c2c;
        background: #5C9ACD;
        background: -webkit-gradient( linear, left bottom, left top, color-stop(0.17, rgb(61,111,177)), color-stop(0.51, rgb(80,136,199)), color-stop(1, rgb(92,154,205)) );
        background: -moz-linear-gradient( center bottom, rgb(61,111,177) 17%, rgb(80,136,199) 51%, rgb(92,154,205) 100% );
        background: -o-linear-gradient( center bottom, rgb(61,111,177) 17%, rgb(80,136,199) 51%, rgb(92,154,205) 100% );
        border-bottom: 1px solid rgba(0,0,0,0.6);
        border-top: 1px solid #7BAED9;
        text-shadow: 0 1px rgba(255, 255, 255, 0.3);
}

#nav li:hover ul {
        left: auto;
}

#nav li li ul {
        margin: -1px 0 0 160px;
        -webkit-border-radius: 0 10px 10px 10px;
        -moz-border-radius: 0 10px 10px 10px;
        border-radius: 0 10px 10px 10px;
        visibility:hidden;
}

#nav li li:hover ul {
        visibility:visible;
}

ျပီးရင္Save Tamplate ကိုႏိုပ္ေပးလိုက္ပါ။
ေနာက္ဆံုးအဆင့္ကေတာ့Design>>>Add a Gadget>>>HTML/JavaScript မွာေအာက္ကကုဒ္ကိုထည့္ေပးလိုက္ပါ။

<div id="nav">
<ul>
<li><a href="#">ေကပီသရီး</a></li>
<li><a href="#">အႏုပညာ</a></li>
<li><a href="#">သတင္း</a></li>
<li><a href="#">၁။ Dropdown</a>
        <ul>
        <li><a href="#">Level ၂.၁</a></li>
        <li><a href="#">Level ၂.၂</a></li>
        <li><a href="#">Level ၂.၃</a></li>
        <li><a href="#">Level ၂.၄</a></li>
        <li><a href="#">Level ၂.၅</a></li>
        </ul>
</li>
<li><a href="#">၂။ Dropdown</a>
        <ul>
        <li><a href="#">Level ၂.၁</a></li>
        <li><a href="#">Level ၂.၂</a></li>
        <li><a href="#">Level ၂.၃</a></li>
        <li><a href="#">Level ၂.၄</a></li>
        <li><a href="#">Level ၂.၅</a></li>
        </ul>
</li>
<li><a href="#">စီးပြားေရးရာ</a></li>
<li><a href="#">ဆက္သြယ္ရန္</a></li>
</ul>
</div>

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

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