Anda di halaman 1dari 26

BELANJA AJA

PERANCANGAN DAN PEMROGRAMAN WEB

Disusun Oleh :

1. Muhammad Shidqi 1820803039

2. Tamia Wihelmika Putri Iswandi 1820803046

3. Arda Miftahul Jannah 1830803051

Dosen Pengampu :

Dian Hafid Zulfikar, M.Cs

Program Studi Sistem Informasi

Fakultas Sains dan Teknologi

Universitas Islam Negeri Raden Fatah Palembang

2019
A. Pembahasan Website Belanja
Belanja merupakan website yang bergerak di bidang perdaganggan
online. Sama halnya Shopee, website ini juga menyediakan berbagai
produk yang akan dijual kepada pelanggan, yang di lengkapi dengan
jumlah barang pada setiap barangnya.
Selain itu, website ini mengharuskan pelanggan untuk memiliki
akun agar dapat masuk dalam website sehingga dapat memudahkan pihak
Belanja dalam melakukan proses jual-beli, sampai pengiriman produk.
Perlu di ketahui informasi yang ada di dalam website ini
merupakan data dan identitas palsu, pembahasan lebih lengkap meliputi
struktur direktori, tampilan halaman beserta bagian kode php dan koneksi
ke basis data marlaDB.
Penulis juga menggunakan Extention PHP MySqli, yang dimana
MYSQLI merupakan kependekan dari MYSQL Improved extension,
extension PHP ini merupakan versi perbaikan dan penambahan dari
extension MYSQL sebelumnya yang umum digunakan. Extension PHP
MYSQLI dibuat dengan tujuan untuk mendukung fitur-fitur terbaru dari
MYSQL server versi 4.1 ke atas. Dan extention MySqli ini lebih aman dari
versi sebelumnya yakni MySql.

Pada saat menjelaskan program. Penulis akan menggunakan


komentar di dalam code editor, lalu penulis tidak menjelaskan hal yang
sama jika ada.

B. Struktur Direktori
belanja_aja
a. Admin
1) Img
a) Arda.jpeg
b) Mia.jpeg
c) Shidqi.jpg
2) Data_pembelian_admin.php
3) Delete.php
4) Header_admin.php
5) Index.php
6) Logout.php
7) Tambah.php
8) Tambah_data.php
9) Tentang_kami.php
b. animate
c. css
d. Fontawesome-free
e. Js
f. 1324.png
g. Config.php
h. Header.php
i. Icon.png
j. Index.php
k. Login.php
l. Registrasi.php
m. Registrasi_save.php
C. Kode php
a. Config.php
<?php
// variabel $koneksi melakukan koneksi ke databse mysqli
parameter pertama adalah nama host, lalu username databse, lalu
password database, dan yang terakhir adalah nama dari database yang
kita buat
$koneksi = mysqli_connect("localhost", "root", "", "belanja_aja");

// membuat sebuah function agar kita tidak perlu membuat perintah


panjang2 lagi untuk membuat sebuah fetch array di dalam codingan
yg lain dengan nilai parameter yang kita tentukan
function query($query) {
// untuk mencari variabel koneksi secara global, sebab di
dalam function query, $koneksi tidak ada. jadi kita harus mencari nya
secara global
global $koneksi;

// membuat sebuah variabel $result yg berisi kan sebuah


function mysqli_query yang digunakan untuk memberikan perintah
query ke MySQL server, adapun perintah SQL yang digunakan
seperti SELECT, INSERT dan DELETE. dengan nilai parameter nya
adalah sebuah $koneksi untuk menghubungkan ke dalam database.
dan juga $query yang kita inputkan secara terpisah nanti
$result = mysqli_query($koneksi, $query);

// bikin array kosong


$rows = [];

// mysqli_fetch_assoc() Fungsi ini akan menghasilkan


associative array dengan key berupa nama field dari tabel.
// dibuat pengulangan untuk mengisi array yang kosong tadi
dengan nilai2 key dari array assosiative field
while ($row = mysqli_fetch_array($result)) {
$rows[] = $row;
}
// kembalikan nilai dari key yang telah di masukkan tadi
agar bisa digunakan
return $rows;
}
?>
b. Header.php
<!-- penulis memisahkan header agar code isi selanjutnya menjadi
pendek, dan tidak perlu melakukan pemanggilan config berulang
ulang -->
<?php
// digunakan untuk menjalankan file config.php ke dalam file ini,
agar file yang memanggil header.php dapat langsung mengakses ke
dalam database, karena di dalam config.php terdapat koneksi databse
include 'config.php';
?>
<!DOCTYPE html>
<html>
<head>
<!-- tag link digunakan untuk memanggil framework css yaitu
bootstrap yang telah dipersiapkan sebelumnya, dan juga ada untuk
animasi yang menggunakan animate.css lalu icon yang menggunakan
fontawesome.css -->
<link rel="stylesheet" type="text/css" href="css/bootstrap-
grid.css">
<link rel="stylesheet" type="text/css" href="css/bootstrap-
reboot.css">
<link rel="stylesheet" type="text/css" href="css/bootstrap.css">
<link rel="stylesheet" type="text/css" href="animate/animate.css">

<link rel="stylesheet" type="text/css" href="fontawesome-


free/css/all.css">
<link rel="stylesheet" type="text/css" href="fontawesome-
free/css/fontawesome.css">

<script src="js/bootstrap.bundle.js"></script>
<script src="js/jquery.js"></script>
<script src="js/jquery.slim.js"></script>
<script src="js/bootstrap.js"></script>
c. Index.php
<!-- digunakan untuk memanggil header.php yang berisikan link
css, js serta file config.php yang melakukan koneksi ke dalam
database -->
<?php include 'header.php'; ?>
<title>Halaman Login</title>
</head>

<!-- class bg-blue adalah sebuah class yg dibuat baru -->


<body class="bg-blue">
<!-- container berfungsi untuk membuat isi konten yg ada menjadi
di tengah layar dan tidak menyenggol tepi layar -->
<div class="container">
<!-- text-white berfungsi untuk membuat text berwarna
putih. font-weight-bolder membuat text BOLD. text-center membuat
text di tengah mt-4 membuat margin top dengan parameter 4 lalu
animated bounceInLeft membuat animasi yang memantul masuk dari
kiri -->
<h1 class="text-white font-weight-bolder text-center mt-4
bayangan animated bounceInLeft">
Sistem Informasi Manajemen Shopee
</h1>

<!-- row untuk membuat baris. justify-content-center membuat


konten di tengah -->
<div class="row justify-content-center">

<!-- membuat konten mengambil setengah bagian


dari full baris row (12) sehingga membuat nya ada di tengah -->
<div class="col-lg-6">

<!-- membuat margin bagian horizontal (x) menjadi auto


untuk hp juga -->
<div class="mx-auto">
<!-- membuat sebuah card atau kotak untuk wadahnya. tapi
kita tidak kasih warna sehingga tidak terlihat. p-0 membuat sebuah
padding kanan kiri atas bawah dengan parameter 0 -->
<div class="card-body p-0">
<div class="row">
<div class="col-lg">
<div class="pt-2 pl-5 pr-5 text-center">

<!-- membuat animasi rollIn dengan


tempo yang slow. lalu membuat gambar menjadi bulat dengan
reounded-circle dan menetapkan ukuran gambar sebesar 25% dengan
w-25 -->
<img class="animated rollIn slow
rounded-circle w-25 mb-3" src="1324.png">

<!-- membuat sebuah form dengan


methode POST lalu hasil dari form tersebut akan di eksekusi ke dalam
file login.php. lalu onsubmit berfungsi untuk mengembalikan nilai
function validasi dari javasript yang ada di bawah -->
<form class="text-white"
method="post" action="login.php" onsubmit="return validasi()">

<!-- form-group adalah class


yang membuat tampilan form yang berisi juga margin. lalu delay-1s
untuk memnuat animasi tersebut delay selama 1 detik -->
<div class="form-group
animated bounceInDown delay-1s">
<!-- membuat sebuah inputan
dengan id dan name nya adalah username untuk membuat hasil dari
inputan tersebut dapat ditangkap di dalan login.php dengan
menggunakan post melalui bantuan name. placeholder berfungsi
untuk membuat text di dalam form -->
<input type="text"
class="form-control" id="username" name="username"
placeholder="Masukkan Username Anda...">
</div>
<div class="form-group
animated bounceInDown slow delay-1s">
<input type="password"
class="form-control form-control-user" id="password"
name="password" placeholder="Masukkan Sandi Anda...">
</div>

<div class="float-left mb-3


animated jackInTheBox delay-2s">
<a class="text-white"
href="registrasi.php">Buat Akun Baru</a>
</div>

<!-- membuat sebuah button


yang bertipe submit (dapat mengirimkan data dari form) lalu ada class
btn-block yang berfungsi untuk membuat button tersebut memenuhi
block yang ada. yang dalam hal ini adalah sebuah card (kotak yang
berada di tengah layar dan telah di batasi) -->
<button type="submit"
class="animated lightSpeedIn slow delay-2s btn untuk-login btn-
block text-white">
Login
</button>
</form>
</div>
</div>
</div>
</div>
</div>

</div>
</div>
</div>
</body>
</html>

<script type="text/javascript">
function validasi() {
// sebuah function untuk membuat validasi dari form yang
ada

// menangkap inputan dari user dengan menggunakan id


form
var username =
document.getElementById("username").value;
var password =
document.getElementById("password").value;

// jika var username dan password yang berisikan inputan


tadi tidak kosong, maka form tersebut akan bernilai true
if (username != "" && password!="") {
return true;
}

// dan jika kosong akan berisi false dan muncul alert


else{
alert('Username dan Password harus di isi !');
return false;
}
}

</script>
d. Login.php
<?php
include 'config.php';

// mengaktifkan session php agar variabel session dapat disimpan


dan digunakan
session_start();

// menangkap data yang dikirim dari form dengan menggunakan


POST lalu menangkap variabel yang bernama 'usernama' dan
'password' dari form html tadi. lalu untuk password, setelah inputan
tersebut ditangkap. akan langsung diubah kedalam enkripsi yang
berbentuk md5
$username = $_POST['username'];
$password = md5($_POST['password']);

// menyeleksi data admin dengan username dan password yang


sesuai
$data = mysqli_query($koneksi,"select * from user where
username='$username' and password='$password'");

// menghitung banyaknya data yang ditemukan dan sesuai agar bisa


melakukan login dengan menggunakan mysqli_num_rows dengan
parameter nya adalah $data
$cek = mysqli_num_rows($data);

// Fungsi ini akan menangkap data dari hasil perintah query dan
membentuknya ke dalam array asosiatif dan array numerik.
$user = mysqli_fetch_array($data);

// jika banyaknya lebih dari 0, brrti ada data yang cocok dari
inputan user dengan database yang ada
if($cek > 0){
// kita membuat sebuah session yang akan di bawa ke dalam
halaman admin nanti, yang berupa session['name'],
session['username'], dan session['status']
$_SESSION['name'] = $user['nama'];
$_SESSION['username'] = $username;
$_SESSION['status'] = "login";

// lalu diarahkan ke dalam folder admin dan menuju file


index.php
header("location:admin/index.php");
}

// jika tidak cocok antara inputan user dan database. maka akan
kembali ke dalam index.php dan membawa variabel pesan yang berisi
gagal melalui url
else{
header("location:index.php?pesan=gagal");
}
?>
e. Regirstrasi.php
<?php include 'header.php'; ?>
<title>Halaman Registrasi</title>
</head>
<body class="bg-blue">
<div class="container">

<!-- class bayangan untuk memberi sebuah bayangan


kepada text -->
<h1 class="text-white font-weight-bolder text-center mt-4
bayangan animated bounceInLeft">
Registrasi Akun
</h1>

<div class="row justify-content-center">

<div class="col-lg-6">

<div class="mx-auto">
<div class="card-body p-0">
<!-- Nested Row within Card Body -->
<div class="row">
<div class="col-lg">
<div class="pt-2 pl-5 pr-5 text-center">
<img class="animated rollIn slow
rounded-circle w-25 mb-3" src="1324.png">

<form class="user text-white"


method="post" action="registrasi_save.php" onsubmit="return
validasi()">
<div class="form-group
animated bounceInDown delay-1s">
<input type="text"
class="form-control form-control-user" id="nama" name="nama"
placeholder="Masukkan Nama Anda...">
</div>

<div class="form-group
animated bounceInDown slow delay-1s">
<input type="text"
class="form-control form-control-user" id="username"
name="username" placeholder="Masukkan Username Anda...">
</div>

<div class="form-group
animated bounceInDown delay-2s">
<input type="password"
class="form-control form-control-user" id="password"
name="password" placeholder="Masukkan Sandi Anda...">
</div>

<button type="submit"
class="animated lightSpeedIn slow delay-2s btn untuk-login btn-
block text-white">
Regsitrasi
</button>
</form>
</div>
</div>
</div>
</div>
</div>

</div>
</div>
</div>
</body>
</html>

<script type="text/javascript">
function validasi() {
var username =
document.getElementById("username").value;
var password =
document.getElementById("password").value;
if (username != "" && password!="") {
return true;
}else{
alert('Username dan Password harus di isi !');
return false;
}
}

</script>
f. Registrasi_save.php
<?php
include 'config.php';

// menyimpan data kedalam variabel


$nama = $_POST['nama'];
$username = $_POST['username'];
$password = md5($_POST['password']);

// query SQL untuk insert data. memanggil $koneksi. lalu memberi


perintah INSERT INTO user untuk memasukkan data ke tabel user.
lalu value atau nilai yang dibawa itu sesuai dengna urutan yang ada di
field database user, yang kosong itu berarti id, karena id sudah dibuat
auto inrement. lalu yang lainnya di ambil dari variabel di atas yg
isinya dari inputan
mysqli_query($koneksi,"INSERT INTO user
VALUES('','$nama','$username','$password')");

// mengalihkan ke halaman index.php


header("location:index.php");
?>
g. Data_pembelian_admin.php
<?php
// memanggil header_admin.php yang isinya adalah tittle, link css,
js, serta include config.php untuk koneksi database
include 'header_admin.php';

// membuat $pembelian yang isinya adalah sebuah function query


yang kita buat di dala config.php lalu parameter dari function tersebut
adalah SELECT * (seluruhnya) FROM tabel pembelian ORDER BY
id lalu melihat patokan dari id untuk membuat nya DESC atau
menurun. Jadi data yg dipanggil mngurut dari id yang besar ke yang
kecil
$pembelian = query("SELECT * FROM pembelian ORDER BY id
DESC");
?>

<body>
<!-- mr untuk mengatur margin right ml margin left -->
<div class="mr-5 ml-5">
<h1 class="animated fadeInDown slow text-center mt-2
text-pink bayangan2">Data Pembelian User</h1>

<!-- jika ingin simulasi pembelian yg baru, kita koneksikan


ke dalam tambah_data.php. lalu ada class fas fa-plus yang berfungsi
untuk menampilkan icon di fontawesome yaitu icon plus -->
<a class="animated fadeInLeft slower"
href="tambah_data.php"><i class="mb-4 fas fa-plus"></i> Add
New</a>

<!-- kita membuat bordernya 1 yang berarti ada border. jika


0 tidak ada lalu border tersebut berwarna putih dengan class border-
white lalu class table-hover berfungsi untuk membuat table nya rapi,
seperti margin, padding dan peletakkan text lainnya. lalu cellspacing
berfungsi untuk mengatur jarak dari kolom dan baris yg satu dengan
yg lainnya -->
<!-- mulai tag table -->
<table border="1" class="animated slideInRight slower
border border-white table table-hover" width="1800px"
cellspacing="0">
<!-- table bagian kepala -->
<thead class="bg-pink text-white text-center">
<tr>
<!-- colspan berfungsi untuk
menyatukan kolom dari tabel yg ada (merge) -->
<th class="pt-3 pb-3" colspan="11">Data
Transaksi User</th>
</tr>
<tr>
<!-- rowspan berfungsi untuk
menyatukan baris dari tabel yg ada (merge) -->
<th rowspan="2">No.</th>
<th rowspan="2">Tanggal</th>
<th rowspan="2">Nama
Pembeli</th>
<th rowspan="2">Alamat
Pembeli</th>
<th rowspan="2">Barang
Pesanan</th>
<th rowspan="2">Quantitas</th>
<th rowspan="2">Harga</th>
<th rowspan="2">Total</th>
<th colspan="2">Penilaian</th>
<th rowspan="2">Aksi</th>
</tr>
<tr>
<th>Komentar</th>
<th>Rating</th>
</tr>
</thead>

<!-- table bagian badan -->


<tbody>
<!-- membuat variabel i = 1 untuk dipakai
sebagai penambahan angka menaik untuk nomor tabelnya. lalu
variabel jumlah = 0 berfungsi untuk menjumlahkan nilai dari variabel
total -->
<?php $i = 1; $jumlah = 0; ?>

<!-- lakukan pengulangan sampai ke semua


field databse dari variabel pembelian yang dimisalkan menjadi beli
-->
<?php foreach ($pembelian as $beli): ?>

<!-- jika bayar nya bernilai 1 berarti


dia telah membayar, dan warna kolom akan menjadi warna hijau. dan
jika bernilai 0 berarti belum membayar dan akan menjadi warna
merah -->
<?php if ($beli['bayar'] == 1): ?>
<tr class="bg-success text-white">
<?php endif ?>

<?php if ($beli['bayar'] == 0): ?>


<tr class="bg-danger text-white">
<?php endif ?>

<td class="text-center"
width="10px">
<!-- mencetak
variabel i yang dimulai dari 1 hingga n tabel -->
<?= $i ?>
</td>

<td width="100px">
<!-- mencetak
variabel beli yang di dapat dari variabel pembelian yang berisikan
select dari database pembelian. lalu kita panggil key dari array
assosiative nya, yaitu field tanggal yang ada di dalam database -->
<?= $beli['tanggal'] ?>
</td>

<td width="100px">
<?=
$beli['nama_pembeli'] ?>
</td>

<td width="100px">
<?= $beli['alamat'] ?>
</td>

<td width="100px">
<?= $beli['pesanan'] ?
>
</td>

<td width="100px">
<?=
$beli['quantitas'] ?>
</td>

<td width="100px">
<!-- number_format
adalah sebuah function yang disediakan oleh php untuk membuat
tampilan dari angka kita menjadi lebih rapi dengan bantuan titik dan
koma -->
Rp. <?=
number_format($beli['harga'], 0, ',', '.') ?>
</td>

<td width="100px">
Rp. <?=
number_format($beli['total'], 0, ',', '.') ?>
</td>

<!-- jika bayar == 1 yang


berarti user telah membayar, maka variabel jumlah yang awalnya
bernilai 0 tadi akan berisikan penjumlahan diri dari setiap variabel
$beli['total'] kolom total -->
<?php if ($beli['bayar'] == 1):
?>
<?php $jumlah +=
$beli['total']; ?>
<?php endif ?>

<td width="100px"
class="text-center">
<?=
$beli['komentar'] ?>
</td>
<td width="40px"
class="text-center">
<?= $beli['rating'] ?>
</td>

<td width="30px"
class="text-center">
<!-- sebuah icon
delete yang akan menuju ke file delete.php jika ditekan, lalu saat
ditekan dia akan membawa data melalui url dengan menggunakan
tanda tanya. lalu kita membuat variabel baru bernama id, yang isinya
adalah dari $beli['id'] -->
<a href="delete.php?
id=<?= $beli['id']; ?>" class="btn btn-small text-white"><i class="fas
fa-trash"></i></a>
</td>
</tr>

<?php $i++; ?>


<?php endforeach ?>
<tr class="bg-pink text-white font-
weight-bold">
<td
colspan="7">TOTAL</td>
<!-- disini kita menampilkan
hasil dari penjumlahan dari datanya -->
<td colspan="4">Rp. <?=
number_format($jumlah, 0, ',', '.') ?></td>
</tr>
</tbody>
</table>
</div>
</body>
</html>
h. Delete.php
<?php
// ../ digunakan untuk kembali 1 tingkat dari direktori sekarang
include '../config.php';

// variabel id yang bernilai GET id dari yg dikirimkan oleh url tadi


$id = $_GET['id'];
// lalu kita menghapus dari tabel pembelian yg dimana jika id di
dalam field pembelian itu bernilai id hasil kiriman url
mysqli_query($koneksi, "DELETE FROM pembelian WHERE
id='$id'");

header("location:data_pembelian_admin.php");
?>
i. Header_admin.php
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="../css/bootstrap-
grid.css">
<link rel="stylesheet" type="text/css" href="../css/bootstrap-
reboot.css">
<link rel="stylesheet" type="text/css" href="../css/bootstrap.css">
<link rel="stylesheet" type="text/css"
href="../animate/animate.css">

<link rel="stylesheet" type="text/css" href="../fontawesome-


free/css/all.css">
<link rel="stylesheet" type="text/css" href="../fontawesome-
free/css/fontawesome.css">

<script src="../js/bootstrap.bundle.js"></script>
<script src="../js/jquery.js"></script>
<script src="../js/jquery.slim.js"></script>
<script src="../js/bootstrap.js"></script>
<title>Halaman Admin</title>

<?php
// mengaktifkan session
session_start();

// cek apakah user telah login, jika belum login maka di


alihkan ke halaman login
if($_SESSION['status'] !="login"){
header("location:../index.php");
}

require '../config.php';
?>
<nav class="navbar navbar-expand-lg navbar-light bg-blue">

<!-- kita memnggil data yg berada di SESSION['name']


berdasarkan siapa yg login -->
<h4 class="navbar-brand font-weight-bolder text-white">(<?=
$_SESSION['name'] ?>)</h4>
<div class="collapse navbar-collapse"
id="navbarNavDropdown">
<ul class="navbar-nav">
<li class="nav-item mr-2">
<a class="nav-link text-white" href="index.php">Home</a>
</li>
<li class="nav-item mr-2">
<a class="nav-link text-white"
href="data_pembelian_admin.php">Data Pembelian</a>
</li>
<li class="nav-item mr-2">
<a class="nav-link text-white"
href="tentang_kami.php">Tentang Kami</a>
</li>
<li class="nav-item mr-2">
<a class="nav-link btn btn-danger text-white"
href="logout.php">LOGOUT</a>
</li>
</ul>
</div>
</nav>
</head>
j. Index.php(folder admin)
<?php
include 'header_admin.php';
?>

<body>
<div class="container">
<!-- panggil session name -->
<h1 class="animated fadeInDown slow text-center mt-2
text-pink bayangan2">Selamat Datang <?= $_SESSION['name'] ?> di
Sistem Manajemen Toko</h1>

<div class="text-center">
<img width="70%" height="45%" class="animated
fadeInUp slow" src="../icon.png">
</div>
</div>
</body>
</html>
k. Logout.php
<?php

// kita masih memulai session yang kita bawa tadi, agar sessionnya
bisa kita hancurkan
session_start();

// lalu hancurkan session yang ada, agar tidak bisa masuk ke dalam
menu yang harus login terlebih dahulu
session_destroy();
header("location:../index.php");
?>
l. Tambah.php
<?php
include '../config.php';

// untuk mengubah zona gmt ke arah jakarta (ibukota indonesia)


ini_set('date.timezone', 'Asia/Jakarta');

// menyimpan data kedalam variabel


// function date digunakan untuk memanggil hari, bulan, tahun,
jam, menit, detik saat form di inputkan
$tanggal = date('d F Y, h:i:s');
$nama_pembeli = $_POST['nama_pembeli'];
$alamat = $_POST['alamat'];
$pesanan = $_POST['pesanan'];
$quantitas = $_POST['quantitas'];
$harga = $_POST['harga'];
$total = $_POST['quantitas'] * $_POST['harga'];
$komentar = $_POST['komentar'];
$rating = $_POST['rating'];

// jika ada nilai di dalam checkbox bayar. maka variabel bayar akan
bernilai 1. jika tidak akan bernilai 0
if(isset($_POST['bayar']) ) {
$bayar = 1;
}
else{
$bayar = 0;
}

// query SQL untuk insert data


mysqli_query($koneksi,"insert into pembelian
values('','$tanggal','$nama_pembeli','$alamat','$pesanan','$quantitas','$
harga','$total','$komentar','$rating','$bayar')");

header("location:data_pembelian_admin.php");
?>
m. Tambah_data.php
<?php
include 'header_admin.php';
?>

<body>
<div class="container mb-4">
<h1 class="animated fadeInDown slow text-center mt-2
text-pink bayangan2">Simulasi Pembelian User</h1>
<form action="tambah.php" method="post">
<div class="form-group">
<label for="id_nama_pembeli">Nama
Pembeli*</label>
<textarea id="id_nama_pembeli"
class="form-control" name="nama_pembeli" placeholder="Masukkan
Nama Pembeli"></textarea>
</div>

<div class="form-group">
<label for="id_alamat">alamat
Pembeli*</label>
<textarea id="id_alamat" class="form-
control" name="alamat" placeholder="Masukkan Alamat
Pembeli"></textarea>
</div>

<div class="form-group">
<label for="id_pesanan">Pesanan
Pembeli*</label>
<textarea id="id_pesanan" class="form-
control" name="pesanan" placeholder="Masukkan Pesanan
Pembeli"></textarea>
</div>

<div class="form-group">
<label for="id_quantitas">quantitas
Pembeli*</label>
<input type="number" id="id_quantitas"
class="form-control" name="quantitas" placeholder="Masukkan
quantitas Pembeli"></input>
</div>

<div class="form-group">
<label for="id_harga">harga
Pembeli*</label>
<input type="number" id="id_harga"
class="form-control" name="harga" placeholder="Masukkan harga
Pembeli"></input>
</div>

<div class="form-group">
<label for="id_komentar">komentar
Pembeli*</label>
<textarea id="id_komentar" class="form-
control"name="komentar" placeholder="Masukkan komentar
Pembeli"></textarea>
</div>

<div class="form-group">
<label for="id_rating">rating
Pembeli*</label>
<input type="number" id="id_rating"
class="form-control"name="rating" placeholder="Masukkan rating
Pembeli"></input>
</div>

<!-- inputan bertipe checkbox -->


<input type="checkbox" name="bayar"> Apakah
User Sudah Membayar?
<br>

<button type="submit" class="mt-2 btn btn-


success">
Simpan
</button>
</form>
</div>
</body>
</html>
n. Tenang_kami.php
<?php
include 'header_admin.php';

$about = query("SELECT * FROM about");


?>

<body>
<div class="container mb-4 text-pink">

<h1 class="animated fadeInDown slow text-center mt-2


bayangan2">Biodata Team</h1>
<div class="row">
<?php foreach ($about as $abt): ?>
<div class="col-lg-4 mx-auto ">
<div class="animated flipInY slow shadow
rounded pl-3 pr-3 pb-2">
<div class="animated zoomIn slower text-
center">
<!-- memanggil variabel abt dengan
key 'gambar' -->
<img class="w-75 rounded-circle"
src="img/<?= $abt['gambar'] ?>" alt="">
</div>
<div class="animated bounceInRight delay-
1s">
<label for="name">Nama Lengkap :
</label>
<h5 class="font-weight-bold"
id="name"><?= $abt['nama_lengkap'] ?></h5>
</div>

<div class="animated bounceInLeft slower


delay-1s">
<label for="motto">Motto : </label>
<p class="font-weight-bold"
id="motto"><?= $abt['motto'] ?></p>
</div>

<ul class="list-inline social-buttons">

<li class="animated bounceInRight delay-


2s">
<div class="row">
<label for="whatsapp" class="col-lg-
2">
<!-- memanggil icon dari font
awesome -->
<i class="fab fa-whatsapp fa-2x fa-
fw"></i>
</label>
<div class="col-lg-10">
<p class="font-weight-bold"
id="whatsapp"><?= $abt['wa'] ?></p>
</div>
</div>

</li>
<li class="animated bounceInLeft slower
delay-2s">
<div class="row">
<label for="facebook" class="col-lg-
2">
<i class="fab fa-facebook-f fa-2x fa-
fw"></i>
</label>
<div class="col-lg-10">
<p class="font-weight-bold"
id="facebook"><?= $abt['fb'] ?></p>
</div>
</div>
</li>

<li class="animated bounceInRight delay-


3s">
<div class="row">
<label for="instagram" class="col-lg-
2">
<i class="fab fa-instagram fa-2x fa-
fw"></i>
</label>
<div class="col-lg-10">
<p class="font-weight-bold"
id="instagram"><?= $abt['ig'] ?></p>
</div>
</div>
</li>

</ul>
</div>
</div>
<?php endforeach ?>
</div>
</div>
</body>
</html>

Anda mungkin juga menyukai