၅၉။ 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/AVvXsEjIWere12KeeQbZZ0XxL2H8BkLlPUHljHTgkQq_UXMoXD-431mHnD6954rIVtZnzvrt48Ep41ijIl4P19aFEdOvKSlUbTw7hFdxsz_jrqhap9eBprhF7QEHdamfdhSsBFia69zdr3wMMYYR/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/AVvXsEgbvwvvEEEE_8DXFFfqpA8429IM3wCViUoIlQP27qXLCwTKrRACcETg4HHFzZ_ActWtSlUamatUKaukXdUXFeyjcl4pIWELSzyCu7VoMLLZ9pbjgk5zmpYoI2DeLs5EGN7UnVaYcWOuX7FG/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/AVvXsEj2l-H3iSyA2c04aQG78_gf-JXITBXIGb08uyf-WtzNtVIkpyurNwOinvSiblaItQzTPRwJbReLh4iRnmeKBld3k-uiS_8LcbYfP9QRfdZOVz4e2UpAwnG655g5AFb8sVuhYK861ZSD0hp3/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/AVvXsEjjY3VcEXr65yFRXk6bDDsOzywd3LBLHDpQBoeXN_Ys_30C29pBMywKnE8-BZheQirPT31QcGRQDh8yBcRwWdUjoo_QBU8uYN1NXcA1cL84gUVg-L0SxPA54te1xn17E4uqa7QB2wsg_flb/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/AVvXsEipuNN4sHSwwze-vgJraU0lyynoVRj12RM9maeDaG5aaLDRYCi0pO9YASzH6C-8aNtnOrO3aHfwRL4TQAGgasSc724Kmdp83Jj8C0RJLg8_N9M2-ib-KVVeWJF5Pds-4WSu4jxcYyFYDahm/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>

ကဲ စိတ္တိုင္းက် ျပီဆိုပါက ေဆ့လုိက္ေပါ့ေနာ္ အဆင္ေျပၾကပါေစ

လိုအပ္ခ်က္မ်ားရိွခ့ဲရင္ { https://m.facebook.com/messages/thread/100009588729664 }  မွလာေရာက္အၾကံဥာဏ္မ်ားေျပာၾကားႏိုင္ပါသည္

တင္သမွ် Post ေတြကို Facebook စာမ်က္ႏွာက ဖတ္ခ်င္တယ္ဆုိရင္ { https://www.facebook.com/profile.php?id=100009588729664 } or { https://www.facebook.com/profile.php?id=100012761191397 } or { https://www.facebook.com/minzaw77777 } ဆုိတာႏွိပ္ျပီ Facebook မွလာေရာက္အားေပးခဲ့ပါေနာ္ 

   လိုအပ္ခ်က္မ်ားရိွခ့ဲရင္ { http://mmbloggerguide.blogspot.com/2015/12/search-box_10.html?m=1 } ႏိွပ္ျပီးမူရင္းသြားေရာက္ေလ့လာေမးျမန္းႏိုင္ပါသည္