Silakan tunggu sedang proses
Jum'at Kliwon 29 Maret 2024 00:37
learn make rich
share make it perfect
Ayat Suci
pada hari itu manusia berkata: "Ke mana tempat lari?"
(QS. AL QIYAAMAH:10)

 otomatis refresh

Javascript ayat
Daftar Fungsi
pasaran
Mencari nama hari dan nama pasaran
pdu2sms
Konversi dari PDU ke Teks SMS
bacarss
Membaca RSS dari beberapa situs
Para Rekan
MyWeblog

Mewarnai Hasil Pencarian

Aryo Sanjaya
Membantu Search Engine agar pengguna mudah melakukan pencarian dari hasil cari.

Aryo Sanjaya
Minggu Kliwon, 12 Februari 2006

Pernah kan ngalami, ketika kita melakukan pencarian di suatu Search Engine (Google, Yahoo, MSN), lalu kita masuk ke web yang merupakan hasil dari pencarian tersebut, namun setelah di dalam web tersebut, kata yang kita cari masih sulit untuk ditemukan, misalnya karena halaman web tersebut mengandung banyak isi.

Hal tersebut dapat dipermudah dengan memberikan warna berbeda (highlight) pada kata-kata yang dicari oleh pengguna.

Untuk memperjelas maksud tulisan ini, silakan anda masuk ke google.com, kemudian lakukan pencarian dengan kata kunci sebagai berikut:

kirim sms lewat pc

Saat artikel ini ditulis, keywords tersebut selalu menempatkan BengkelProgram.com sebagai top rank nomor 1 :)
Silakan anda klik link yang menuju ke BengkelProgram.com, dan anda akan melihat, kata-kata yang anda cari akan ditampilkan dengan warna yang berbeda dari warna artikel aslinya.
Hal tersebut juga berlaku untuk search engine lain, dan halaman lain tentunya.

Untuk dapat melakukan hal tersebut, syarat yang harus terpenuhi adalah, teknik penampilan situs anda harus memakai buffering. Bukan buffering OB milik PHP, tapi sebelum ditampilkan, halaman web anda harus tertampung dalam sebuah variabel.
Maksudnya, sebelum di-echo, semua output harus ditampung dalam sebuah variabel string, misalnya $data. Ketika semua output sudah siap ditampilkan, barulah di-echo $data.

Syarat ini diwajibkan karena sebelum ditampilkan, variabel $data mesti diolah dulu.

Ok, kita lanjutkan dulu. Kita anggap semua output telah dimasukkan dalam variabel $data.

Langkah melakukan pengolahan adalah sebagai berikut:

Cek apakah halaman web kita ini dipanggil melalui sebuah search engine. Caranya dengan melihat isi dari variabel $_SERVER['HTTP_REFERER']. Perintahnya sebagai berikut:

$doc_ref = $_SERVER['HTTP_REFERER'];

Variabel $doc_ref akan bernilai URL hasil dari serach engine. Jika anda melakukan pencarian seperti yang dicontohkan di atas, maka $doc_ref akan berisi:

http://www.google.co.id/search?hl=id&q=kirim+sms+lewat+pc&
meta=

Berikutnya adalah ngecek isinya:

$host_info = parse_url($doc_ref);

variabel $doc_ref di-parse (dipecah) ke dalam array $host_info. Isi dari $host_info akan berisi seperti ini:

Array
(
    [scheme] => http
    [host] => www.google.co.id
    [path] => /search
    [query] => hl=id&q=kirim+sms+lewat+pc&meta=
)

Yang kita butuhkan adalah item 'query', karena itu kita butuh mengambilnya.

$query = isset($host_info['query'])?$host_info['query']:"";

dari variabel tersebut, kita pecah menjadi bagian yang lebih jelas, dengan memisahkannya berdasarkan karakter '&' :

$querylist = explode("&", $query);

Berikutnya adalah mengolah isi dari $querylist:

foreach($querylist as $item)
{
   list($param, $value) = explode("=", $item);
   if (testParam(strtolower($host_info['host']), $param))
   {
      $value = rawurldecode($value);
      $value = str_replace("'", "", $value);
      $value = str_replace("\"", "", $value);
      $value = str_replace("+", " ", $value);
      $searchlist = explode(" ", $value);
      break;
   }
}

masing-masing bagian dilihat isinya, setelah dipisahkan berdasarkan karakter '=', ke dalam variabel $param dan $value. Selanjutnya dilihat apakah item tersebut merupakan 'ciri' dari search engine. Pengecekan itu dilakukan melalui fungsi testParam(). Jika memang item tersebut adalah bagian dari search engine, maka dilakukan langkah lebih lanjut:

$value diconvert menjadi karakter yang sebenarnya, dengan fungsi rawurldecode(). Kemudian semua tanda petik dibuang, dan tanda plus (+) dirubah jadi spasi. Setelah itu dimasukkan kedalam array $searchlist setelah dipecah berdasarkan karakter spasi.

Fungsi testParam() adalah sebagai berikut:

function testParam($host, $param)
{
   $listparam=array("yahoo."=>"p","google."=>"q","msn."=>"q");

   foreach($listparam as $part => $val)
   {
      if ((strpos($host, $part, 0))&&($param == $val)) return 1;
   }
   return 0;
}

seperti yang terlihat dalam fungsi tersebut, parameter dianggap benar, jika host-nya mengadung kata 'yahoo.' dan memiliki query 'p', atau 'google.' dan memiliki query 'q', dan seterusnya. Tentu saja anda bisa menambahkan sendiri kriteria search engine yang lain.

Langkah pengolahan selanjutnya adalah merubah kata-kata yang ditemukan, dengan menambahkan warna-warni... hihihi...

kita pilih warna-warna favorit. array key (yang depan) adalah warna depan (foreground), dan value-nya adalah warna background. Pada list di bawah ini, item pertama adalah tulisan dengan tulisan hitam di atas warna kuning.

$cols = array( "#000000" => "#ffff00",
               "#ffffff" => "#0000ff",
               "#ffffff" => "#00ff00",
               "#ffffff" => "#ff0000",
               "#ff0000" => "#ffff00");

Jumlahnya cuma 4 item, nanti akan dipilih secara urut, yang kalau kehabisan akan diulang dari awal. Silakan ditambahi jika ingin.

Selanjutnya, menerapkan warna-warna tersebut pada daftar kata yang ditemukan.

foreach($searchlist as $list)
{
   $fg = key($cols);      // ambil fg
   $bg = current($cols);  // dan bg

   if (!next($cols)) // jika kehabisan
      reset($cols);  // ulangi dari awal

   $data = preg_replace("/(.*)($list)(.*)/i", 
"\\1<span style=\"color: $fg; background-color: $bg\">\\2</span>\\3", 
           $data);
}

Hal yang menarik dari kode di atas adalah fungsi preg_replace(), yang membutuhkan RegEx (regular expression). Untung saja RegEx-nya cukup simple ;)

/(.*)($list)(.*)/i

mencari keseluruhan kata yang dimaksud, dan mengembalikan dalam bentuk rangkaian \1, \2, \3. \1 adalah karakter di sebelah kiri, \2 merupakan kata yang ditemukan, dan \3 karakter di sebelah kanan. Semuanya dibentuk menjadi sebuah <span></span> yang telah dimodifikasi warnanya.

Setelah looping selesai, maka variabel $data telah selesai diolah, dan siap di-echo.

Sekian.

Ingatlah, warna-warna itu hanya muncul jika web anda dilihat melalui search engine. Jadi kalo orang sudah hapal dengan situs kita, maka warna itu juga jarang muncul :)

Untuk script lengkapnya, silakan download di sini.

Selain bikin sendiri, ada cara lain yang lebih instan. Saya pernah bikin versi Javascript-nya. Silakan lihat artikel ini. Tapi sampai saat ini hanya berjalan di Internet Explorer :(

Met koding.

Komentar

<b>cUrUt<b>

Rabu Legi, 24 Mei 2006

<script language="javascript"> window.alert("hua..... Kaget ga)</script>

Aryo Sanjaya

Rabu Legi, 24 Mei 2006

Hm hm hm ;)

Aryo Sanjaya

Jum'at Pahing, 9 Juni 2006

asd

Aryo Sanjaya

Jum'at Pahing, 9 Juni 2006

Test AJAX

Aryo Sanjaya

Minggu Legi, 18 Juni 2006

asd

Aryo Sanjaya

Rabu Legi, 28 Juni 2006

Test AJAX


Mengisi Komentar





untuk kode program, apit dengan tanda [code][/code].
contoh:

[code]
(kode program)
[/code]



Daftar Artikel PHP

» Menghitung Jarak Waktu (4)
Rabu Wage, 17 Mei 2006

Mengitung jarak waktu dan menampilkan sebagai Javascript

» Grabbing Kurs Dari BI (10)
Rabu Pahing, 5 April 2006

Grabbing data adalah tindakan tidak sopan. Tapi kali ini yang dibahas adalah teknik grabbing, masalah moral dan etika silakan cari sendiri (inspired by Iwan Fals)

» Autocomplete Pada Form (1)
Rabu Pahing, 5 April 2006

Contoh script berikut ini menampilkan cara mengisi value field suatu form, tanpa harus melakukan submit data

» Merubah Isi Combobox (1)
Selasa Legi, 4 April 2006

Pada artikel ini dibahas bagaimana cara merubah isi suatu combobox, sesuai dengan isi combobox lain yang dipilih oleh user

» Membuat Tampilan Perhalaman (11)
Jum'at Pon, 17 Maret 2006

Masih banyak yang menanyakan cara untuk menampilkan data perhalaman



Halaman:    1  2  3  >  

Artikel Rame
Aplikasi Handphone (250)
Senin Pon, 20 Februari 2006

Mengirim SMS dari PC (208)
Senin Wage, 28 November 2005

Membaca SMS dari PC (162)
Selasa Pahing, 14 Juni 2005

Source SMS Autorespond (66)
Senin Legi, 24 April 2006

Penyembunyian Password di Database (36)
Kamis Kliwon, 2 Juni 2005

Bukutamu
» Imam Izzatir Rizzan
Jum'at Kliwon
7 Juli 2006

» adindri
Selasa Pahing
4 Juli 2006

» Je Malakian
Selasa Pahing
4 Juli 2006

» A.Azis
Jum'at Pon
30 Juni 2006

» zorro
Kamis Pahing
29 Juni 2006


Halaman Bukutamu
Lain-lain
User online: 70
User login: 0

user/passwd: bpuser

Status Y!M
Saya sedang Offline. Silakan gunakan menu Kontak atau tinggalkan pesan di Yahoo! Messenger pada Id: aryo_sanjaya
© 2005-2024 BengkelProgram.com