Membuat Search Engine Sendiri Dengan PHP, MySQL Dan jquery

Membuat Search Engine Sendiri Dengan PHP, MySQL Dan jQuery Iman Amalludin [email protected] :: http://blog.imanllusion.hostzi.com

Abstrak Search Engine. Apa itu? Search Engine adalah program komputer yang dirancang untuk mencari informasi yang tersedia didalam dunia maya. Anda bisa menggunakannya untuk mencari apa saja informasi yang dibutuhkan, mulai dari informasi kerja, ilmu, gosip, berita dan lain sebagainya. Untuk sekarang ini sebuah search engine sudah mulai di kembangkan untuk lebih memudahkan bagi kita dalam menggunakan pencarian pada sebuah web. Yang ingin mengetahui bagaimana membuat Search Engine dengan PHP, MySQL dan jQuery. Disini saya akan menuliskan artikelnya yang berjudul tentang “Membuat Search Engine Sendiri Dengan PHP, MySQL Dan jQuery”.

Kata Kunci: php, mysql, jquery, pemrograman, programming, web programming

Pendahuluan Sistem kerja Search Engine adalah menyimpan database yang ada di internet untuk kemudian ditampilkan sesuai dengan kecocokkan kata kunci yang diketikkan pada search engine dengan data base yang ada. Tentunya akan banyak sekali data yang dimunculkan Search Engine, untuk urutan yang pertama ditampilkan adalah hasil yang paling akurat.

Lisensi Dokumen: Copyright © 2008-2014 ilmuti.org Seluruh dokumen di ilmuti.org dapat digunakan, dimodifikasi dan disebarkan secara bebas untuk tujuan bukan komersial (nonprofit), dengan syarat tidak menghapus atau merubah atribut penulis dan pernyataan copyright yang disertakan dalam setiap dokumen. Tidak diperbolehkan melakukan penulisan ulang, kecuali mendapatkan ijin terlebih dahulu dari ilmuti.org

Fungsi dan manfaat Search Engine Search Engine mempunyai bebrapa fungsi dan manfaat yang berguna bagi kita yang suka browsing antara lain adalah : 1. Mesin pencari merupakan tempat kebanyakan orang mencari sesuatu via internet. Menurut survei hampir 90% pengguna internet memakai mesin pencari untuk mencari lokasi tertentu di internet. dan di antara mesin pencari yang ada, google merupakan mesin pencari yang paling banyak digunakan. 2. Sebagian besar pengguna mesin pencari tidak pernah melewatkan dua halaman pertama dari mesin pencari. 3. Sebuah informasi yang mudah di akses oleh semua orang baik dalam maupun luar negeri. 4. Memudahkan Masyarakat dalam mencari informasi di internet.

contoh search engine yang sangat populer untuk saat ini, untuk saat ini sudah sangat banyak perusahaan - perusahaan yang mengembangkan teknologi search engine ini, dan diantaranya adalah : 1. Google 2. Yahoo 3. Bing 4. Ask

Pembahasan 1. Ini adalah bagaimana sistem bekerja: 2. Seorang pengguna mengklik ke dalam kotak teks, teks default " Begin Typing to Search" akan hilang. Efek ini telah dilakukan dengan menggunakan Jquery Watermark Plugin.


3. Sebuah panggilan Ajax akan dipicu dan diteruskan ke file "ajax-search.php" hanya jika pengguna mengetik minimal 4 Karakter. 4. Selama pencarian Asynchronous ini, muatan gambar animasi akan ditampilkan di sisi kanan kotak teks. 5. Akhirnya jika ada minimal satu pertandingan dalam database, maka akan ditampilkan dalam "div" pada halaman.

Membuat Database Sebuah database kecil yang berisi tabel dengan field judul topik dan deskripsi topik. Sistem pencarian akan memungkinkan kita untuk mencari di 2 bidang ini.

Berikut ini adalah kode SQL untuk membuat tabel dan menambahkan beberapa data. CREATE TABLE IF NOT EXISTS `topics` ( `topicid` int(5) NOT NULL AUTO_INCREMENT, `topictitle` varchar(200) NOT NULL, `topicdescription` varchar(500) NOT NULL, PRIMARY KEY (`topicid`) ) ENGINE=MyISAM DEFAULT CHARSET=latin1 AUTO_INCREMENT=5 ; INSERT INTO `topics` (`topicid`, `topictitle`, `topicdescription`) VALUES (1, 'What is jquery ?', 'jQuery is a lightweight cross-browser JavaScript library that emphasizes interaction between JavaScript and HTML. It was released in January 2006 at BarCamp NYC by John Resig. Used by over 27% of the 10,000 most visited websites, jQuery is the most popular JavaScript library in use today.'), (2, 'What is javascript', 'JavaScript is an object-oriented scripting language used to enable programmatic access to computational objects within a host environment. Although also used in other applications, it is primarily used in the form of client-side JavaScript, implemented as part of a web browser, providing enhanced user interfaces and dynamic websites. JavaScript is a dialect of the ECMAScript standard and is characterized as a dynamic, weakly typed, prototype-based language with first-class functions. JavaScript '), (3, 'Where to download Jquery ?', 'You can download this javascript


framework at jquery.com ?'), (4, 'How can i develop jquery Plug in ?', 'Well, First of all you need a working brain !');

Membuat Form Demi kesederhanaan, saya akan menghilangkan CSS desain bagian dari sistem pencarian. Sejak Search dilakukan "live" segera setelah pengguna mulai mengetik, tombol kirim akan jelas tidak diperlukan. Di bawah ini adalah bagian dari HTML textfield :
name="query" type="text" id="faq_search_input" />

Membuat Koneksi Database Filename: database_connection.php

Aku akan membuat file koneksi database terpisah yang berisi username, password, host, dan nama database . Anda harus mengubah info ini jika Anda ingin menguji script ini di server Anda sendiri.


Kode untuk menangani permintaan pencarian Filename: ajax-search.php

Bila pengguna akan ketik di kotak pencarian, panggilan ajax akan dilakukan untuk file ini melalui GET dan hasilnya akan ditampilkan kepada pengguna. '.$row['topictitle'].' '.$row['topicdescription'].'
' ; } }else { echo 'No Results for :"'.$_GET['keyword'].'"';//No Match found in the Database } } }else { echo 'Parameter Missing in the URL';//If URL is invalid } ?>


Menggunakan Jquery untuk membuat permintaan Asynchronous Filename: index.php

Ini mungkin adalah "meat" dari tutorial ini. Untuk membuat teks default "Begin Typing to Search.." menghilang, saya telah menggunakan steker Watermark. Setelah men-download plug in, termasuk steker di bagian header halaman Anda. <script type="text/javascript" src="js/jquery.watermark.js">

Sisa kode di bawah menangani pengajuan Ajax dan menampilkan hasil pada halaman.

Kode di atas akan menangkap data yang dimasukkan oleh pengguna dan menyimpan dalam variable faq_search_input. ini akan dipicu hanya ketika tipe user ke dalam textbox. Variabel datastring menyiapkan data dalam format yang benar akan disahkan di url. http://example.org/ajax-search.php? keyword = jquery

Kode di bawah ini akan Pass input data hanya jika itu lebih lama dari 3 karakter. Sebelum membuat permintaan, nama kelas "memuat" akan ditambahkan ke kolom input. Hal ini akan menyebabkan gambar animasi pemuatan yang akan ditambahkan. Jika permintaan ajax adalah sukses, respon dari server dikembalikan oleh ajaxsearch.php akan dipindahkan dalam

. Css "pemuatan "Kelas yang sebelumnya ditambahkan ke dom sekarang dihapus. Hal ini akan


menyebabkan pemuatan gambar animasi untuk menjadi statis. (The animasi dan statis 2 gambar yang berbeda sebenarnya). 3) //If length of input field greater than 3 { $.ajax({//Make the ajax call using GET type: "GET", url: "ajax-search.php", data: dataString,//The data to pass to the file beforeSend: function() { $('input#faq_search_input').addClass('loading'); //Code responsible for the animated loaded image }, success: function(server_response) {//If successfull ,output server response in div $('#searchresultdata').html(server_response).show(); //Show the result on the page $('span#faq_category_title').html(faq_search_input); if ($('input#faq_search_input').hasClass("loading")) { $("input#faq_search_input").removeClass("loading"); } //And finally remove the animated loading image to make it static . } }); }return false; }); }); ?>


Berikut adalah screenshot dari sistem pencarian, sebuah demo online aplikasi, dan link download untuk kode sumber lengkap termasuk . sql Database Ketik kata kunci tersebut di Demo secara online: "Jquery", "javascript", "download" untuk hasil yang akan ditampilkan.

Lihat Demo | Download full source code

Penutup Demikianlah artikel yang saya buat semoga bermanfaat bagi orang yang membacanya dan menambah wawasan bagi orang yang membaca artikel ini. Dan penulis mohon maaf apabila ada kesalahan dalam penulisan kata dan kalimat yang tidak jelas, mengerti, dan lugas mohon jangan dimasukan ke dalam hati. Dan saya juga sangat mengharapkan yang membaca artikel ini akan bertambah motivasinya dan mengapai cita-cita yang di inginkan, karena saya membuat artikel ini mempunyai arti penting yang sangat mendalam.


Sekian penutup dari saya semoga berkenan di hati dan saya ucapkan terima kasih yang sebesar-besarnya.

Referensi  http://istanateknologi.blogspot.com/2013/03/pengertian-dan-fungsi-searchengine.html  http://www.updatekeren.com/2012/12/pengertian-search-engine.html  http://youhack.me/2010/04/28/creating-a-fancy-search-feature-with-php-mysqland-jquery/

Biografi Nama Penulis : Iman Amalludin Tempat, Tanggal Lahir : Kuningan, 4 Nov 1992 Studi

: STMIK Raharja

Jurusan

: Sistem Informasi

Konsentrasi : Business Intelligence Hobi

: Bermain Game

Email

: [email protected]

Blog

: http://blog.imanllusion.hostzi.com


Membuat Search Engine Sendiri Dengan PHP, MySQL Dan jquery

Recommend Documents