دروستکردنی ( سێرچ بۆکس ) ( Search Box ) بۆ بلۆگەرەکەت

دروستکردنی ( سێرچ بۆکس ) ( Search Box ) بۆ بلۆگەرەکەت بە شێوازێکی نوێ و بە ڕەنگی جیاواز

١ -  بچۆرە ‌حسابەکەت لە بلۆگەر و Layout بکەرەوە  .

٢ -   کلیک لەسەر Add Gadget and select بکەوHTML/Javascript’ هەڵبژێرە ‘ 

٣ -  پاشان ئەم کۆدەی لای خوارە کۆپی بکە و لەوێ پەیستی بکە و پاشان کلیک لەسەر  Save arrangement بکە  واتە سەیڤی بکە .

بۆ ستایلی ( ١ )

<style type="text/css"> #w2b-searchbox{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjlkvyv1m8gzoi7cgY6M_PSZIK62aNnsrbSFQnTaaQIn6QlVPoymVlMy7N-tBJKKyZSTSX5rV2oQH2A5kOXG9WKSbIvhP-a_8mSJzu-IiVqUblMNCLwrF9xHQygPInKJhcpR5fIzhIQoIe0/) no-repeat scroll center center transparent;width:307px;height:50px;disaply:block;} form#w2b-searchform{display: block;padding: 10px 12px;margin:0;} form#w2b-searchform #s{padding: 6px;margin:0;width: 235px;font-size:14px;vertical-align: top;border:none;background:transparent;} form#w2b-searchform #sbutton{margin:0;padding:0;height:30px;width:30px;vertical-align: top;border:none;background:transparent;} </style> <div id="w2b-searchbox"> <form id="w2b-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"> #w2b-searchbox{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhv30eL31SN1ubRpKT4p-dJiPsNicBKjfiBEYFJfyKrMjbNbJAz11ky-hzjAvn4XHlM0VLiRbO2xOmKp31rO8vY0ShI7KCW1_J8XxHUtk8RYo9fMw2984aso8zC7vYDQ0aqQvDciOvlRGmu/) no-repeat scroll center center transparent;width:307px;height:50px;disaply:block;} form#w2b-searchform{display: block;padding: 10px 12px;margin:0;} form#w2b-searchform #s{padding: 6px;margin:0;width: 235px;font-size:14px;vertical-align: top;border:none;background:transparent;} form#w2b-searchform #sbutton{margin:0;padding:0;height:30px;width:30px;vertical-align: top;border:none;background:transparent;} </style> <div id="w2b-searchbox"> <form id="w2b-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"> #w2b-searchbox{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh-E6ZhOJ__RB2iflb_-E7jYHePr7yf0Wz9k_7I3Mz5H06Md0zuFmaWZJfTA6V4_Fv_dAqCvNDLsHO1JwLQOKjiTF4vzkiEnh9_X2L6aufdQJs-NO8jE8A8CKwttVJbwmSVNpsNBDAKpce-/) no-repeat scroll center center transparent;width:307px;height:50px;disaply:block;} form#w2b-searchform{display: block;padding: 10px 12px;margin:0;} form#w2b-searchform #s{padding: 6px;margin:0;width: 235px;font-size:14px;vertical-align: top;border:none;background:transparent;} form#w2b-searchform #sbutton{margin:0;padding:0;height:30px;width:30px;vertical-align: top;border:none;background:transparent;} </style> <div id="w2b-searchbox"> <form id="w2b-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"> #w2b-searchbox{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhl0LikjgFq0nvZaEQKeBDLz97kuhD1W3rI5AP9jGlM6gpsT9DLflkvRSF-DfzVcQ1nY1Ldbe3uqyQgQ8lYBJ0OqsvABgBeVgdJbouyEHgH9WEyuoXYen1NvFkOirXVlAcBzaQNI-t-bbOr/) no-repeat scroll center center transparent;width:307px;height:50px;disaply:block;} form#w2b-searchform{display: block;padding: 12px;margin:0;} form#w2b-searchform #s{padding: 6px 6px 6px 26px;margin:0;width: 215px;font-size:14px;vertical-align: top;border:none;background:transparent;} form#w2b-searchform #sbutton{margin:0;padding:0;height:30px;width:30px;vertical-align: top;border:none;background:transparent;} </style> <div id="w2b-searchbox"> <form id="w2b-searchform" action="/search" method="get"> <input type="text" id="s" name="q" value=""/> <input type="image" src="http://img1.blogblog.com/img/blank.gif" id="sbutton" /> </form> </div>

بۆ ستایلی ( ٥ )

<style type="text/css"> #w2b-searchbox{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhNI-Rt9fk-MFo4Hjb4WuoK8VnuTRvoT7C0xIctangiY1XO4PJflHaGJA-c4nvs0iNfWCoztqdmqm0xm9cHp0Ew7_vXlh9fS1DJD0YAnFxMA4OqiP-IELd66s6A0_Zh9DW28_3dCDymJtol/) no-repeat scroll center center transparent;width:307px;height:50px;disaply:block;} form#w2b-searchform{display: block;padding: 12px;margin:0;} form#w2b-searchform #s{padding: 6px 6px 6px 26px;margin:0;width: 215px;font-size:14px;vertical-align: top;border:none;background:transparent;} form#w2b-searchform #sbutton{margin:0;padding:0;height:30px;width:30px;vertical-align: top;border:none;background:transparent;} </style> <div id="w2b-searchbox"> <form id="w2b-searchform" action="/search" method="get"> <input type="text" id="s" name="q" value=""/> <input type="image" src="http://img1.blogblog.com/img/blank.gif" id="sbutton" /> </form> </div>

بۆ ستایلی ( ٦ )

<style type="text/css"> #w2b-searchbox{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhP9xCZsO9qUI4FVxg5sla1NdE0aDJUvCEyNCETm4ISHmh7MqXTI4-ZujTgIxRWR-2N8NmKLF013i8yt2ZAj2KWOfr_eXHe95u9JL674q1FWe3Fh4YbAeru_QHl9NJGeZnr009zr1F0oJaR/) no-repeat scroll center center transparent;width:307px;height:50px;disaply:block;} form#w2b-searchform{display: block;padding: 12px;margin:0;} form#w2b-searchform #s{padding: 6px 6px 6px 26px;margin:0;width: 215px;font-size:14px;vertical-align: top;border:none;background:transparent;} form#w2b-searchform #sbutton{margin:0;padding:0;height:30px;width:30px;vertical-align: top;border:none;background:transparent;} </style> <div id="w2b-searchbox"> <form id="w2b-searchform" action="/search" method="get"> <input type="text" id="s" name="q" value=""/> <input type="image" src="http://img1.blogblog.com/img/blank.gif" id="sbutton" /> </form> </div>