Halaman Admin

Bagian 3 : Buat file koneksi.
php
Buat file baru beri nama koneksi.php simpan di folder RELASI, isi dari
file koneksi.php seperti ini
<?php
//set time zone location sesuai negara, jadikan Asia Jakarta
date_default_timezone_set('Asia/Jakarta');
//set koneksi ke server sesuai host, user, password dan database

$server="localhost";
$user="root";
$pass="";
$database="Web_sparepart";
//koneksikan ke server
$conect=mysqli_connect($server,$user,$pass,$database) or die('Error Connection
Network');
//buat parameter untuk mempercepat penulisan url misal https://www.develindo.com

atau http://localhost/folderwebanda
$hostname="http://localhost/web_sparepart";
?>
simpan file koneksi.php
Bagian 4 : Buat file index.php sebagai

halaman login admin
File index merupakan file yang mewakili suatu folder, jadi jika folder tersebut dibuka pada
browser maka file index inilah yang pertama kali akan muncul. File index.php berisi form login
admin, untuk masuk dapat menggunakan email dan password.
Buat file baru beri nama index.php simpan di folder ADMINWEB dengan isi file seperti ini
<?php
//abaikan error yang muncul pada browser
error_reporting(0);
//sesi dimulai
session_start();
//panggil koneksi.php untuk menghubungkan ke database
include "../assets/relasi/koneksi.php";
//jika sesi sudah admin (sudah pernah login) maka akan di direct ke halaman
home.php
if(isset($_SESSION["data_admin"]))
{
header("location:home.php");
}
$user = mysqli_real_escape_string($conect, $_POST['email_admin']);

$pass = mysqli_real_escape_string($conect, $_POST['password_admin']);
$pass_md5= md5($pass);
$kode = mysqli_real_escape_string($conect, $_POST['kode']);
if(isset($_POST['login'])){
if($user == ""){
$er_email="<div class='alert alert-warning alert-dismissible' role='alert'>
<button type='button' class='close' data-dismiss='alert' aria-label='Close'>
<span aria-hidden='true'>×</span></button>
<strong>Username Kosong !</strong> <br> Username wajib diisi</div>";
}
elseif($pass == ""){
$er_pass="<div class='alert alert-warning alert-dismissible' role='alert'>
<strong>Password Kosong !</strong> <br> Password Wajib diisi</div>";
}
elseif($_SESSION['kode_session'] != $kode){
$er_kode="<div class='alert alert-warning alert-dismissible' role='alert'>
<strong>Kode Salah !</strong> <br> Ulangi Kode Dengan Benar</div>";
}
else{
//cek apakah username terdaftar atau tidak di tb_admin
$sql_cek=mysqli_query($conect, "SELECT * FROM tb_admin where
email_admin='$user' and pass_admin='$pass_md5'");
$cek_admin=mysqli_num_rows($sql_cek);
if($cek_admin == "0"){
//jika username dan password tidak terdaftar di tb_admin
$er_email="<div class='alert alert-danger alert-dismissible' role='alert'>
<span aria-hidden='true'>×</span>
</button><strong>Login Gagal !</strong> <br>Username dan Password tidak
valid</div>";
}
else{
//jika username dan password terdaftar di tb_admin maka akan menuju
halaman home.php
$_SESSION['data_admin']=$user;
echo "<script>alert('Selamat Datang di Halaman
Admin !');document.location='home.php'</script>";
}
}
}
$iweb=mysqli_fetch_array(mysqli_query($conect, "select * from tb_identitas where
id_identitas='1'"));
?>
<!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">
<meta name="keywords" content="<?php echo $iweb['katakunci'];?>">
<meta name="description" content="<?php echo $iweb['deskripsi'];?>" />
<meta name="author" content="<?php echo $iweb['pembuat'];?>">
<title><?php echo $iweb['nama_website'];?></title>
<link rel="Shortcut Icon" href="<?php echo $hostname;?
>/assets/images/logo/<?php echo $iweb['logo'];?>" type="image/x-icon" />

<link href="<?php echo $hostname;?>/assets/css/bootstrap.css"
rel="stylesheet" type="text/css" media="all">

<link href="<?php echo $hostname;?>/assets/css/style_admin.css"
rel="stylesheet" type="text/css" media="all">

<link href="<?php echo $hostname;?>/assets/fonts/font-awesome/css/font-
awesome.min.css" rel="stylesheet" type="text/css">
<script src="<?php echo $hostname;?>/assets/js/jquery.min.js"></script>
<script src="<?php echo $hostname;?>/assets/js/bootstrap.js"></script>
<script src="<?php echo $hostname;?>/assets/js/ie10-viewport-bug-
workaround.js"></script>
</head>
<body class="bodylogin">
<div class="container"> 
<div class="row">
<div class="col-lg-12">
<div class="login">
<p><b>LOGIN ADMIN WEB</b></p>
<hr>

<form action="" method="post">
<div class="form-group">
<label>Email</label>
<div class="input-group input-group-sm"><span
class="input-group-addon"><i class="fa fa-user fa-fw"></i></span>
<input type="text" name="email_admin"
placeholder="Email" class="form-control" maxlength="40" value="<?php echo
$_POST['email_admin'];?>" autofocus>
</div>
</div>
<?php echo $er_email;?>
<div class="form-group">

<label>Password</label>
<div class="input-group input-group-sm">
<span class="input-group-addon"><i class="fa fa-lock fa-
fw"></i></span>
<input id="pass1" type="password" name="password_admin"
placeholder="Password" class="form-control" value="<?php echo
$_POST['Password_admin'];?>" maxlength="15">
</div>
<?php echo $er_pass;?>
<div class="form-group text-center">
<img id="kd" alt="kode" src="<?php echo 'kode.php';?>">

<hr>
<input id="kode" type="text" name="kode"
placeholder="Masukan Kode diatas" class="form-control text-center" value="<?php
echo $_POST['kode'];?>" maxlength="6">
<?php echo $er_kode;?>
<button class="btn btn-danger" type="submit" name="login">Log

In</button>
<a href="./" class="btn btn-default btn-sm">Reset</a>
</form>

</div>
</div>
</div>
</div>
</body>
</html>
Lalu buat file kode.php simpan di folder ADMINWEB dengan isi script seperti ini
<?php
session_start();
header("Content-type: image/png");
$captcha_image = imagecreatefrompng("../assets/images/icon/cap2.png");
$captcha_font = imageloadfont("../assets/fonts/font.gdf");
$captcha_text = substr(md5(uniqid('')),0,4);
$_SESSION['kode_session'] = $captcha_text;
$captcha_color = imagecolorallocate($captcha_image,167,0,0);
imagestring($captcha_image,$captcha_font,20,0,$captcha_text,$captcha_color);
imagepng($captcha_image);
imagedestroy($captcha_image);
?>
Sebelum anda mencoba file index.php di browser, silahkan buat dulu

file style_admin.css sebagai file css external yang berguna untuk mempercantik tampilan
halaman web.
Buat file style_admin.css simpan di folder CSS, isi dari file style_admin.css seperti ini
/*start form login*/

.bodylogin{
background : #FFF;
background: url("../images/icon/bg.png") no-repeat;
background-size: cover;
margin-top:0;
}
.login{
width:350px;
min-height:350px;
border:#D9534F solid 1px;
background:rgba(255,255,255,0.6);
padding:20px;
margin:20px auto;
box-shadow: 0 2px 7px rgba(0, 0, 0, 0.1);
}
.login i{
color:#D9534F;
}
.login h1{
font-size:28px;
color:#D9534F;
text-align:center;
}
@media(max-width:450px) {
.login{
width:300px;
}
}
/*end form login*/
/*Template admin*/
body {
margin-top: 150px;
background-color: #fff;
}
#wrapper {
padding-left:0;
}
#page-wrapper {
width: 100%;
padding: 0;
}
/* Side Navigation */
@media(min-width:768px) {
body {
margin-top: 50px;
}
#wrapper {
padding-left: 225px;
}
#page-wrapper {
padding: 10px;
}
.side-nav {
position: fixed;
top: 51px;
left: 225px;
bottom:0px;
width: 225px;
margin-left: -225px;
border: none;
border-radius: 0;
overflow-y: auto;
background-color: #4FD9CF;
}
.side-nav>li>a {
width: 225px;
border: #eee solid 1px;
}
.side-nav li a:hover,
.side-nav li a:focus {
outline: none;
background-color: #000 !important;
}
}
.side-nav>li>ul {
padding: 0;
}
.side-nav>li>ul>li>a {
display: block;
padding: 10px 15px 10px 38px;
text-decoration: none;
color: #999;
}
.side-nav>li>ul>li>a:hover {
color: #222;
}
/* Top Navigation */
.top-nav {
padding: 0 15px;
}
.top-nav>li {
display: inline-block;
float: left;
}
.top-nav>li>a {
padding-top: 15px;
padding-bottom: 15px;
line-height: 20px;
color: #fff;
}
.top-nav>li>a:hover,
.top-nav>li>a:focus,
.top-nav>.open>a,
.top-nav>.open>a:hover,
.top-nav>.open>a:focus {
color: #fff;
background-color: #000;
}
.top-nav>.open>.dropdown-menu {
float: left;
position: absolute;
margin-top: 0;
border: 1px solid rgba(0,0,0,.15);
border-top-left-radius: 0;
border-top-right-radius: 0;
}
ul.message-dropdown {
padding: 0;
max-height: 250px;
overflow-x: hidden;
overflow-y: auto;
}
li.message-preview {
width: 275px;
border-bottom: 1px solid rgba(0,0,0,.15);
}
li.message-preview>a {
padding-top: 15px;
padding-bottom: 15px;
}
li.message-footer {
margin: 5px 0;
}
ul.alert-dropdown {
width: 200px;
}
.navbar-inverse {
background-color: #4FD9CF;
border-color: #32A199;
}
.navbar a.navbar-brand{
color:#fff;
}
.navbar-inverse .navbar-nav li a{
color:#fff;
font-size:14px;
}
.navbar-inverse .navbar-nav li ul li a{
color:#000;
font-size:14px;
min-width:225px;
border-bottom:#BBB solid 1px;
}
.navbar-inverse .navbar-nav li ul li a:hover{
color:#fff;
}
/*Template admin*/
Oke, Sekarang coba jalankan pada localhost anda, hasil yang seharusnya muncul adalah seperti
ini
Masukan username dengan email dan password serta kode captcha yang tertera untuk dapat
masuk ke halaman admin. Namun karena halaman admin anda belum dibuat maka tampilannya
akan kosong.
Bagian 5 : Membuat halaman home admin

Halaman home akan muncul setelah anda berhasil login, halaman home berisi ucapan selamat
datang dan beberapa menu.
Buat file baru beri nama home.php simpan di folder ADMINWEB, isi dari file
home.php seperti ini
<?php
//pemanggilan file metatag
include "setting_metatag.php";
//pemanggilan file navbar
include "setting_navbar.php";
?>
<div id="page-wrapper">
<div class="container-fluid">


<div class="row">
<div class="col-lg-12">
<h1>
<i class="fa fa-home fa-fw"></i> Homepage Admin
</h1>
<ol class="breadcrumb">
<li class="active">
Dashboard
</li>
<li>Home</li>
</ol>
</div>
</div>

<div class="row">
<div class="col-lg-12">


<div class="jumbotron">
<div class="container">
<h1 class="display-3">SELAMAT DATANG </h1>
<p class="lead">Selamat bekerja ! Gunakan sistem ini
untuk kepentingan penjualan dan pemasaran produk. Tingkatkan Omzet dengan
perbanyak posting, share medsos dan advertising</p>
<p>Tim Support</p>
</div>
</div>
</div>
</div>
</div>

</div>

</div>

<?php
//pemanggilan file setting footer
include "setting_footer.php";
?>
Buat file baru beri nama setting_metatag.php simpan di folder ADMINWEB, isi dari
file setting_metatag seperti ini
<?php
//session dimulai
session_start();
//abaikan error pada browser
error_reporting(0);
//panggil file koneksi untuk mengkoneksinkan dengan database
include "../assets/relasi/koneksi.php";
//panggil file security untuk mengecek session admin
include "security.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">
<meta name="keywords" content="<?php echo $iweb['katakunci'];?>">
<meta name="description" content="<?php echo $iweb['deskripsi'];?>" />
<meta name="author" content="<?php echo $iweb['pembuat'];?>">
<title><?php echo $iweb['nama_website'];?></title>
<link rel="Shortcut Icon" href="<?php echo $hostname;?
>/assets/images/logo/<?php echo $iweb['logo'];?>" type="image/x-icon" />

<link href="<?php echo $hostname;?>/assets/css/bootstrap.css"
rel="stylesheet">

<link href="<?php echo $hostname;?>/assets/css/style_admin.css"
rel="stylesheet">


<link href="<?php echo $hostname;?>/assets/fonts/font-awesome/css/font-
awesome.min.css" rel="stylesheet" type="text/css">
<link href="<?php echo $hostname;?>/assets/css/datepicker.min.css"

rel="stylesheet">
<script src="<?php echo $hostname;?>/assets/js/jquery.min.js"></script>

<script src="<?php echo $hostname;?>/assets/js/bootstrap.js"></script>
<script src="<?php echo $hostname;?>/assets/js/bootstrap-
datepicker.min.js"></script>
</head>
<body>
<div id="wrapper">
Buat file baru beri nama setting_navbar.php simpan di folder ADMINWEB, isi dari
file setting_navbar seperti ini

<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-
toggle="collapse" data-target="#navbar" aria-expanded="false" aria-
controls="navbar">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#"><span class="fa fa-home"></span>
SIPENKOV</a>
</div>
<ul class="nav navbar-right top-nav">
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-
toggle="dropdown"><span class="label label-danger">42</span> <i class="fa fa-
envelope"></i> <b class="caret"></b></a>
<ul class="dropdown-menu message-dropdown">
<li class="message-preview">
<a href="#">
<div class="media">
<div class="media-body">
<h5 class="media-heading"><strong>John
Smith</strong>
</h5>
<p class="small text-muted"><i class="fa
fa-clock-o"></i> Yesterday at 4:32 PM</p>
<p>Lorem ipsum dolor sit amet,
consectetur...</p>
</div>
</div>
</a>
</li>
<li class="message-preview">
<a href="#">
<div class="media">
<div class="media-body">
<h5 class="media-heading"><strong>John
Smith</strong>
</h5>
<p class="small text-muted"><i class="fa
fa-clock-o"></i> Yesterday at 4:32 PM</p>
<p>Lorem ipsum dolor sit amet,
consectetur...</p>
</div>
</div>
</a>
</li>
<li class="divider"></li>
<li class="message-footer">
<a href="#">Read All New Messages</a>
</li>
</ul>
</li>
<a href="#" class="dropdown-toggle" data-
toggle="dropdown"><i class="fa fa-bell"></i> <b class="caret"></b></a>
<ul class="dropdown-menu alert-dropdown">
<li>
<a href="#">Alert Name <span class="label label-
default">Alert Badge</span></a>
</li>
<li>
primary">Alert Badge</span></a>
</li>
<li>
success">Alert Badge</span></a>
</li>
<li class="divider"></li>
<li>
<a href="#">View All</a>
</li>
</ul>
</li>
<a aria-expanded="false" href="#" class="dropdown-toggle" data-
toggle="dropdown"><?php echo $admin['nama_admin'];?><span
class="caret"></span></a>
<ul class="dropdown-menu" role="menu">
<li><a href="logout.php">Logout</a></li>
</ul>
</li>
</ul>
<div id="navbar" class="navbar-collapse collapse">
<ul class="nav navbar-nav side-nav">
<li><a href="home.php">Home</a></li>
<li><a href="member.php">Data Member</a></li>
toggle="dropdown">Data Produk <span class="caret"></span></a>
<li><a href="produk.php">Daftar Produk</a></li>
<li><a href="brand.php">Brand / Merk</a></li>
<li><a href="supplier.php">Suplier</a></li>
<li><a href="kategori.php">Kategori Produk</a></li>
</ul>
</li>
toggle="dropdown">Data Kurir <span class="caret"></span></a>
<li><a href="ongkir.php">Daftar Harga Ongkir</a></li>
<li><a href="kurir.php">Daftar Kurir</a></li>
</ul>
</li>
toggle="dropdown">Pengaturan <span class="caret"></span></a>
<li><a href="infobis.php">Informasi Bisnis</a></li>
<li><a href="identitas.php">Informasi SEO Website</a></li>
<li><a href="slider.php">Foto Slider</a></li>
<li><a href="admin.php">Akun Admin</a></li>
</ul>
</li>
</ul>
</div>
</nav>

Buat file baru beri nama setting_footer.php simpan di folder ADMINWEB, isi dari
file setting_footer seperti ini
<script>
$(document).ready(function () {
$('#datePicker')
.datepicker({
format: 'yyyy-mm-dd'
})
});
</script>


<script src="<?php echo $hostname;?>/assets/js/ie10-viewport-bug-
workaround.js"></script>
</body>
</html>
Buat file baru beri nama security.php simpan di folder ADMINWEB, isi dari
file security.php seperti ini
<?php
//jika session tidak sesuai dengan data_admin maka akan diarahkan ke halaman
logout.php atau keluar dari sistem
if(!isset($_SESSION['data_admin'])){
header('location:logout.php');
}
else{
//jika session sesuai maka session akan digunakan untuk memanggil data dari
tb_admin
$akun=$_SESSION['data_admin'];
$admin=mysqli_fetch_array(mysqli_query($conect, "SELECT * FROM tb_admin where
email_admin='$akun'"));
$iweb=mysqli_fetch_array(mysqli_query($conect, "SELECT * FROM tb_identitas where
id_identitas='1'"));
}
//$admin merupakan variabel dari query pemanggilan tb_admin
//$iweb merupakan variabel dari query pemanggilan tb_identitas
?>
Simpan dan coba anda jalankan, maka tampilannya akan seperti ini setelah anda berhasil login
Selanjutnya untuk dapat keluar dari halaman home anda harus log out, dengan klik link log out
yang berada pada pojok, klik bagian nama anda maka akan muncul menu dropdown logout.
Bagian 6 : Buat file logout.php

Buat file baru beri nama logout.php simpan di folder ADMINWEB, isi dari
file logout.php seperti ini
<?php
session_start();
error_reporting(0);
session_destroy();
header('location:index.php');
?>
Coba nada jalankan dengan klik tombol logout, maka halaman akan menuju file index / login
admin lagi.

Halaman Admin

Diunggah oleh

Informasi Dokumen

Judul Asli

Hak Cipta

Format Tersedia

Bagikan dokumen Ini

Bagikan atau Tanam Dokumen

Opsi Berbagi

Apakah menurut Anda dokumen ini bermanfaat?

Apakah konten ini tidak pantas?

Hak Cipta:

Format Tersedia

Halaman Admin

Diunggah oleh

Hak Cipta:

Format Tersedia

Bagian 3 : Buat file koneksi.

//set koneksi ke server sesuai host, user, password dan database

//buat parameter untuk mempercepat penulisan url misal https://www.develindo.com

simpan file koneksi.php

Bagian 4 : Buat file index.php sebagai

$user = mysqli_real_escape_string($conect, $_POST['email_admin']);

<?php echo $er_email;?>

<div class="form-group">

<img id="kd" alt="kode" src="<?php echo 'kode.php';?>">

<button class="btn btn-danger" type="submit" name="login">Log

Sebelum anda mencoba file index.php di browser, silahkan buat dulu

/start form login/

Bagian 5 : Membuat halaman home admin

<link href="<?php echo $hostname;?>/assets/css/datepicker.min.css"

<script src="<?php echo $hostname;?>/assets/js/jquery.min.js"></script>

Bagian 6 : Buat file logout.php

Anda mungkin juga menyukai