Search Engine atau Kotak Pencarian sederhana

Hai agan-agan kali ini saya akan menjelaskan tentang tutorial menarik Yaitu, cara membuat search engine kotak pencarian sederhana, tapi sekarang saya membuat search engine di blog anda lebih menarik dengan background gambar dan tombol sumbit juga ada gambarnya, menurut kamu menarik gak sih search engine yang kaya begini..??? kalau kamu belum mengerti juga coba lihat gambar di bawah ini contoh search engine yang sangat menarik

Gemana menurut Agan-agan Menari ngakk.... kalo menarik silahkan ikutu tutorial berikut..>>

1. Login ke blogger Agan terdahulu

2. Kemudian cari Layout kemudian masuk Edit HTML Lalu taruh Code

3. Dibawah diatas Code ]]></b:skin>

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

4. Kemudian Simpan Template
5. Lalu langkah selanjutnta adalah masuk menu Layout ---> Page Elements
6. Pilih tempat yang mau dipasangi Search engine kemudian Add A Gadget
7. 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>

8. Lalu Simpan and............ coba liat hasil nee...???

Nah jika kamu ingin membuat karyamu sendiri silahkan ganti link backroundnya yahh dan atur penempatanya okey

http://sites.google.com/site/anasku2000/search-back.gif ---> Ini adalah Link Backgroundya

http://sites.google.com/site/anasku2000/form-field-bg.gif -----> Ini Background Form

http://sites.google.com/site/anasku2000/searchbtnnk7.png ---> Ini Tombol Submitnya

BACKGROUND YANG BISA AGAN-AGAN GUNAKAN

http://sites.google.com/site/anasku2000/search-back.png

http://sites.google.com/site/anasku2000/search-qwu.png

Terimakasih atas kunjungan anda semoga bermanfaat..

Search Engine atau Kotak Pencarian sederhana

Related Posts