Beautiful And Fresh Search Boxes For Blogger

 

သူငယ္ခ်င္းတို႔ရဲ႕ဘေလာ့စ္မွာလိုခ်င္တာကိုအလြယ္တစ္ကူရွာလိုရတဲ့ Search Keyword ေဘာက္
ထားခ်င္ရင္ ေအာက္မွာၾကိဳက္တဲ့ကာလာ ကိုေရြးယူနိုင္ပါတယ္။
ေအာက္ကကိုယ္ၾကိဳက္တဲ့အေရာင္ရဲ႕ ကုဒ္ကိုယူျပီး..
မိမိ Blogger ကေန Layout >> Add a Gedget  ထဲမွာထည့္ျပီး Save လုပ္လိုက္ရင္ျပီးပါျပီ။

<style type="text/css"> #helperblogger-searchbox {     border-radius: 5px;     background: URL(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhEPGlhHZsMBT_QHO_nj3jb3q6BC6_P4pFb4JN8U3qCCQKEH5spAAcjsigV6G9z4Rn8yhUeLy0u7iR6YtZ3FBwyy3l1Z0Cb_JIgOmW5iSIINk-TKKtFkNPwGv_rbECHfTfaxh0XdpYzOvk/s1600/helperblogger.com-green.png) no-repeat scroll center center transparent;     width: 307px;     height: 50px;     disaply: block; }   form#helperblogger-searchform {     display: block;     padding: 9px 16px;     margin: 0; }   form#helperblogger-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#helperblogger-searchform #sbutton {     margin: 0;     padding: 0;     height: 40px;     width: 74px;     vertical-align: top;     border: none;     background: transparent; } </style> <div id="helperblogger-searchbox">     <form id="helperblogger-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 type="text/css"> #helperblogger-searchbox {     border-radius: 5px;     background: URL(http://1.bp.blogspot.com/-3QS-Mh7cdm4/T9L_x-etZiI/AAAAAAAAB8Q/OXgi3sBFiRI/s1600/helperblogger.com-blue.png) no-repeat scroll center center transparent;     width: 307px;     height: 50px;     disaply: block; }    form#helperblogger-searchform {     display: block;     padding: 9px 16px;     margin: 0; }    form#helperblogger-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#helperblogger-searchform #sbutton {     margin: 0;     padding: 0;     height: 40px;     width: 74px;     vertical-align: top;     border: none;     background: transparent; } </style> <div id="helperblogger-searchbox">     <form id="helperblogger-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> - See more at: http://www.helperblogger.com/2012/06/another-set-of-beautiful-and-fresh.html#sthash.d6UwG6eQ.dpuf <style type="text/css"> #helperblogger-searchbox {     border-radius: 5px;     background: URL(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgCI71jFLS4cRAkTBKl1pPP4-aH_EEJotJYIdzNAg19yyxszXMF8Tdcrv9zJuPiFv-LCwrAx2BWQRArzHKAylrmE6rMaP3rhXCH9DUsBnC4PF6gVha1nH9h9FjHt7lz7y4phQQBQDY05yk/s1600/helperblogger.com-blue.png) no-repeat scroll center center transparent;     width: 307px;     height: 50px;     disaply: block; }   form#helperblogger-searchform {     display: block;     padding: 9px 16px;     margin: 0; }   form#helperblogger-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#helperblogger-searchform #sbutton {     margin: 0;     padding: 0;     height: 40px;     width: 74px;     vertical-align: top;     border: none;     background: transparent; } </style> <div id="helperblogger-searchbox">     <form id="helperblogger-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 type="text/css"> #helperblogger-searchbox {     border-radius: 5px;     background: URL(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjWgwzBRB-GFuyLF8ZWPxV2EhDgbJnIMEPNUC2soiR4wWVX_4G9YckQyPQPuUFg1db3TVzEjL3p-8KM1E1JCn8XvxEAjQOYdgOdrjMwE5laaUTg0lXzaZ81i8DEHWW0wzlnmLpCQppokuw/s1600/helperblogger.com-orange.png) no-repeat scroll center center transparent;     width: 307px;     height: 50px;     disaply: block; }   form#helperblogger-searchform {     display: block;     padding: 9px 16px;     margin: 0; }   form#helperblogger-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#helperblogger-searchform #sbutton {     margin: 0;     padding: 0;     height: 40px;     width: 74px;     vertical-align: top;     border: none;     background: transparent; } </style> <div id="helperblogger-searchbox">     <form id="helperblogger-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 type="text/css"> #helperblogger-searchbox {     border-radius: 5px;     background: URL(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjI1T7XIpSYppy0dPkziW5aLSf0_fG52RTanCCKNb5YqYu7ilWAeX7cD5_9RnCHD5gkHrHRcJ3zSpWVBrVYF0BELrLsVtGkhBgFSJjzmS5OpYpEOPwrqlgfOdR2akvS-Bn7LQcmLnOD3O0/s1600/helperblogger.com-purple.png) no-repeat scroll center center transparent;     width: 307px;     height: 50px;     disaply: block; }   form#helperblogger-searchform {     display: block;     padding: 9px 16px;     margin: 0; }   form#helperblogger-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#helperblogger-searchform #sbutton {     margin: 0;     padding: 0;     height: 40px;     width: 74px;     vertical-align: top;     border: none;     background: transparent; } </style> <div id="helperblogger-searchbox">     <form id="helperblogger-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>

ျပီးရင္ေတာ့ Save  ေပါ့ေနာ္။
  ရန္ကုန္သား(နည္းပညာျမိဳ႕ေတာ္) http://mm-knowledge.blogspot.com