Artikel Copas 100%

Berbagi seadaanya.

Select Menu
  • Home
  • Blogging
    • Tutorial Blogspot
    • CSS
    • jQuery
    • Widget
  • Tools
    • Font Awesome
    • HTML Editor
    • HTML Encrypter
    • Code Color
    • Responsive Cek
  • Sitemap
  • Static Page
  • Error Page
Home » Blogging » Membuat Google Custom Search Engine di Blogger

Minggu, 12 Januari 2014

Membuat Google Custom Search Engine di Blogger

Add Comment
Blogging
Artikel ini akan menjelaskan bagaimana cara membuat Google Custom Search Engine (CSE), setelah itu akan di berikan tutorial memasang mesin pencari google ubahsuaian di blogger, sehingga akan memudahkan pengunjung dalam melakukan penelusuran setiap konten yang di inginkan pengunjung blog Anda. Ini merupakan tutorial membuat Google Custom Search Engine terbaru dan memasang di blogger tampilan baru 2014.

Google Custom Search Engine adalah fasilitas yang di sediakan google dalam sebuah pencarian yang disesuaikan, dibangun menggunakan teknologi pencarian inti Google, yang memprioritaskan atau membatasi hasil pencarian berdasarkan situs dan halaman yang Anda tentukan.

Intinya kita dapat menggunakan Google Custom Search Engine sebagai alat untuk memudahkan para pengunjung dalam mencari setiap apa yang mereka butuhkan, yang mana pada pencarian tersebut hanya dibatasi pada apa yang terdapat didalam situs kia sendiri. Jadi setiap konten yang ada pada situs kita akan di tampilkan di hasil pencarian berdasarkan kata kunci yang mereka masukkan/ketik.

Membuat Google Custom Search Engine di Blogger

Sebagai contohnya Anda dapat mencoba kotak pencarian blog ini yang berada di sidebar kanan atas blog ini. silahkan masukkan kata kunci pencarian Anda. Maka Anda akan mendapatkan apa yang anda cari di blog ini. (Jika Belom Ganti)


Jika Anda tertarik untuk membuat Google Custom Search Engine serta menerapkannya pada situs/blog milikmu, Anda dapat mengikuti panduan di bawah ini.

Hal yang pertama yang harus Anda lakukan adalah membuat pages/halaman statis baru di blogger, ini akan digunakan untuk menampilkan hasil pencarian.

Membuat Google Custom Search Engine.

Step Pertama
Membuat Google Custom Search Engine di Blogger
  • Pergi ke http://www.google.com/cse.
  • Pilih New Search Engine Lihat gambar No.1
  • Dan kemudian masukkan URL blog Anda Lihat gambar No.2
  • Pilih bahasa Anda -> klik Create Lihat gambar No.3
  • Masukkan nama blog atau website Anda Lihat gambar No.4
  • Klik Buat atau Create Lihat gambar No.4
Step Kedua
  • Setelah anda Klik Buat atau Create makan akan di arahkan ke tampilan seperti ini.
Membuat Google Custom Search Engine di Blogger
  • Klik Paneh Kontrol lihat gambar di atas yg bertanda panah merah.
  • Maka selanjutnya anda akan di bawa ke halaman seperti ini.
Membuat Google Custom Search Engine di Blogger
  • Anda dapat memasukkan nama mesin pencari Anda dan deskripsi mesin pencari Anda, masukkan kata kunci mesin pencari, juga mengaktifan gambar di mesin pencari Anda.
  • Sekarang pilih Look And Feel atau Tampilan dan Nuansa di sebelah kiri. Lihat gambar No.1
  • Selanjutnya Anda akan di arahkan ke halaman seperti ini..
Membuat Google Custom Search Engine di Blogger
  • Pilih Result Only atau Hasil saja pada layout Lihat gambar No.1
  • Kemudian klik Save & Get code Lihat gambar No.2
  • Setelah Anda simpan akan di arahkan ke gambar di bawah ini
Membuat Google Custom Search Engine di Blogger
  • Silahkan simpan Kode tersebut ke dalam Notepad
Step Ketiga

  • Pergi ke Blogger Dasboard -> Laman -> Laman baru -> Laman Kosong.
  • Dan Anda dapat memberikan nama halaman Anda dengan "Hasil pencarian", atau terserah Anda.
  • Kemudian Copy kode yg tadi kamu letakan di Notepad dan Paste ke dalam HTML halaman Anda -> Perbarui / Update.
  • Selanjutnya buat Form Seach misalkan seperti ini
<form action='http://the-anarchyta.blogspot.com/p/search-results.html' id='cse-search-box'>
<input name='cx' type='hidden' value='0013059287802069715:2r9aade1hpa'/>
<input name='cof' type='hidden' value='FORID:10'/>
<input name='ie' type='hidden' value='ISO-8859-1'/>
<input id='search-text' name='q' onblur='if (this.placeholder == "") {this.placeholder = "Cari artikel di blog ini...";}' onfocus='if (this.value == "Cari disini..") {this.value = ""}' placeholder='Cari artikel di blog ini...' type='text'/>
<button id='search-button' type='submit'></button>
</form>
0013059287802069715:2r9aade1hpa Silahkan Anda ganti dengan id Kode yg tadi kamu letakkan Notepad Contoh
<script>
  (function() {
    var cx = '0013059287802069715:2r9aade1hpa'; //Kode yg di Ganti
    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>
<gcse:searchresults-only></gcse:searchresults-only>

Sekarang Anda hanya pelu melakukan uji coba pada kotak pencari yang telah Anda pasang tadi, silahkan ketik kata kunci yang Anda cari dan tekan tombol cari. jika berhasil, maka Anda akan di alihkan ke Laman Hasil pencarian dan mendapatkan beberapa hasil dari pencarian Anda. Enjoy!
Suka Artikel? Bagikan: Facebook Twitter Google+
0 Komentar untuk "Membuat Google Custom Search Engine di Blogger"

Posting Lebih Baru Posting Lama Beranda
Langganan: Posting Komentar (Atom)

Popular Week

  • EDU Backlink
    EDU Backlink
    Backlink .EDU sekarang ini masih menjadi incaran bagi para blogger untuk menaikkan ranking situs/blog mereka, tapi kadang-kadang kita meras...
  • Bosan Dengan Dunia Blogger..
    Bosan Dengan Dunia Blogger..
    Selamat pagi sobat semua.. Mungkin anda sudah merasakan suatu kejenuhan yang anda alami saat ini dengan blog anda mungkin pertama anda membu...
  • About This Tattoo
    About This Tattoo
    Apa itu Tattoo? Dalam Bahasa Indonesia disebut dengan istilah "Rajah". Tattoo merupakan produk dari Body Decorating dengan mengga...
  • Opini Tentang Blog Ini
    Opini Tentang Blog Ini
    Sejauh ini saya sudah merasa bersalah dengan apa yang saya share.  Beberapa hal gak penting terkadang juga saya share sampai sampai sobat bi...
  • Optimasi Posting Blog
    Optimasi Posting Blog
    Yang namanya sebuah blog, tentu tidak terlepas dari posting. Posting dalam blogger merupakan sebuah "entry" yang ditulis dengan me...
  • 7 Apps Android Untuk Pengguna Blogger
    7 Apps Android Untuk Pengguna Blogger
    Dibawah ini adalah 7 AplikasiAdroid yang populer dan banyak digunakan oleh pengguna Blogger. Dan sebagai seorang pengguna blogger tidak ada ...
  • Free Download Smadav 9.3 Pro Full Version + Serial Number
    Free Download Smadav 9.3 Pro Full Version + Serial Number
    Semenjak Blogger saya di hapus saya jarang update di Faceblog jadi ketinggalan software yang sudah update deh, tapi gak apa apa daripada g...
  • Menampilkan Pesan Pada Jam Tertentu
    Menampilkan Pesan Pada Jam Tertentu
    Pernah terpikirkan untuk menampilkan pesan pada jam tertentu (Time Message) pada blog kita? tentu saja ya, Ada kalanya ketika sedang tidak o...
  • Scattered Polaroids Gallery (Tersebar)
    Scattered Polaroids Gallery (Tersebar)
    Sebuah flat bergaya Polaroid Galeri di mana item-item (di sini saya gunakan foto) yang tersebar secara acak dalam sebuah wadah (Container). ...
  • Karma - Creative Landing Page Blogger Templates
    Karma - Creative Landing Page Blogger Templates
    Karma adalah template untuk blogger yang menyediakan banyak fitur yang luar biasa yang paling canggih. Template ini sangat maju, mungkin sed...
Diberdayakan oleh Blogger.

Labels

  • Android
  • Blogging
  • CSS
  • Facebook
  • Game
  • jQuery
  • Komputer
  • Lain-Lain
  • Photoshop
  • SEO
  • Software
  • Template
  • Twitter
  • Widget

Blog Archive

  • ▼  2014 (101)
    • ►  Juli (5)
    • ►  Juni (10)
    • ►  Mei (12)
    • ►  April (12)
    • ►  Maret (11)
    • ►  Februari (14)
    • ▼  Januari (37)
      • Pop Up Facebook Like Box With Lightbox Effect Vali...
      • Dynamic Mag Responsive Blogger Template
      • Adobe Photoshop Cs6
      • Headline Breaking News di Blog
      • Faster Vsand Blogger Templates SEO Valid HTML5 Res...
      • Loading Page Blogger
      • Floating Social Share Buttons for Blogger
      • Recent Comment Blogger Valid HTML5
      • Recent Posts Slider With Navigation
      • List Icon Font Awesome dan CSS Value Content V4.0.3
      • Tips SEO Dari Google [Download]
      • Karma - Creative Landing Page Blogger Templates
      • Compact News Previewer with jQuery
      • Polaroid Photobar Gallery with jQuery
      • Hover and Click Trigger for Circular Elements with...
      • CSS3 Lightbox
      • jQuery Image Slider With Three Panels and 3D Look
      • Accordion Style Slider with Valid CSS3
      • Slide Show jQuery Carousel
      • Menambah Tombol Open / Close pada Blog
      • 7 Apps Android Untuk Pengguna Blogger
      • Timely Alarm Clock - Bitspin Sekarang Gratis Setel...
      • Aplikasi Kamera Android Terbaik Pilihan 2014
      • Icon Social Share dengan Tooltip
      • Membuat Google Custom Search Engine di Blogger
      • Popular Posts Multi Color Flat UI
      • Photo Collage Max 2.2.5.6 Full Crack
      • Blackberry Messenger for PC
      • RespoAum Responsive Blogger Template
      • Elegant Photography Blogger Template
      • News Pro Responsive Blogger Template
      • iNews 2014 Responsive Blogger Template
      • Label Cloud CSS Blogger (Versi Hijau)
      • Widget Kotak Berlangganan With Sosial Icons
      • Cara Mengaktifkan dan Setting Robot.txt Pada Blog
      • Membuat Breadcrumbs Terindex Oleh Google
      • Cara Membuat Menu Navigasi Vertical Di Blog
  • ►  2013 (71)
    • ►  Desember (13)
    • ►  November (6)
    • ►  Agustus (1)
    • ►  Juni (8)
    • ►  Mei (33)
    • ►  April (10)

Labels

  • Android
  • Blogging
  • CSS
  • Facebook
  • Game
  • jQuery
  • Komputer
  • Lain-Lain
  • Photoshop
  • SEO
  • Software
  • Template
  • Twitter
  • Widget

Labels

  • Android
  • Blogging
  • CSS
  • Facebook
  • Game
  • jQuery
  • Komputer
  • Lain-Lain
  • Photoshop
  • SEO
  • Software
  • Template
  • Twitter
  • Widget

About Me

Unknown
Lihat profil lengkapku or visit on

© Artikel Copas 100% powered by Blogger.com.
All Right Reserved.