Untuk membuat buku tamu (guestbook) dengan PHP dan MySQL caranya sangat mudah sekali. Dengan membaca tutorial dibawah ini, saya yakin anda bisa mempraktekkannya dengan mudah. Banyak sekali manfaat yang bisa kita dapatkan dengan membuat buku tamu dalam website anda. Salah satunya yaitu bisa anda gunakan sebagai media komunikasi antara anda dengan pengunjung website. Selain itu, membuat buku tamu dapat membuat tampilan website anda menjadi lebih profesional. Lalu, bagaimana cara membuat buku tamu dengan PHP dan MySQL? Sebelum ke tutorial membuat buku tamu dengan PHP dan MySQL ada beberapa requirements yang harus anda penuhi.
Ya, pada tutorial ini saya akan memanfaatkan framework CSS bootstrap agar tampilan website anda menjadi lebih menarik tanpa perlu membuat design dengan kode CSS. Untuk anda yang belum mengerti tentang bootstrap anda bisa membaca tutorial ini Cara menggunakan bootstrap untuk pemula. Dowload Bootstrap Seteleh mendownload bootsrap lalu ekstrak dan buat struktur foldernya seperti pada gambar dibawah ini:  Tutorial Membuat Buku TamuMembuat Database di MySQL Sebelum membuat buku tamu, sebaiknya kita membuat database di mysql dengan nama db_bukutamu. Lalu dump query sql berikut: CREATE TABLE `bukutamu` ( `id` int(11) NOT NULL, `tanggal` date NOT NULL, `nama` varchar(50) NOT NULL, `email` varchar(50) NOT NULL, `website` varchar(50) NOT NULL, `judul` varchar(50) NOT NULL, `pesan` text NOT NULL ) ENGINE=InnoDB DEFAULT CHARSET=utf8; Jika sudah, maka akan terbentuk data seperti pada gambar berikut: Membuat Koneksi PHP ke Database Untuk koneksi kita menggunakan MySQLi, dikarenakan MySQL sudah tidak support lagi dengan PHP 5.5 keatas, sudah deprecated. buat file dengan nama config.php letakkan sejajar dengan folder bootstrap seperti pada gambar diatas. lalu masukkan kode dibawah ini pada file config.php <?php
//mengabaikan pesan Notice
error_reporting(E_ALL ^ (E_NOTICE));
//melakukan koneksi ke database dengan MySQLi
$koneksi = new mysqli("localhost", "root", "", "db_bukutamu");
if($koneksi->connect_errno) {
echo "Gagal melakukan koneksi ke MySQL: " . $koneksi->connect_error;
}
?>Pada line ke-6 adalah database credentials anda. Jadi pastikan user dan password yang anda masukkan benar. Jika database mysql anda tidak menggunakan password, maka kosongkan saja. Membuat Halaman Buku Tamu pada tahap ini, kita akan membuat tampilan halaman utama dan di halaman ini akan ditampilkan form buku tamu dan 5 data terakhir buku tamu. Buat file baru dengan nama index.php dan ketikkan script di bawah ini: <?php
include("config.php");
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Buku Tamu || TutorialPedia.NET</title>
<link href="css/bootstrap.min.css" rel="stylesheet">
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<nav class="navbar navbar-default navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">TUTORIALPEDIA</a>
</div>
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav">
<li class="active"><a href="index.php">Beranda</a></li>
<li><a href="data.php">Data Buku Tamu</a></li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Dropdown <span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href="#">Action</a></li>
<li><a href="#">Another action</a></li>
<li><a href="#">Something else here</a></li>
<li role="separator" class="divider"></li>
<li><a href="#">Separated link</a></li>
<li role="separator" class="divider"></li>
<li><a href="#">One more separated link</a></li>
</ul>
</li>
</ul>
</div>
</div>
</nav>
<div class="container" style="margin-top: 50px">
<h2>Tulis Buku Tamu!</h2>
<hr />
<form class="form-horizontal" method="post" action="index.php">
<div class="form-group">
<label class="col-sm-2 control-label">NAMA LENGKAP</label>
<div class="col-sm-4">
<input type="text" name="nama" class="form-control" placeholder="tutorialpedia" required>
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">EMAIL</label>
<div class="col-sm-4">
<input type="email" name="email" class="form-control" placeholder="" required>
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">WEBSITE</label>
<div class="col-sm-4">
<input type="url" name="website" class="form-control" placeholder="http://www.tutorialpedia.net">
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">JUDUL PESAN</label>
<div class="col-sm-6">
<input type="text" name="judul" class="form-control" placeholder="Senang banget dengan tutorialpedia.net" required>
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">ISI PESAN</label>
<div class="col-sm-8">
<textarea name="pesan" class="form-control" placeholder="Hai, saya sangat senang dengan tutorial yang ada di tutorialpedia.net. Terima kasih." required></textarea>
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label"></label>
<div class="col-sm-8">
<input type="submit" name="submit" class="btn btn-primary" value="KIRIM PESAN">
</div>
</div>
</form>
<?php
//definisikan variabel untuk tiap-tiap inputan
$nama = $koneksi->real_escape_string($_POST['nama']);
$email = $koneksi->real_escape_string($_POST['email']);
$web = $koneksi->real_escape_string($_POST['website']);
$judul = $koneksi->real_escape_string($_POST['judul']);
$pesan = $koneksi->real_escape_string($_POST['pesan']);
$tanggal = date('Y-m-d');
//jika di klik tombol kirim pesan menjalankan script di bawah ini
if($_POST['submit']){
$input = $koneksi->query("INSERT INTO bukutamu(tanggal,nama,email,website,judul,pesan) VALUES('$tanggal','$nama','$email','$web','$judul','$pesan')") or die($koneksi->error);
if($input){
echo '<div class="alert alert-success">Pesan anda berhasil di simpan!</div>';
}else{
echo '<div class="alert alert-warning">Gagal menyimpan pesan!</div>';
}
}
?>
<hr />
<h2>5 Buku tamu terakhir</h2>
<?php
//menampilkan 5 buku tamu terbaru
$res = $koneksi->query("SELECT * FROM bukutamu ORDER BY id DESC LIMIT 5") or die($koneksi->error);
if($res->num_rows){
while($row = $res->fetch_assoc()){
echo '
<table class="table table-condensed table-striped">
<tr>
<th width="150">TANGGAL TULIS</th>
<th width="10">:</th>
<td>'.$row['tanggal'].'</td>
</tr>
<tr>
<th width="150">NAMA LENGKAP</th>
<th width="10">:</th>
<td>'.$row['nama'].'</td>
</tr>
<tr>
<th>EMAIL</th>
<th>:</th>
<td>'.$row['email'].'</td>
</tr>
<tr>
<th>WEBSITE</th>
<th>:</th>
<td>'.$row['website'].'</td>
</tr>
<tr>
<th>JUDUL PESAN</th>
<th>:</th>
<td>'.$row['judul'].'</td>
</tr>
<tr>
<th>ISI PESAN</th>
<th>:</th>
<td>'.$row['pesan'].'</td>
</tr>
</table>
';
}
}else{
echo 'Belum ada data buku tamu';
}
?>
<p><a class="btn btn-primary btn-sm" href="data.php">Lihat semua data</a></p>
</div>
<script src="js/jquery.min.js"></script>
<script src="js/bootstrap.min.js"></script>
</body>
</html>Penjelasan kode diatas: Baris ke 2 : untuk memasukkan file config.php Menampilkan Semua data Buku Tamu Buat file dengan nama data.php lalu masukkan script dibawah ini: <?php
include("config.php");
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Buku Tamu || TutorialPedia.net</title>
<link href="css/bootstrap.min.css" rel="stylesheet">
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<nav class="navbar navbar-default navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">TUTORIALPEDIA</a>
</div>
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav">
<li><a href="index.php">Beranda</a></li>
<li class="active"><a href="data.php">Data Buku Tamu</a></li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Dropdown <span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href="#">Action</a></li>
<li><a href="#">Another action</a></li>
<li><a href="#">Something else here</a></li>
<li role="separator" class="divider"></li>
<li><a href="#">Separated link</a></li>
<li role="separator" class="divider"></li>
<li><a href="#">One more separated link</a></li>
</ul>
</li>
</ul>
</div>
</div>
</nav>
<div class="container" style="margin-top: 50px">
<h2>Data Buku Tamu!</h2>
<hr />
<?php
//menampilkan data buku tamu
$res = $koneksi->query("SELECT * FROM bukutamu ORDER BY id DESC") or die($koneksi->error);
if($res->num_rows){
while($row = $res->fetch_assoc()){
echo '
<table class="table table-condensed table-striped">
<tr>
<th width="150">TANGGAL TULIS</th>
<th width="10">:</th>
<td>'.$row['tanggal'].'</td>
</tr>
<tr>
<th width="150">NAMA LENGKAP</th>
<th width="10">:</th>
<td>'.$row['nama'].'</td>
</tr>
<tr>
<th>EMAIL</th>
<th>:</th>
<td>'.$row['email'].'</td>
</tr>
<tr>
<th>WEBSITE</th>
<th>:</th>
<td>'.$row['website'].'</td>
</tr>
<tr>
<th>JUDUL PESAN</th>
<th>:</th>
<td>'.$row['judul'].'</td>
</tr>
<tr>
<th>ISI PESAN</th>
<th>:</th>
<td>'.$row['pesan'].'</td>
</tr>
</table>
';
}
}else{
echo 'Belum ada data buku tamu';
}
?>
</div>
<script src="js/jquery.min.js"></script>
<script src="js/bootstrap.min.js"></script>
</body>
</html>Penjelasan kode diatas: Baris ke 2 : sama yaitu untuk memasukkan file config.php agar bisa terhubung ke database Sekarang simpan semua perubahan dan jalankan. Selesai! Itulah tutorial tentang Membuat Buku Tamu dengan PHP dan MySQLi. Jika ada yang ingin ditanyakan dengan kode diatas silahkan tinggalkan komentar dibawah ini. Atau menghubungi admin melalui Live Chat di Pojok kanan bawah website ini. Daftar menggunakan link di pojok kanan atas, minimal top up $25 usd. Maka dalam waktu 30 hari setelah registrasi anda akan mendapatkan credit $100 gratis dari vultr untuk mencoba layanan mereka. More Less |
Cara membuat buku tamu menggunakan php
Pos Terkait
Copyright © 2024 toptenid.com Inc.
