Home / Tutorial Blogger / Pasang 6 Pilihan Widget Search Box di blog

Pasang 6 Pilihan Widget Search Box di blog

Posted by Rezqy Dwikara Goratama 23 Maret 2012
Pasang 6 Pilihan Widget Search Box di blog - Widget Search box adalah widget pencari yang dipasang di blog berfungsi seperti mesin pencari, Widget ini sangat membantu para pengunjung untuk mencari artikel yang diinginkan, pengunjung hanya tinggal menulis dan mengeklik gambar search disampingnya.





Jika ada yang ingin memasang widget ini silahkan ikuti langkah - langkah berikut ini :

1. Login ke Blogger
2. Masuk ke tata letak -> tambah widget / gadget -> Html/JavaScript
3. Copy paste code dibawah ini ( pilih salah satu ) :

Kode Widget search ini diurutkan sesuai gambar diatas

  • Widget Search box 1



<style type="text/css"> #a-searchbox{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj19qC2aRLsV-D5-s-cWQvtynTclh_byOq7sW1cdzGZxBXngCmg0OMfZ6aoGMTBTksXXMU2kRNMNfnPPLS3QYNGuLvcOMxBFv6f3ma1idVpgaNsTK9juiOFzARRSaMfpygnYGNhpXw9UJ36/) no-repeat scroll center center transparent;width:307px;height:50px;disaply:block;} form#a-searchform{display: block;padding: 10px 12px;margin:0;} form#a-searchform #a{padding: 6px;margin:0;width: 235px;font-size:14px;vertical-align: top;border:none;background:transparent;} form#a-searchform #abutton{margin:0;padding:0;height:30px;width:30px;vertical-align: top;border:none;background:transparent;} </style> <div id="a-searchbox"><form id="a-searchform" action="/search" method="get">    <input type="text" id="a" 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="abutton" /> </form></div>



  • Widget Search box 2



<style type="text/css"> #b-searchbox{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjUS0vcY4bGdgxWM1Uu2_Tgak4jI26dv0TRNdCbC9L3e83poKw-llttYieF4XdftgGRzL7D0_tiALKCvzS8a3SAPYvh4E2Zq7EbVSm5uvkKpPKO0P3R1li-cKeo5DkZc1seH7L1PLNiHttW/) no-repeat scroll center center transparent;width:307px;height:50px;disaply:block;} form#b-searchform{display: block;padding: 10px 12px;margin:0;} form#b-searchform #b{padding: 6px;margin:0;width: 235px;font-size:14px;vertical-align: top;border:none;background:transparent;} form#b-searchform #bbutton{margin:0;padding:0;height:30px;width:30px;vertical-align: top;border:none;background:transparent;} </style> <div id="b-searchbox"><form id="b-searchform" action="/search" method="get">    <input type="text" id="b" 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="bbutton" /></form></div>



  • Widget Search box 3



<style type="text/css"> #c-searchbox{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEijKh2G5L-mrdhJ_vLkAn8DaKCvmzz3fD-DtBVYM8gWX8vTIKB8ukHd-_KXgjXxFh94ZQN8f1uUVBgaKVo8F8lRzjrwHv4IVCbP9aRUsNDi1K5qB1NsHi-LbwJPbd50xsyXAABkSit6_nUw/) no-repeat scroll center center transparent;width:307px;height:50px;disaply:block;} form#c-searchform{display: block;padding: 10px 12px;margin:0;} form#c-searchform #c{padding: 6px;margin:0;width: 235px;font-size:14px;vertical-align: top;border:none;background:transparent;} form#c-searchform #cbutton{margin:0;padding:0;height:30px;width:30px;vertical-align: top;border:none;background:transparent;} </style><div id="c-searchbox"><form id="c-searchform" action="/search" method="get">    <input type="text" id="c" 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="cbutton" /></form></div>



  • Widget Search box 4



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



  • Widget Search box 5



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



  • Widget Search box 6



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




4. Simpan



Selamat mencoba, semoga berhasil - Pasang 6 Pilihan Widget Search Box di blog
 



Description: Pasang 6 Pilihan Widget Search Box di blog
Rating: 5
Reviewer: 98827 ulasan
Item Reviewed: Pasang 6 Pilihan Widget Search Box di blog 		Peluang Bisnis Online

Baca Juga Artikel Ini :

Categories:

If You Like This Post, Share it With Your Friends

Copyright © Habluez Share | Created by Blog Bamz | Edit by Habluez Share