Modifikasi Kotak Search di Blog Agar Kelihatan Lebih Keren

Modifikasi Kotak Search di Blog Agar Kelihatan Lebih Keren

Pada Tutorial Blog kali ini saya akan share tentang Modifikasi Kotak Search di Blog Agar Kelihatan Lebih Keren, apakah sobat pernah berpikir bahwa widget search di blog sobat kurang menarik dan tidak sesuai dengan tamplate blog sobat maka untuk memodifikasi kotak search di blog sobat ikutilah langkah-langkah nya di bawah ini
1. Login ke blogger
2. Masuk ke menu Tamplate
3. Klik Edit HTML
4. Cari kode ]]></b:skin> (gunakan CTRL+F untuk mencari)
5. Masukkan kode di bawah ini dan letakkan diatas kode ]]></b:skin>

#searchform {
position:letf;
top: 20px;
right: 0px;
background: url(https://sites.google.com/site/cheatssoul/searchmodification/search-blue-1.png) no-repeat right bottom;
height: 59px;
width: 210px;
}
#searchform #s{
background: #ffffff url(https://sites.google.com/site/cheatssoul/searchmodification/form-field-bg.gif.png) no-repeat ;
height: 17px;
width: 148px;
margin: 30px 5px 0px 10px;
padding: 3px 7px 2px 5px;
color: #999999;
border: none;
}
#searchform #searchsubmit {
background: url(https://sites.google.com/site/cheatssoul/searchmodification/searchbutton.png) no-repeat left top;
height: 24px;
width: 24px;
border: none;
text-indent: -999%;
line-height: 1px;
margin-top: 6px;
}

6. Kemudian klik save tamplate
7. Lalu langkah selanjutnya adalah masuk menu Layout
8. Pilih tempat yang mau dipasangi Search engine kemudian Add A Gadget
9. Lalu pilih HTML/JavaScript kemudian Taruh Code Dibawah Kedalamnya
 

<form id="searchform" action="/search" method="get">
<div>
<input type="text" id="s" value="" name="q" />
<input id="searchsubmit" value="Go" type="submit" />
</div>
</form>

10. Lalu klik Simpan

Nah jika sobat ingin membuat karya sendiri silahkan ganti link backroundnya yahh dan atur penempatanya okey
https://sites.google.com/site/cheatssoul/searchmodification/search-blue-1.png ---> Ini adalah Link Backgroundya
https://sites.google.com/site/cheatssoul/searchmodification/form-field-bg.gif.png---> Ini Background Form 
https://sites.google.com/site/cheatssoul/searchmodification/searchbutton.png ---> Ini Tombol Submitnya




Sobat juga bisa mengganti background nya menjadi warna hitam seperti gambar di bawah ini

Tukar url https://sites.google.com/site/cheatssoul/searchmodification/search-blue-1.png menjadi https://sites.google.com/site/cheatssoul/searchmodification/search-black.png




Luangkan waktu sobat untuk memberi komentar..