Membuat Kotak Pencarian (Search Box)

Membuat Kotak Pencarian (Search Box) - Hallo guys,mimin mau share nih Tutorial Blog di Blogrenanda, Pada sharing Tutorial Blog kali ini yang berjudul Membuat Kotak Pencarian (Search Box), saya telah menyediakan Tutorial Blog lengkap seperti Membuat Kotak Pencarian (Search Box) . mudah-mudahan isi postingan tutorial yang mimin tulis ini dapat anda pahami. okelah, ini dia tutorialnya.

Membuat Kotak Pencarian (Search Box) | Tutorial Blog

Tutorial kali ini saya akan berbagi cara Membuat Kotak Pencarian (Search Box).
Berikut caranya :
  • Login ke Dasbor blogger, klik Design (Rancangan) > Edit HTML, Taruh kode ini di atas kode  ]]></b:skin>
    berikut kodenya:
    #search {
    width: 280px;
    font-size: 11px;
    float: right;
    margin: 0;
    padding: 6px 0 0;
    }
    #searchform {
    margin: 0;
    padding: 0;
    overflow: hidden;
    display: inline;
    }
    #searchbox {
    background: #84CAF6;
    width: 220px;
    color: #000;
    margin: 0;
    padding: 4px 0 3px 5px;
    border: 1px solid #005BC3;
    display: inline;
    font: normal 12px Georgia, Times New Roman, Trebuchet MS;
    }
    #searchbutton {
    background: #84CAF6 !important;
    color: #000;
    margin: 0 0 0 5px;
    padding: 3px 3px 2px;
    border: 1px solid #005BC3;
    font: bold 11px Georgia, Times New Roman, Trebuchet MS;
    }
  • Save Template.
  • Sekarang ke Page Element, klik Add a Widget > HTML/Javascript Masukkan kode ini di dalam area content.
  • <div id='search'>
    <form action='/search/' id='searchform' method='get' style='display:inline;'>
    <input id='searchbox' maxlength='200' 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...'/>
    <input class='btn' type='submit' value='Go'/>
    </form>
    </div>
  • Save dan lihat hasilnya.
Semoga bermanfaat...!

Artikel lainnya :


Demikianlah Artikel Membuat Kotak Pencarian (Search Box)

Sekian Tutorial dari Blogrenanda Membuat Kotak Pencarian (Search Box), mudah-mudahan bisa memberi manfaat untuk anda semua. baiklah, sekian postingan dari BlogRenanda.

lihat juga


Membuat Kotak Pencarian (Search Box)


Anda sedang membaca artikel Membuat Kotak Pencarian (Search Box) dan artikel ini url permalinknya adalah https://blogrenanda.blogspot.com/2011/11/membuat-kotak-pencarian-search-box.html Semoga artikel ini bisa bermanfaat.

Subscribe to receive free email updates:

0 Response to "Membuat Kotak Pencarian (Search Box)"

Post a Comment