Cara Mengaktifkan Mesin Pencarian Pada Website
Dunia Programming - Search atau mesin penelurusan sering dipakai pada sebuah website. manfaat atau kegunaan mesin pencarian sendiri adalah untuk memudahkan para pengunjung untuk mencari informasi atau hal-hal yang mereka inginkan diwebsite yang mereka kunjungi, jadi tidak heran kalau kita sering menemukan mesin pencarian pada sebuah website. nah bagaimana kalau websitenya offline...?
"Nah..iya bagaimana kalau website saya offline...? apakah bisa mencari data kita dalam mesin penelusuran...?"
Desain By Fotolia.com |
Cara Membuat Mesin Penelusuran Pada Website.
Langkah pertama, buat folder dengan nama Belajar_PHP dan simpan folder tersebut pada file xampp -> htdocs.
Mengapa harus di folder htdocs...? nah kan kita akan belajar bagaimana cara mengaktifkan Mesin Penulusuran, otomatis datanya harus dinamis juga dong. jadi harus kita simpan dalam folder htdocs agar nantinya mesin penulusuran bisa berfungsi dengan baik.
Setelah itu, copy paste script dibawah ini dan simpan file tersebut dengan nama koneksi.php
Script Koneksi Ke Database
<?php
$host_name = "localhost";
$user_name = "root";
$password = "";
$database = "siswa"; //sesuaikan dengan database kalian
mysql_connect($host_name, $user_name, $password);
mysql_select_db($database);
?>
$host_name = "localhost";
$user_name = "root";
$password = "";
$database = "siswa"; //sesuaikan dengan database kalian
mysql_connect($host_name, $user_name, $password);
mysql_select_db($database);
?>
Setelah itu copy paste script dibawah ini dengan nama index.php
Script PHP
<?php
include "koneksi.php"; // menghubungkan ke file koneksi.php agar terhubung dengan database
?>
<!DOCTYPE html>
<html>
<head>
<title>Dunia Programming</title>
<link rel="stylesheet" href="style.css" type="text/css">
</head>
<body>
<div style="margin-bottom:15px;" align="right">
<form action="" method="post">
<input type="text" name="input_cari" placeholder="Cari Berdasarkan Nama" class="css-input" style="width:250px;" />
<input type="submit" name="cari" value="Cari" class="btn" style="padding:3px;" margin="6px;" width="50px;" />
</form>
</div>
<table width="100%" border="1px solid #000" style="border-collapse:collapse;">
<tr style="background-color:#3498db; color: #fff;">
<th>Kode</th>
<th>Nama</th>
<th>Alamat</th>
<th>Email</th>
<th>Kota</th>
<th>Pesan</th>
<th>Options</th>
</tr>
<?php
$input_cari = @$_POST['input_cari'];
$cari = @$_POST['cari'];
// jika tombol cari di klik
if($cari) {
// jika kotak pencarian tidak sama dengan kosong
if($input_cari != "") {
// query mysql untuk mencari berdasarkan nama negara. .
$sql = mysql_query("select * from bukutamu where Nama like '%$input_cari%'") or die (mysql_error());
} else {
$sql = mysql_query("select * from bukutamu") or die (mysql_error());
}
} else {
$sql = mysql_query("select * from bukutamu") or die (mysql_error());
}
// mengecek data
$cek = mysql_num_rows($sql);
// jika data kurang dari 1
if($cek < 1) {
?>
<tr> <!--muncul peringata bahwa data tidak di temukan-->
<td colspan="7" align="center style="padding:10px;""> Data Tidak Ditemukan</td>
</tr>
<?php
} else {
// mengulangi data agar tidak hanya 1 yang tampil
while($data = mysql_fetch_array($sql)) {
?>
<tr>
<td><?php echo $data['id'] ?></td>
<td><?php echo $data['Nama'] ?></td>
<td><?php echo $data['Alamat'] ?></td>
<td><?php echo $data['Email'] ?></td>
<td><?php echo $data['Kota'] ?></td>
<td><?php echo $data['Pesan'] ?></td>
<!--Hanya pemanis tampilan-->
<td align="center">
<button>Edit</button>
<button>Hapus</button>
</td>
</tr>
<?php
}
}
?>
</table>
</body>
</html>
include "koneksi.php"; // menghubungkan ke file koneksi.php agar terhubung dengan database
?>
<!DOCTYPE html>
<html>
<head>
<title>Dunia Programming</title>
<link rel="stylesheet" href="style.css" type="text/css">
</head>
<body>
<div style="margin-bottom:15px;" align="right">
<form action="" method="post">
<input type="text" name="input_cari" placeholder="Cari Berdasarkan Nama" class="css-input" style="width:250px;" />
<input type="submit" name="cari" value="Cari" class="btn" style="padding:3px;" margin="6px;" width="50px;" />
</form>
</div>
<table width="100%" border="1px solid #000" style="border-collapse:collapse;">
<tr style="background-color:#3498db; color: #fff;">
<th>Kode</th>
<th>Nama</th>
<th>Alamat</th>
<th>Email</th>
<th>Kota</th>
<th>Pesan</th>
<th>Options</th>
</tr>
<?php
$input_cari = @$_POST['input_cari'];
$cari = @$_POST['cari'];
// jika tombol cari di klik
if($cari) {
// jika kotak pencarian tidak sama dengan kosong
if($input_cari != "") {
// query mysql untuk mencari berdasarkan nama negara. .
$sql = mysql_query("select * from bukutamu where Nama like '%$input_cari%'") or die (mysql_error());
} else {
$sql = mysql_query("select * from bukutamu") or die (mysql_error());
}
} else {
$sql = mysql_query("select * from bukutamu") or die (mysql_error());
}
// mengecek data
$cek = mysql_num_rows($sql);
// jika data kurang dari 1
if($cek < 1) {
?>
<tr> <!--muncul peringata bahwa data tidak di temukan-->
<td colspan="7" align="center style="padding:10px;""> Data Tidak Ditemukan</td>
</tr>
<?php
} else {
// mengulangi data agar tidak hanya 1 yang tampil
while($data = mysql_fetch_array($sql)) {
?>
<tr>
<td><?php echo $data['id'] ?></td>
<td><?php echo $data['Nama'] ?></td>
<td><?php echo $data['Alamat'] ?></td>
<td><?php echo $data['Email'] ?></td>
<td><?php echo $data['Kota'] ?></td>
<td><?php echo $data['Pesan'] ?></td>
<!--Hanya pemanis tampilan-->
<td align="center">
<button>Edit</button>
<button>Hapus</button>
</td>
</tr>
<?php
}
}
?>
</table>
</body>
</html>
Copy Script dibawah ini dan beri nama style.css
Script CSS
body {
background: #c9c9c9;
}
td{
text-align: center;
}
.btn {
background: #3498db;
border: 0px;
border-radius: 5px;
color: #fff;
height: 40px;
width: 100px;
border: 1px solid #fff;
}
.css-input {
padding: 10px;
border: 1px solid #fff;
border-radius: 5px;
}
background: #c9c9c9;
}
td{
text-align: center;
}
.btn {
background: #3498db;
border: 0px;
border-radius: 5px;
color: #fff;
height: 40px;
width: 100px;
border: 1px solid #fff;
}
.css-input {
padding: 10px;
border: 1px solid #fff;
border-radius: 5px;
}
Tampilan Mesin pencariannya.
Tampilan Web Mesin Penelusuran |
Saat Melakukan Pencarian Data.
Hasil Penelusuran Data |
File koneksi.php adalah perintah ang digunakan untuk mengkoneksikan ke database.
File index.php - untuk Nama like %$input_cari% itu maksutnya adalah, bila mesin penelusuran kalian dikhususkan untuk Nama saja, apapun huruf yang ada pada nama dari awal nama sampai akhir nama yang sudah ada pada database akan terbaca oleh Mesin Penelusuran.
Jika untuk penempatan persennya hanya didepan saja %$input_cari maka Mesin Pencarian akan membaca huruf awalan saja pada nama yang sudah tersedia pada Database.
Jika untuk penempatan
persennya hanya dibelakang saja $input_cari% maka Mesin Pencarian akan membaca huruf belakang saja pada nama yang sudah tersedia pada Database.
Setelah semuanya anda lakukan ketikkan pada url pada browser dengan nama localhost/DuniaProgramming/MesinPenelusuran/ , cobalah untuk mengetikkan nama yang akan kalian cari.
Ingat semua data harus berada pada database, sehingga Mesin Pencarian bisa mencari data yang ada pada Database.
Cara Mengisikan datanya sebagai berikut.
1). Isikan data sesuai yang kalian inginkanMengisikan Data Pada Database |
2) Melihat Data yang masuk setelah di isikan.
Data Yang Masuk |
Oke selamat belajar, semoga ilmu saya bermanfaat bagi kalian semua.
nice artikel gan. ini artikel yang ane cari ...
ReplyDeleteSemoga Bermanfaat Mas :)
Delete