Lompat ke konten Lompat ke sidebar Lompat ke footer

Cara Membuat Related Post Dengan Google Cse (Custom Search Engine)

Cara Membuat Related Post Dengan Google CSE  Cara Membuat Related Post dengan Google CSE (Custom Search Engine)

Postingan Terkait (Related Post) yakni daftar dari postingan yang mempunyai topik pembahasan yang serupa dengan artikel utama yang sedang dibaca. Fungsinya, mempesona perhatian pengunjung supaya membuka artikel lain. Ini sungguh cantik sekali alasannya pengunjung akan menghabiskan waktu yang lebih lama di blog kamu.

Hal ini juga bisa untuk menurunkan bounce rate. Kita tidak membicarakan wacana membuat related post atau postingan terkait dengan Javascript biasa. Kali ini kita akan membuat related post memakai Google CSE.

Apa Itu Google CSE?

Custom Search Engine (CSE) adalah layanan dari Google yang dikhususkan untuk melakukan penelusuran pada blog. Nah, umumnya hasil dari CSE hanya akan keluar bila kau melakukan aktifitas penelusuran apalagi dulu. Ternyata untuk membuat related post di blog dengan Google CSE mampu juga. Untuk kesannya pun lebih keren alasannya beliau bisa menampilkan artikel terkait lebih banyak yang dibagi beberapa halaman. Bahkan saat pindah halaman pun dia tidak reload. Mantappp kan. Kalau kau ingin menjajal , silahkan ikuti tindakan dibawah ini.

A. Membuat Unit CSE

Langkah pertama, kamu mesti membuat unit CSE yang gres apalagi dahulu.
  1. Masuk ke https://cse.google.com
  2. Pada kolom Site to Search, isikan dengan URL blog kamu disertai tanda slash dan bintang. Contoh: www.masmalven.com/*
  3. Pada Language pilih Indonesia atau bisa menyesuaikan dengan bahasa blog kamu.
  4. Pada Name of the search engine, isikan sesuai impian. Hal ini yaitu unit Google CSE.
  5. Jika final, klik tombol Create

    Cara Membuat Related Post Dengan Google CSE  Cara Membuat Related Post dengan Google CSE (Custom Search Engine)

  6. Pada sajian Look and feel, pilih Results only lalu klik tombol Save & Get Code.

    Cara Membuat Related Post Dengan Google CSE  Cara Membuat Related Post dengan Google CSE (Custom Search Engine)

  7. Nanti akan timbul instruksi CSE yang tadi kamu buat. Perhatikan bab var cx ='0080xxxxxxxxxxxxxx:abcde_fg'. Kode tersebut adalah search engine ID yang nanti kamu perlukan. Untuk sementara simpan dulu di notepad.

    Cara Membuat Related Post Dengan Google CSE  Cara Membuat Related Post dengan Google CSE (Custom Search Engine)

Bagi Kamu yang telah punya akun Adsense dan telah pernah membuat unit CSE yang dimonetisasi, JANGAN PERNAH mengaktifkan fitur Make Money khusus di unit CSE related post ini. Biarkan beliau melakukan pekerjaan secara bebas.

B. Pengaturan di Blogger

Saatnya kita mulai terapkan pada blog. Berikut Langkah - langkahnya:
  1. Untuk mempercantik performa, tambahkan dulu isyarat CSS berikut. Simpan kode DIATAS / SEBELUM atau . Kamu mampu edit lagi sesuai selera.
    /* Related Post with Google CSE by  (masmalven.com) */ #masmalvenRelated margin:0px; padding:0px; text-align:center; border-top:0px; border:1px solid #0b5394; border-top:0px #masmalvenRelated h3font-size:18px; font:bold 18px Tahoma,sans-serif; margin:0px 0px 5px 0px; background:#0b5394; color:#fff; text-align:left; text-transform:uppercase; overflow:hidden; padding: 7px 20px #masmalvenCSE padding:0 20px 10px 20px; text-align:left; width:auto; height:100%; line-height:18px #masmalvenCSE .cse .gsc-control-cse, .gsc-control-cse padding:0px #masmalvenCSE .gsc-control-cse margin:0px; padding:0px #masmalvenCSE .gsc-control-cse .gsc-table-result margin:0 0 15px 0 #masmalvenCSE .gsc-results width:100% #masmalvenCSE .gsc-search-box, #masmalvnCSE .gsc-above-wrapper-area, #masmalvenCSE .gsc-resultsHeader display:none #masmalvenCSE .gsc-webResult .gsc-result padding:0px #masmalvenCSE .gsc-webResult .gsc-result:nth-child(4) border-bottom:0 #masmalvenCSE .gs-result .gs-title, #masmalvenCSE .gs-result .gs-title * text-decoration:none; color:#008c5f; font-size:14px; font-weight:600; padding-bottom:18px #masmalvenCSE .gs-result .gs-snippet font-size:12px #masmalvenCSE .gsc-reviewer, #masmalvenCSE .gs-result a.gs-visibleUrl, #masmalvenCSE .gs-result .gs-visibleUrlcolor:#767676 #masmalvenCSE .gsc-table-cell-thumbnail, #masmalvenCSE .gs-promotion-image-cell padding-right:10px #masmalvenCSE .gsc-results .gsc-cursor-box margin:0px #masmalvenCSE .gsc-preview-reviews ul margin:0px #masmalvenCSE .gsc-cursor .gsc-cursor-page.gsc-cursor-current-page, #masmalvenCSE .gsc-cursor .gsc-cursor-page color:#fff; text-decoration:none; margin:5px 10px 0 0; padding: 5px 10px; border-radius: 5px; display:inline-block #masmalvenCSE .gsc-cursor .gsc-cursor-page.gsc-cursor-current-page background:#2f303f !important #masmalvenCSE .gsc-cursor .gsc-cursor-page background:#008c5f #masmalvenCSE .gsc-cursor .gsc-cursor-page:hover background:#2f303f #masmalvenCSE .gsc-url-top padding:0px #masmalvenCSE .gs-webResult .gs-snippet, .gs-imageResult .gs-snippet, .gs-fileFormatType color:#2f303f #masmalvenCSE .gsc-thumbnail-inside padding:0px 
  2. Cari isyarat . Selalu gunakan CTRL + F untuk membuat lebih mudah mencari aba-aba tersebut. Kalau ada beberapa arahan, pilih yang terakhir. Tapi setiap struktur setiap template niscaya berbeda. Pastikan juga kau memilih yang benar.
  3. Letakkan script DIBAWAH / SETELAH .
     

    Artikel Terkait

  4. Jangan lupa untuk menyimpannya dengan klik tombol Save Tema.

    Pengaturan
    1. Untuk Tulisan yang berwarna BIRU adalah jumlah related post dengan CSE yang ditampilkan. Kamu mampu mengubahnya berikut ini:
      • small: 4 hasil per halaman.
      • large: 8 hasil per halaman.
      • filtered_cse: optimal sebanyak 10 halaman (artinya hasil maksimal sebanyak 100).
      • Bisa juga berbentukangka. Misalnya 5,6,7 dan sebagainya.
    2. Untuk Tulisan yang berwarna MERAH yaitu search engine ID. Ganti dengan ID kau sendiri.

    D. Tambahan

    Ini tidak mirip related post pada umumnya yang pakai Javascript, daftar yang timbul di Google CSE hanyalah postingan yang telah terindex oleh Google saja. Jadi, fikirkan sekali lagi bila mau pakai related post di blog dengan Google CSE. Nah, jikalau blog kau sudah terindex, pakai CSE tidak menjadi duduk perkara dan tambah kelihatan keren banget.