Pages - Menu

2 Nov 2012

ဘေလာ့ search box လွလွေလးထည့္ဖို႕

အေပၚက ပုံေလးလိုေပါ့ မိမိတို႕ဘေလာ့မွာ လွလွေလးသုံးချခင္ရင္ေတာ့  လုပ္ၾကည့္ပါေနာ္..
နည္းလမ္းေလးကေတာ့.......


  • 1. Login လုပ္လုိက္ပါ ဘေလာ့ကာကို
  • 2.  Layout ကိုကလစ္ရပါ့မယ္ မိမိတို႕  Dashboard ကေနေပါ့
  • 3.  Page Elements
  • 4.  Add a Gadget ကိုကလစ္ေပးလုိက္ပါ
  • 5.  HTML/Javascript. ကိုကလစ္ျပီး က်လာတဲ့ ေဘာက္ေလးထဲမွာဘဲ
  • 6. ေအာက္ကေပးထားတဲ့ ကုဒ္ေတြကို ေကာ္ပီယူ ထည့္လိုက္ပါ

<form action='/search' id='searchform' method='get' style='display:inline;'>
<input id='searchbox' maxlength='255' name='q' onblur='if (this.value == &quot;&quot;) {this.value = &quot;Search this blog...&quot;;}' onfocus='if (this.value == &quot;Search this blog...&quot;) {this.value = &quot;&quot;}' type='text' value='Search this blog...'/>
<input id='searchbutton' type='submit' value='Search'/>
</form>
  • 7. Save လုိက္လို႕ရပါျပီ။

စတုိင္ေလးျဖစ္လာဖို႕ဆက္လုပ္ပါမယ္...

1.  Template  ကိုကလစ္ပါ
 2.  Edit HTML ကေနသြားပါ Proceed  ဆက္သြားပါ အမွန္ျခစ္ခဲ့ေနာ္ ထုံးးစံေပါ့..
3. သည္ကုဒ္ကိုရွာလုိက္ပါ    ]]></b:skin>
4. ေတြ႕ျပီဆိုတာနဲ႕  ]]></b:skin>  ေလးရဲ႕ အေပၚမွာ past ခ်ေပးလိုက္ပါ...
#searchform { margin: 0; padding: 0; overflow: hidden; display: inline; } #searchbox { background: #fff !important; width: 180px; color: #202020; font-size: 12px; font-family: Georgia, Times New Roman, Trebuchet MS; font-weight: normal; margin: 0; padding: 3px 0 8px 5px; border-top: 1px solid #DDD; border-right: 1px solid #666; border-left: 1px solid #DDD; border-bottom: 1px solid #666; display: inline; -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px; -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .4); -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, .4); box-shadow: 0 1px 2px rgba(0, 0, 0, .4); border:1px solid #6BB5FF; } #searchbox:hover { background: #fff !important; width: 220px; color: #202020; font-size: 12px; font-family: Georgia, Times New Roman, Trebuchet MS; font-weight: normal; margin: 0; padding: 3px 0 8px 5px; border-top: 1px solid #DDD; border-right: 1px solid #666; border-left: 1px solid #DDD; border-bottom: 1px solid #666; display: inline; -webkit-border-radius: 15px; -moz-border-radius: 15px; border-radius: 15px; -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, .4); -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, .4); box-shadow: 0 1px 4px rgba(0, 0, 0, .4); border:1px solid #6BB5FF; } #searchbutton { -moz-box-shadow:inset 0px 1px 0px 0px #bbdaf7; -webkit-box-shadow:inset 0px 1px 0px 0px #bbdaf7; box-shadow:inset 0px 1px 0px 0px #bbdaf7; background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #79bbff), color-stop(1, #378de5) ); background:-moz-linear-gradient( center top, #79bbff 5%, #378de5 100% ); filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#79bbff', endColorstr='#378de5'); background-color:#79bbff; -moz-border-radius:22px; -webkit-border-radius:22px; border-radius:22px; border:1px solid #84bbf3; display:inline-block; color:#ffffff; font-family:arial; font-size:11px; font-weight:bold; padding:3px 11px; text-decoration:none; text-shadow:1px 1px 0px #528ecc; }#searchbutton:hover { background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #378de5), color-stop(1, #79bbff) ); background:-moz-linear-gradient( center top, #378de5 5%, #79bbff 100% ); filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#378de5', endColorstr='#79bbff'); background-color:#378de5; }#searchbutton:active { position:relative; top:1px; }
 5. save template လိုက္ပါေတာ့
 မွတ္ခ်က္။    ။ ကုဒ္ထဲက အနီေရာင္နဲ႕ျပထားတဲ့ နံပါတ္ေနရာမွာ မိမိတို႕ ဘေလာ့နဲ႕ ကုိက္ညီေအာင္ ျပင္ေပးနိဳင္ပါတယ္..

ေအာင္ေအာင္(မကစ) ရဲ႕ ဘေလာ့ခရီးသည္ေလးအား အားေပးေနၾကတဲ့အတြက္ ေက်းဇဴးအထူးတင္ပါတယ္.. တုန္႕ျပန္မွဳအေနနဲ႕ fb like ေလးေတာ့ လုပ္ေပးခဲ့ၾကပါေနာ္.. တတ္စြမ္းသမွ် ေတြ႕ ရွိသမွ်ေလးေတြကို ျပန္လည္ မွ်ေ၀ေနပါ့မယ္...။ www.aungsanmks.blogspot.com
www.ledimyethar.com

Twitter Delicious Facebook Digg Stumbleupon Favorites More