Search Box အလန္းေလးေတြ မွသုံးျခင္တယ္ဆို


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

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

Style 1

<style type="text/css">
#btrix-searchbox {
border-radius: 5px;
background: URL(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiuMunmzK4xpxFfZ5PHMgHdk7cVWhUD3PxL_UI7YIlJfb0po-ClY9WPh3Thdnpr7olIjJDS1YWJxk1aAAdU9vt_oSH9Q0GaKp7tGUSHmNdpUv3kwei0aP3wgCnJcwdDc_nXfagZtPkM7w7W/s1600/red.png) no-repeat scroll center center transparent;
width: 307px;
height: 50px;
disaply: block;
}

form#btrix-searchform {
display: block;
padding: 9px 16px;
margin: 0;
}

form#btrix-searchform #s {
padding-left: 24px !important;
padding: 7.5px;
margin: 0;
width: 198px;
font-size: 16px;
font-family: georgia;
font-style: italic;
color: #666666;
vertical-align: top;
border: none;
background: transparent;
}

form#btrix-searchform
#sbutton {
margin: 0;
padding: 0;
height: 40px;
width: 74px;
vertical-align: top;
border: none;
background: transparent;
}
</style>
<div id="btrix-searchbox">
<form id="btrix-searchform" action="/search" method="get">
<input type="text" id="s" name="q" value="Search..." onfocus='if (this.value == "Search...") {this.value = ""}'
onblur='if (this.value == "") {this.value = "Search...";}' />
<input type="image" src="http://img1.blogblog.com/img/blank.gif" id="sbutton"
/>
</form>
</div>


Style 2
<style type="text/css">
#btrix-searchbox {
border-radius: 5px;
background: URL(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhX-vplCOX2E_g11VTRpMGwYJ12xPq4cljv3UHKN8rAYpT4tdFSiJYooA_yaN63c9X6F-JuilAiugTS31jFEWuxfGNfAYSEFKMi0qicuIrVsvCbmaN7yo2uy5nKPfzpe6Z6rVzlQP6Wjqn0/s1600/purple.png) no-repeat scroll center center transparent;
width: 307px;
height: 50px;
disaply: block;
}

form#btrix-searchform {
display: block;
padding: 9px 16px;
margin: 0;
}

form#btrix-searchform #s {
padding-left: 24px !important;
padding: 7.5px;
margin: 0;
width: 198px;
font-size: 16px;
font-family: georgia;
font-style: italic;
color: #666666;
vertical-align: top;
border: none;
background: transparent;
}

form#btrix-searchform
#sbutton {
margin: 0;
padding: 0;
height: 40px;
width: 74px;
vertical-align: top;
border: none;
background: transparent;
}
</style>
<div id="btrix-searchbox">
<form id="btrix-searchform" action="/search" method="get">
<input type="text" id="s" name="q" value="Search..." onfocus='if (this.value == "Search...") {this.value = ""}'
onblur='if (this.value == "") {this.value = "Search...";}' />
<input type="image" src="http://img1.blogblog.com/img/blank.gif" id="sbutton"
/>
</form>
</div>


Style 3

<style type="text/css">
#btrix-searchbox {
border-radius: 5px;
background: URL(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgqJ0YNc9mVbalyVN-vwt-WHAtlxUVwNPTICvcWt5dLGF5TLKnIOeJDWBWQBz5gqF6ZqMtUrD92NHWUIP6e5ulyC_KhFyIcsSEOWHbrDcyXni6IgsT7LH0f3iGsOC21ypI5CL9Dq_9UID-x/s1600/green.png) no-repeat scroll center center transparent;
width: 307px;
height: 50px;
disaply: block;
}

form#btrix-searchform {
display: block;
padding: 9px 16px;
margin: 0;
}

form#btrix-searchform #s {
padding-left: 24px !important;
padding: 7.5px;
margin: 0;
width: 198px;
font-size: 16px;
font-family: georgia;
font-style: italic;
color: #666666;
vertical-align: top;
border: none;
background: transparent;
}

form#btrix-searchform
#sbutton {
margin: 0;
padding: 0;
height: 40px;
width: 74px;
vertical-align: top;
border: none;
background: transparent;
}
</style>
<div id="btrix-searchbox">
<form id="btrix-searchform" action="/search" method="get">
<input type="text" id="s" name="q" value="Search..." onfocus='if (this.value == "Search...") {this.value = ""}'
onblur='if (this.value == "") {this.value = "Search...";}' />
<input type="image" src="http://img1.blogblog.com/img/blank.gif" id="sbutton"
/>
</form>
</div>


Style 4
<style type="text/css">
#btrix-searchbox {
border-radius: 5px;
background: URL(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjrqI7uhFbjcG5nWiJbIUNKGKd9OT6IGB3U1-kU1oMQimR5dsHGsG9MAunkO-kek3tQY08P7QQiU0uf2xcOKtpgErBqAOcmvXzD90ghCcvaPWfRe1k13mLwJeJFW2Pop1RTPrEdEzdDd0bM/s1600/blue.png) no-repeat scroll center center transparent;
width: 307px;
height: 50px;
disaply: block;
}

form#btrix-searchform {
display: block;
padding: 9px 16px;
margin: 0;
}

form#btrix-searchform #s {
padding-left: 24px !important;
padding: 7.5px;
margin: 0;
width: 198px;
font-size: 16px;
font-family: georgia;
font-style: italic;
color: #666666;
vertical-align: top;
border: none;
background: transparent;
}

form#btrix-searchform
#sbutton {
margin: 0;
padding: 0;
height: 40px;
width: 74px;
vertical-align: top;
border: none;
background: transparent;
}
</style>
<div id="btrix-searchbox">
<form id="btrix-searchform" action="/search" method="get">
<input type="text" id="s" name="q" value="Search..." onfocus='if (this.value == "Search...") {this.value = ""}'
onblur='if (this.value == "") {this.value = "Search...";}' />
<input type="image" src="http://img1.blogblog.com/img/blank.gif" id="sbutton"
/>
</form>
</div>


Style 5
<style type="text/css">
#btrix-searchbox {
border-radius: 5px;
background: URL(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgabCeIG1k_93zoZnYjWcWSIz8TIgimxZrPznJI8SgDpG8YZj_42Jt0vn8YsfOxHmhb_LzVwzZgZytOMmC2JC1O4NkofEQirLlOIa72Mfpu9Ry7rKB7D71uQ6bRgc7DJPDW3euTZloAf0HD/s1600/orange.png) no-repeat scroll center center transparent;
width: 307px;
height: 50px;
disaply: block;
}

form#btrix-searchform {
display: block;
padding: 9px 16px;
margin: 0;
}

form#btrix-searchform #s {
padding-left: 24px !important;
padding: 7.5px;
margin: 0;
width: 198px;
font-size: 16px;
font-family: georgia;
font-style: italic;
color: #666666;
vertical-align: top;
border: none;
background: transparent;
}

form#btrix-searchform
#sbutton {
margin: 0;
padding: 0;
height: 40px;
width: 74px;
vertical-align: top;
border: none;
background: transparent;
}
</style>
<div id="btrix-searchbox">
<form id="btrix-searchform" action="/search" method="get">
<input type="text" id="s" name="q" value="Search..." onfocus='if (this.value == "Search...") {this.value = ""}'
onblur='if (this.value == "") {this.value = "Search...";}' />
<input type="image" src="http://img1.blogblog.com/img/blank.gif" id="sbutton"
/>
</form>
</div>


ကဲ စိတ္တိုင္းက် ျပီဆိုပါက ေဆ့လုိက္ေပါ့..ေနာ္.. အဆင္ေျပၾကပါေစ
ေအာင္ေအာင္(မကစ) ရဲ႕ ဘေလာ့ခရီးသည္ေလးအား အားေပးေနၾကတဲ့အတြက္ ေက်းဇဴးအထူးတင္ပါတယ္.. တုန္႕ျပန္မွဳအေနနဲ႕ fb like ေလးေတာ့ လုပ္ေပးခဲ့ၾကပါေနာ္.. တတ္စြမ္းသမွ် ေတြ႕ ရွိသမွ်ေလးေတြကို ျပန္လည္ မွ်ေ၀ေနပါ့မယ္...။ အဆင္မေျပတာမ်ားရွိခဲ့ပါက...cbox မွာ ေျပာခဲ့ၾကပါေနာ္..
<<<မန္ဘာ၀င္ျပီး...Fb Like ျခင္းျဖင့္ အားေပးၾကပါေနာ္>>>
ေအာင္ေအာင္(မကစ) ပိုင္ဆိုင္ေသာ ေနရာေလးမ်ားကိုလာလည္ၾကပါ။
လယ္တီေျမသား www.ledimyethar.com
ဘေလာ့ခရီးသည္ http://aungsanmks.blogspot.com/
မွတ္စုစာအုပ္ http://aungsan96.blogspot.com/
ဓမၼႏွင့္စာေပနန္းေတာ္ http://ninilayy.blogspot.com/

0 comments: