Terbaru: Optimasi URL Blog | 10 Tips Mempercepat Blog Load | 30 Strategi SEO | 15 Rahasia Menulis Konten

Ad 468 X 60

Monday, January 28, 2013

Cara Membuat Search Box Dari Google Custom Search Engine

google custom search engine 1
Ketika datang untuk menjelajah internet atau website, pasti tidak ada yang bisa mengalahkan teknik pencarian Google. Template Blogger yang ditemukan dalam berbagai desain dan warna sering memiliki kotak pencarian di dalamnya, yang saya yakin Anda mungkin telah mengamati bahwa dia tidak mampu menampilkan hasil yang relevan. Kotak pencarian ini secara default terbatas pada kemampuan mereka mencari setiap kata dari blog Anda. Solusi terbaik adalah dengan menggunakan Google Custom Search Engine (CSE) yang sangat efisien dalam menggali data yang paling penting dari blog Anda dan menampilkannya kepada pengunjung. Hal ini meningkatkan jumlah pageviews dan tayangan halaman blog Anda karena pembaca terus membaca dan membaca. Selanjutnya Anda dapat dengan mudah mengintegrasikan Google AdSense untuk Iklan Anda dengan kotak Google Custom Search, yang lagi-lagi meningkatkan pendapatan blog Anda untuk setiap klik yang dilakukan pada hasil pencarian. Jadi mari kita membuat dan menginstal sebuah kotak Pencarian Google yang indah untuk blog Anda.

Bagaimana Cara Membuat Custom Google Search Engine?
1. Masuk ke link Google CSE terlebih dahulu
2. Pada halaman yang ditampilkan klik kotak Create a custom search engine.

create custom search engine

3. Isilah form seperti screenshot di bawah ini

google custom search engine 2

4. Setelah selesai Klik tombol Create untuk masuk ke langkah berikutnya.
5. Klik Edit untuk melakukan pensetingan.

google custom search engine 3

6. Pada kolom Control panel, pilih look and feel (Anda pilih layout dan tema yang Anda suka)

google custom search engine 4

  • Jika Anda ingin menambahkan kotak pencarian di bawah postingan, pilih saja Full-width
  • Atau jika Anda ingin menampilkan kotak dan dan hasil pencarian di sidebar, pilih saja Compact
  • Dan bila Anda ingin meletakkan kotak pencarian di sidebar dan menampilkan hasil pencarian di atas judul postingan, pilih saja Two Column. (Saya gunakan contoh ini)
7. Anda juga dapat melakukan setingan lain dari kolom Control panel.
8. Setelah semua selesai, klik "save & get code", maka Anda akan mendapatkan 2 kode seperti di bawah ini.

Catatan: Jangan gunakan kode ini untuk blog Anda. Gunakanlah kode yang Anda dapatkan sendiri!

<!-- Put the following javascript before the closing </head> tag. -->
<script>
  (function() {
    var cx = '016572922667380911963:ljrfouozos8';
    var gcse = document.createElement('script'); gcse.type = 'text/javascript'; gcse.async = true;
    gcse.src = (document.location.protocol == 'https:' ? 'https:' : 'http:') +
        '//www.google.com/cse/cse.js?cx=' + cx;
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(gcse, s);
  })();
</script>
<!-- Place this tag where you want the search box to render -->
<gcse:searchbox></gcse:searchbox>

<!-- Place this tag where you want the search results to render -->
<gcse:searchresults></gcse:searchresults>

Cara Memasang Kode di Atas!
  • Masuk ke Blogger > Template
  • Backup template Anda bila perlu
  • Klik Edit HTML
  • Letakkan kode yang berwarna "Merah" di atas kode </head> (Gunakan Ctrl + F untuk memudahkan pencarian kode)
  • Simpan template Anda
  • Lalu masuk pada Layout
  • Klik Add a Gadget > Pilih HTML/JavaScript > Masukkan kode berwarna Hijau di situ.
  • Klik Save.
  • Klik lagi Add a Gadget > Pilih HTML/JavaScript > Masukkan kode berwarna Biru di situ.
  • Klik Save.
  • Kemudian Drag & Drop gadget yang diciptakan dari kode berwarna biru di atas postingan Anda.
  • Lihat gambar di bawah ini agar lebih jelas.
gadget search engine

Bagi Anda yang menggunakan iklan AdSense, mengubah kotak pencarian default Anda ke Kotak Pencarian Google Custom Search Engine merupakan langkah penting yang harus Anda ambil sedini mungkin. Anda akan melihat perbedaan dalam analisis Anda minggu depan.

Semoga Anda menyukai postingan ini.. :)
Author: Balaputra
Balaputra adalah seorang mahasiswa yang melakukan aktivitas blogging hanya untuk menghabiskan waktu luang.

33 comments:

  1. Makasih ya tutornya... kl punya yg versi wordpress nya mau juga...

    ReplyDelete
    Replies
    1. InsyaAllah jika sy sempat akan sy posting..
      ^^

      Delete
  2. terima kasih sob tutorialnya.
    mau saya coba dulu nih..

    ReplyDelete
  3. Blogwalking sob http://panca-hero.blogspot.com

    ReplyDelete
  4. Akhirnya berkat tutorial di atas berhasil juga bang, lihat di http://reemill.blogspot.com Trims ya info nya

    ReplyDelete
  5. makasih tutorialnya gan, kalo untuk dapat menampilkan hasil pencarian yang kata kuncinya mirip dengan judul posting itu bagai mana ya gan????

    ReplyDelete
    Replies
    1. Maksudnya kata kunci yg mirip dg judul postingan bagaimana sob??

      Delete
  6. terimakasih gan atas infonya salam kenal yah gan
    maaf gan numpang promonya yah
    rajalistrik.com ialah toko online kami yang menjual produk-produk teknik industri terbesar, terlengkap, termurah, dan terpercaya di Indonesia yang menawarkan lebih dari 200.000 item produk dari kurang lebih 200 merek. rajalistrik.com berupaya memudahkan Anda untuk mendapatkan produk-produk teknik yang Anda inginkan dengan jaminan orisinalitas, kemudahan bertransaksi, kecepatan pengiriman, dan harga yang kompetitif.http://rajalistrik.com/

    ReplyDelete
    Replies
    1. Terimakasih kunjungannya neng....
      Sudah sy kunjungi dn mmang banyak sekali produk yg ditawarkan, sukses selalu neng Aulia.. ^^

      Delete
  7. Trims gan atas infonya
    kunjungi balik ya http://idfais.blogspot.com

    ReplyDelete
  8. terus, cara setting tampilan agar terlihat unik gimana mas?

    ReplyDelete
  9. banyak pelajaran berharga yang saya dapatkan dari blog ini, tentang seluk beluk dunia blogger
    makasih sobat.salam kenal

    ReplyDelete
  10. Di coba dulu mas, mudah-mudahan work 100%
    keep posting

    ReplyDelete
  11. Kelihatannya cukup mudah sobat, mudah-mudahan tidak ada kendala pas praktek di blog saya.thanks

    ReplyDelete
  12. Wah jadi kepengen nyobain tutorialnya gan, mudah-mudahan work

    ReplyDelete
  13. Terima kasih ya.. mudah2an bisa membantu Pencarian cepat Belajar VB di Google.
    doain ya biar Blog aku banyak pengunjungnya :)
    http://blog.belajarvb.com

    ReplyDelete
  14. thanks gan, jadi bisa nambah search di website tojan saya.

    ReplyDelete
  15. nice artikelnya, sangat membantu sekali :)
    http://kedaijellygamatgoldg.com/obat-herbal-migren/

    ReplyDelete
  16. Terimakasih atas informasinya :)
    ijin share http://jellygamatgoldg31.com/obat-herbal-stroke/

    ReplyDelete
  17. wihhh mantah tutorialnya, perlu dicoba kanyanya http://giribig.com/

    ReplyDelete
  18. makasih gan membantu sekali buat bangun blog atau web saya (y)
    kunjungi jual airsoft gun murah http://www.dgairsoftgun.com

    ReplyDelete
  19. makasih banyak buat infonya,,

    http://goo.gl/vg9SKo

    ReplyDelete
  20. Thanks sob untuk informasi artikelnya :)
    http://goo.gl/fSVyKh

    ReplyDelete
  21. Saya tidak sengaja menghapus kotak google search yang ada di homescreen.
    Padahal setau saya untuk menghapus kotak google search itu tidak bisa,karena itu sudah settingan pabrik.
    Itu terhapus krn saya habis mendownload 360 cleaner boost,tidak sengaja malah terpencet dan menghilangkan kotak google search.
    Bagaimana cara memunculkannya kembali????

    ReplyDelete

Terimakasih telah berkenan mengunjungi dan meninggalkan komentar di blog ini. Tanggapan Anda selalu kami hargai.