Menambahkan Kotak Pencarian Pada Tab Menu Navigasi Blog

Apabila blog yang saudara kelola pada menu navigasi standar ingin ditambahkan Google Pencarian Kustom atau kotak penelusuran google seperti pada menu navigasi yang terdapat diblog ini atau gambar diatas, dapat kita tambahkan disamping atau berada tepat disisi kanan menu navigasi. Karena pada umumnya widget kotak pencarian tersebut ditempatkan berada dibagian sidebar blog, bila ditambahkan secara manual melalui Tata Letak, add gadget.

Berbeda jika kita menambahkan menu navigasi yang telah dilengkapi dengan alat/kotak penelusuran dengan berbagai kode css, html dan java script yang disediakan oleh pembuat tutorial dan kebanyakan pengguna template standar lebih memilih menggunakan menu navigasi oleh pihak ketiga. Tetapi sebenarnya laman/ tab menu navigasi standar pada blogger dapat kita modifikasi, sehingga memiliki desain yang menarik pula.

Dan juga bagi pengguna kustom template, apabila anda menggunakan menu navigasi horizontal yang ditambahkan melalui menu laman pada halaman dashbor blogger, dapat pula menerapkan tekhnik yang dimaksud pada pembahasan ini. Tetapi jika tab menu navigasi yang anda gunakan atau mungkin pada template anda sudah ada kotak pencarian, dilewatkan saja, karena cara ini diterapkan bagi yang ingin menambahkan kotak penelusuran yang belum dibuat sebelumnya.

Untuk menerapakan cara tersebut, silahkan sobat buka judul Cara Membuat Google Pencarian Kustom yang telah diterbitkan dahulu, dengan maksud agar bisa mendapatkan ID mesin telusur anda, yang nantinya dapat disisipkan pada kode setelah ini. Jika sudah selasai membuat, silahkan lanjutkan dengan cara dibawah ini dan selesaikan secara berurutan.

1. Pastikan saudara telah masuk terlebih dulu pada blog yang dikelola.

2. Pilih menu Template pada halaman dashbor.

3. Backup Template dengan cara klik tombol Pulihkan/Cadangkan, menjaga kemungkinan terjadi eror dan akan lebih bagus buat salah satu blog percobaan untuk menerapkan cara yang dimaksud

4. Selanjutnya klik Unduh Template.

5. Klik Edit Template > setelah layar editor template terbuka ceklis atau centang pada kotak Expand Widget Template.

6. Cari kode <li><a expr:href='data:link.href'><data:link.title/></a></li>.

7. Untuk mepercepat pencarian gunakan Ctrl F pada keyboard dan apabila telah menemukannya, copy kode dibawah ini dan sisipkan tepat dibawah kode </b:loop> yang berada beberapa baris dibawah kode <li><aexpr:href='data:link.href'><data:link.title/></a></li>.

<div class='cse' style='color:#000000;align:right;float:right;margin:1px 3px 1px 3px ;'>

<form action='http://www.google.com/cse' id='cse-search-box' target='_blank'>

<input name='cx' type='hidden' value=’Ganti_Id_Mesin_Telusur_Anda'/>

<input name='q' size='25' type='text'/>

<input name='ie' type='hidden' value='ISO-8859-1'/>

<input name='sa' type='submit' value='Pencarian'/>

</form>

<script src='http://www.google.com/cse/brand?form=cse-search-box&amp;lang=id' type='text/javascript'/>

</div>

8. Ganti ID mesin telusur yang diberi warna pada struktur kode diatas.

9. ID mesin telusur tersebut dapat saudara lihat pada kode JavaScript yang telah dijelaskan pada artikel terdahulu. Id yang dimaksud contohnya seperti ini : ‘02917523360222222:zkoadbyyyyy'

10. Untuk melihat hasilnya klik Pritinjau, apabila tidak terjadi eror klik Simpan Template.

Keterangan :

• Jangan lupa untuk ’Ganti_Id_Mesin_Telusur_Anda’ yang telah disebutkan pada uraian diatas.
• size='25', untuk menentukan panjang kotak Google Pencarian Kustom, silahkan disesuaikan

• Kata 'Pencarian', bisa anda ganti dengan, misalnya : Cari.

Selamat mencoba.

Salam...