Cara Membuat Search Engine Berwarna Dalam Blog

Sebenarnya untuk Search Engine di dalam blog sudah ada, akan tetapi stylenya masih default. Supaya Tampilannya lebih menarik Search Enginenya di polesi dengan warna sehingga kelihatan cantik.

Dibawah ini cara untuk membuatnya:

1. Login ke Blogger

2. Masuk ke menu Tata Letak

3. Tambah Gadget

4. Pilih +HTML/JAVASCRIPT

5. Tuliskan Script dibawah ini:

=========================================================================

<style type="text/css">

#a-searchbox{

background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiRvHjlB_hJQq0lDwRMcLlSnMktlFU6ZOKld3V22J3LVFNAAEdVjdcNPIwvyLj3Qj1NxrBm45VwDgLSJKbSP46f8wf07MbXqXgsX_fWjInvBOLDQs0vr-k85KV09QBuFJoxMeP1HQj551_j/s1600/lostsector-search-box-gray.png) 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-left:20px;width: 205px;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>

<center>

<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></center>

========================================================================

6. Dan Simpan

Dan lihat hasilnya:

Search Engine