Tutorial Memasang Kotak Pencarian (Search Box) Di Blog

Cara Memasang Search Box atau Kotak Pencarian di Blog,- Kotak Pecarian atau Search Box ialah sebuah kotak yg dipakai untuk mencari isu atau artikel lain pada sebuah Wesite atau Blog. Kotak ini sangat bermanfaat pada blog atau Website yg mempunyai banyak artikel alasannya mungkin isu yg diperlukan pengunjung terdapat di blog tersebut. oleh alasannya itu Search Box sangat mempunyai kegunaan di sebuah Blog/Website.

Search Box Sendiri tidak semua template mempunyainya, alasannya biasanya banyak template yg kita download dari dunia maya atau dari bawaan blogger tidak eksklusif ada. namun bahwasanya blog berplatform blogger sudah menyediakanya tinggal kita cari serta pasang pada hidangan Tata letak. walaupun sudah disediakan, banyak blogger yg kurang menyukainya alasannya tampilanya yg kurang bagus. oleh alasannya itu banyak yg mencari instruksi pemasangan dari dunia maya.

Nah berafiliasi dengan Search Box atau Kotak Pencarian, disini aku pun akan membagikan tutorial mengenai menempatkan Search Box di blog. yg aku khususkan bagi anda-anda semua yg ingin menempatkan kotak pencarian di blog anda yg masih belum ada Search Box. Ok eksklusif saja berikut Tutorialnya,

Cara Memasang Kotak Pencarian (Search Box) di Blog


1. Pertama silahkan Masuk ke Akun Blogger - Template serta Edit HTML

2. Kemudian Silahkan cari instruksi ]]</b:skin>, Gunakan CTRL+F untuk mempermudah pencarian.

3. JJika sudah ketemu selanjutnya silahkan Copy instruksi CSS dibawah ini serta Paste sempurna diatas kode ]]</b:skin>.

/* Search Box by
----------------------------------------------- */
#search-box{
position: relative;
border: 1px solid #ddd;
margin: 5px auto;
}
#search-form{
height: 30px;
-moz-border-radius: 3px;
-khtml-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
background: #fff;
overflow: hidden;
}
#search-text{
color: #ccc;
border-width: 0;
}
#search-box input[type="text"]{
width: 100%;
padding: 7px 0 7px 7px;
outline: none;
}
#search-button{
position: absolute;
top: 0;
right: 0;
height: 30px;
margin: 0;
text-align: center;
line-height: 0;
border-width: 0;
background: whitesmoke;
cursor: pointer;
font-size: 12px;
font-weight: bold
}

4. Terakhir Simpan Template.

Langkah selanjutnya ialah memunculkan Kotak Pencarian (Search Box) di Widget Blog, untuk caranya sanggup dilihat dibawah ini.

5. Selanjutnya Masuk ke Tata Letak - Tambahkan Gadget kemudian Pilih HTML/Java Script.

6. Selanjutnya silahkan kasih judul atau tidak dikasih pun tidak apa-apa kemudian masukkan instruksi CSS dibawah ini pada bab kolom HTML.

<div id='search-box'>
<form action='/search' id='search-form' method='get' target='_top'>
  <input id='search-text' name='q' onblur='if (this.value == &quot;&quot;) {this.value = &quot;Search..&quot;;}' onfocus='if (this.value == &quot;Search..&quot;) {this.value = &quot;&quot;}' type='text' value='Search..'/>
  <button id='search-button' type='submit'>GO</button>
</form>
</div>

7. Terakhir Tinggal Simpan.

Panjang Search Box di atas akan menyesuaikan ukuran widget pada blog anda, oh ya hampir lupa search box diatas kodenya aku ambil dari Template Premium Speed up. sekian tutorial blog yg sanggup aku bagikan serta Terima kasih.

Artikel Terkait