Tips Membuat Menu Search Engine Dengan Tampilan Image Background

Pas lagi jalan-jalan lagi deh ama selingkuhan hehehehe....dapaet inspirasi dari sebelah nih, mengenai pembuatan search engine dengan background buatan tutorial-jitu



Langsung aja ya, gini2 :

1. Login ke blog kita

2. Layout --> Edit HTML

3. Backup dulu deh biar aman

4. Cari script ---> ]]></b:skin>

5. Kemuadian copy & pastekan script dibawah dini dan letakkan diatas-nya ---> ]]></b:skin>


#searchform {<br><br />position:letf;<br><br />top: 20px;<br><br />right: 0px;<br><br />background: url(http://anas.ku93.googlepages.com/search-back.gif) no-repeat <br />right bottom;<br><br />height: 59px;<br><br />width: 210px;<br><br />}<br><br />#searchform #s{<br><br />background: #ffffff <br />url(http://i254.photobucket.com/albums/hh92/eblogtemplates/itheme/form-field-bg.gif) <br />no-repeat ;<br><br />height: 17px;<br><br />width: 148px;<br><br />margin: 30px 5px 0px 10px;<br><br />padding: 3px 7px 2px 5px;<br><br />color: #999999;<br><br />border: none;<br><br />}<br><br />#searchform #searchsubmit {<br><br />background: <br />url(http://i254.photobucket.com/albums/hh92/eblogtemplates/itheme/searchbtnnk7.png) <br />no-repeat left top;<br><br />height: 24px;<br><br />width: 24px;<br><br />border: none;<br><br />text-indent: -999%;<br><br />line-height: 1px;<br><br />margin-top: 6px;<br><br />}<br />


6. Simpan Template

7. Langkah selanjutnya adalah masuk menu Layout ---> Page Elements

8. Kemudian pilih HTML/JavaScript kemudian Taruh script dibawah ini.


<form id="searchform" action="/search" method="get"><br><br /><div><br><br /><input ;}="onfocus=" onclick="if(this.value=='Seaech Article')this.value='';" <br />value="Seaech Article" if type="text" id="s" <br />onblur="if(this.value=='')this.value='Seaech Article';" name="q/"/><br><br /><input id="searchsubmit" value="Go" type="submit"/><br><br /></div><br><br /></form>

9. Simpan dan selesai