Online Course

NK07 - Membuat Pengaturan Profil Perusahaan di Halaman admin

Membuat Pengaturan Profil Perusahaan di Halaman admin

Ikuti langkah berikut ini

Pertama, Download komponen plugins CKEDITOR dan CKFINDER

DOWNLOAD CKEDITOR

Download file tersebut, simpan di dalam folder plugins yang ada di dalam folder assets

Lalu, extract file tersebut sehingga di dalam folder plugins menjadi seperti ini

folder-plugins

Buka folder ckfinder dan buka file config.php

lalu edit bagian yang berwarna kuning ( Baris code ke 68), ubah sesuai nama folder web anda, simpan kembali

config

Simpan kembali file config.php tersebut

Kedua, Buat tabel baru dengan nama tb_profil di database anda

Struktur dari tb_profil seperti ini

tb-profil

Ketiga, Buat file baru beri nama profil.php simpan di folder ADMINWEB

isi dari file profil.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">
                <!-- .row -->
                <!-- Page Heading  breadcumb-->
                <div class="row">
                    <div class="col-lg-12">
                        <h3>
                            Profil
                            <a href="input_profil.php" title="Input data"><button name="input" class="btn btn-primary pull-right"><i class="fa fa-plus fa-fw"></i> Tambah Data</button></a>

                        </h3>
                        <ol class="breadcrumb">
                            <li class="active">
                                <i class="fa fa-dashboard"></i> Home
                            </li>
                            <li class="active">
                                <i class="fa fa-list"></i> Data Profil
                            </li>
                        </ol>
                    </div>
                </div>
                <!-- /.row -->

                <!-- .row -->
                <div class="row">

                <!-- .col lg 12 -->
                    <div class="col-lg-12">

                    <!-- panel . (Pelajari cara membuat panel di bootstrap yah)-->
                        <div class="panel panel-danger">

                        <!-- panel heading -->
                            <div class="panel-heading">
                            Profil
                            </div>
                        <!-- /.panel heading -->

                        <!-- panel body -->
                            <div class="panel-body">

                            <!-- /.tabel responsive -->
                                <div class="table-responsive">
                                    <table class="table table-bordered">
                                        <thead>
                                            <tr>
                                                <th>No</th>
                                                <th>Judul</th>
                                                <th>Deskripsi</th>
                                                <th>Action</th>

                                            </tr>
                                        </thead>
                                        <tbody>
                                        <?php
                                        $pg = isset( $_GET['pg'] ) ? $_GET['pg'] : "";
                                        $batas = 10; /*batas tampilan setiap halaman*/
                                        if ( empty( $pg ) ) {
                                        $posisi = 0;
                                        $pg = 1;
                                        } else {
                                        $posisi = ( $pg - 1 ) * $batas;
                                        }
                                        /*Jika variabel $pg kosong maka akan menampilkan halaman pertama dengan batas baris 10*/

                                        $ambildata=mysqli_query($conect, "select*from tb_profil order by id_profil desc limit $posisi, $batas");
                                        $jumlah=mysqli_num_rows($ambildata);  /*mysql_num_rows untuk menghitung total baris di tabel databse*/
                                        if($jumlah == 0){  //jika tidak ada data
                                            ?>
                                        <tr>
                                            <td colspan="6">Tidak Terdapat Data</td>
                                        </tr>
                                        <?php
                                        }else{
                                        //jika ada data di tb_brand
                                        while($a=mysqli_fetch_array($ambildata)){ /*mysql_fetch array untuk mengambil data di setiap field di tabel databse*/
                                        ?>
                                        <tr>
                                            <td><?php echo $posisi=$posisi+1;?></td>
                                            <td><?php echo $a['judul_profil'];?></td>
                                            <td><?php echo substr(strip_tags($a['deskripsi_profil']),0,200);?></td>
                                            <td><a href="hapus_profil.php?id_profil=<?php echo $a['id_profil'];?>" onclick="return confirm('Yakin akan meghapus data ini')" title="Hapus data"><button class="btn btn-danger btn-sm">Hapus</button></a>
                                            <a href="edit_profil.php?id_profil=<?php echo $a['id_profil'];?>" title="Edit data"><button class="btn btn-info btn-sm">Edit</button> </a>
                                            </td>
                                        </tr>
                                        <?php
                                            }
                                        }
                                        ?>
                                        </tbody>
                                    </table>
                                </div>
                                <!-- /.tabel responsive -->

                                <div class="text-center">
                                    <?php
                                //script paging, untuk menampikan setiap halaman
                                $jml_data = mysqli_num_rows(mysqli_query($conect, "select*from tb_profil order by id_prfil desc"));
                                $JmlHalaman = ceil($jml_data/$batas); //ceil digunakan untuk pembulatan keatas
                                if($jml_data != 0){
                                if ( $pg > 1 ) {
                                $link = $pg-1;
                                $prev = "<a href='?pg=$link'><button name='prev' class='btn btn-primary btn-sm'>Prev</button></a> ";
                                } else {
                                $prev = "<button name='prev' class='btn btn-default btn-sm'>Prev </button> ";
                                }
                                $nmr = '';
                                for ( $i = 1; $i<= $JmlHalaman; $i++ ){

                                if ( $i == $pg ) {
                                $nmr .= "<button name='prev' class='btn btn-primary btn-sm'>$i</button> ";
                                } else {
                                $nmr .= "<a href='?pg=$i'><button name='prev' class='btn btn-default btn-sm'>$i</button></a> ";
                                }
                                }
                                if ( $pg < $JmlHalaman ) {
                                $link = $pg + 1;
                                $next = "<a href='?pg=$link'><button name='prev' class='btn btn-primary btn-sm'>Next</button></a> ";
                                } else {
                                $next = "<button name='prev' class='btn btn-default btn-sm'>Next</button> ";
                                }
                                echo $prev.$nmr.$next;
                                ?>
                                <br><br>
                                <span class="text-muted">Menampilkan <?php echo $jumlah; ?> dari <?php echo $jml_data; ?> Record </span>
                                <?php
                                }
                                ?>
                                </div>
                            </div>
                            <!-- /.panel body -->

                        </div>
                        <!-- /.panel -->

                    </div>
                    <!-- /.col lg 12-->

                </div>
                <!-- /.row -->


           </div>
            <!-- /.container-fluid -->

        </div>
        <!-- /#page-wrapper -->

    </div>
    <!-- /#wrapper -->

<?php
//pemanggilan file setting footer
include "setting_footer.php";

?>

Ganti script pada file setting_footer.php menjadi seperti ini

<script>
$(document).ready(function () {
    $('#datePicker')
        .datepicker({
            format: 'yyyy-mm-dd'
        })
    });
</script>
<script>
	CKEDITOR.replace( 'editor1',{
     filebrowserBrowseUrl: '<?php echo $hostname;?>/assets/plugins/ckfinder/ckfinder.php',
     filebrowserUploadUrl: '<?php echo $hostname;?>/assets/plugins/ckfinder/core/connector/php/connector.php?command=QuickUpload&type=Files',
     filebrowserWindowWidth: '1000',
     filebrowserWindowHeight: '700',
     uiColor: '#9AB8F3',
     } );
</script>
<!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
        <script src="<?php echo $hostname;?>/assets/js/ie10-viewport-bug-workaround.js"></script>
    </body>
</html>

Ganti Script pada file setting_metatag.php menjadi 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" />
        <!-- Bootstrap core CSS -->
        <link href="<?php echo $hostname;?>/assets/css/bootstrap.css" rel="stylesheet">
        <!-- Custom styles template ini-->
        <link href="<?php echo $hostname;?>/assets/css/style_admin.css" rel="stylesheet">

        <!-- Custom Fonts Awesome-->
        <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>
        <!-- Include CKEditor and jQuery adapter -->
        <script src="<?php echo $hostname;?>/assets/plugins/ckeditor/ckeditor.js"></script>
        <script src="<?php echo $hostname;?>/assets/plugins/ckeditor/adapters/jquery.js"></script>

</head>

<body>
<div id="wrapper">

Ganti Script pada file setting_navbar.php menjadi seperti ini

<!-- Bagian Navbar / menu bagian atas dan samping-->
<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>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
        </button>
        <a class="navbar-brand" href="#"><span class="fa fa-globe"></span> SISTEM PENJUALAN ONLINE</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>
                <li class="dropdown">
                    <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>
                            <a href="#">Alert Name <span class="label label-primary">Alert Badge</span></a>
                        </li>
                        <li>
                            <a href="#">Alert Name <span class="label label-success">Alert Badge</span></a>
                        </li>
                        <li class="divider"></li>
                        <li>
                            <a href="#">View All</a>
                        </li>
                    </ul>
                </li>
            <li class="dropdown">
                <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>

            <li class="dropdown">
                <a aria-expanded="false" href="#" class="dropdown-toggle" data-toggle="dropdown">Data Produk <span class="caret"></span></a>
                <ul class="dropdown-menu" role="menu">
                    <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>
            <li class="dropdown">
                <a aria-expanded="false" href="#" class="dropdown-toggle" data-toggle="dropdown">Data Kurir <span class="caret"></span></a>
                <ul class="dropdown-menu" role="menu">
                    <li><a href="ongkir.php">Daftar Harga Ongkir</a></li>
                    <li><a href="kurir.php">Daftar Kurir</a></li>
                </ul>
            </li>
            <li class="dropdown">
                <a aria-expanded="false" href="#" class="dropdown-toggle" data-toggle="dropdown">Pengaturan <span class="caret"></span></a>
                <ul class="dropdown-menu" role="menu">
                    <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="profil.php">Profil</a></li>
                    <li><a href="admin.php">Akun Admin</a></li>
                </ul>
            </li>

        </ul>
    </div>
</nav>
<!-- Bagian Navbar / menu bagian atas dan samping-->

Hasil dari file tersebut akan tampil seperti ini

data-profil

Keempat, Buat file baru beri nama input_profil.php simpan di folder ADMINWEB

isi dari file input_profil.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">
                <!-- .row -->
                <!-- Page Heading  breadcumb-->
                <div class="row">
                    <div class="col-lg-12">
                        <h3>
                            Tambah Data Profil
                        </h3>
                        <ol class="breadcrumb">
                            <li class="active">
                                <i class="fa fa-dashboard"></i> Home
                            </li>
                            <li class="active">
                                <i class="fa fa-list"></i> Input Data baru
                            </li>
                        </ol>
                    </div>
                </div>
                <!-- /.row -->
                <?php
                //variabel setiap input di form
                $judul=mysqli_real_escape_string($conect, $_POST['judul']);
                $des=mysqli_real_escape_string($conect, $_POST['deskripsi']);

                //jika menekan tombol simpan
                if(isset($_POST['simpan'])){
                if(empty($judul)){
                $er_judul="<div class='alert alert-warning alert-dismissable'>
                <button type='button' class='close' data-dismiss='alert' aria-hidden='true'>&times;</button>
                <i class='fa fa-info-circle'></i> Masukan Judul </div>";
                }
                elseif(empty($des)){
                $er_des="<div class='alert alert-warning alert-dismissable'>
                <button type='button' class='close' data-dismiss='alert' aria-hidden='true'>&times;</button>
                <i class='fa fa-info-circle'></i> Masukan Deskripsi </div>";
                }
                else{
                $save=mysqli_query($conect, "INSERT INTO tb_profil (id_profil,judul_profil,deskripsi_profil)values('','$judul','$des')");
                if($save){ //jika simpan berhasil
                echo "<script>alert('Data Berhasil Disimpan');document.location='profil.php'</script>";
                }
                else{  //jika simpan gagal
                $error="<div class='alert alert-warning alert-dismissable'>
                <button type='button' class='close' data-dismiss='alert' aria-hidden='true'>&times;</button>
                <i class='fa fa-info-circle'></i> Error</div>";
                }

                }
                }
                ?>
                <!-- .row -->
                <div class="row">

                <!-- .col lg 12 -->
                    <div class="col-lg-12">

                    <!-- panel . (Pelajari cara membuat panel di bootstrap yah)-->
                        <div class="panel panel-danger">

                        <!-- panel heading -->
                            <div class="panel-heading">
                                <a href="profil.php" title="Input data"><button name="input" class="btn btn-primary">Kembali</button></a>
                            </div>
                        <!-- /.panel heading -->

                        <!-- panel body -->
                            <div class="panel-body">

                            <div class="col-sm-10">
                            <!-- /.form menggunakan form group, pelajari cara membuat form di bootstrap-->

                            <form action="" method="post" enctype="multipart/form-data" role="form">
                            <?php echo $error;?>
                            <div class="form-group">
                                <label>Judul Profil</label>
                                <input type="text" class="form-control" placeholder="Judul Profil" name="judul" value="<?php echo $_POST['judul'];?>" maxlength="100">
                            </div>
                            <?php echo $er_judul;?>
                            <div class="form-group">
                                <label>Deskripsi</label>
                                <textarea class="form-control" placeholder="Deskripsi Profil" name="deskripsi" id="editor1"><?php echo $_POST['deskripsi'];?></textarea>
                            </div>
                            <?php echo $er_des;?>
                            <button type="submit" name="simpan" class="btn btn-success">Simpan</button>
                            </form>
                                <!-- /.form -->

                            </div>
                            <!-- /.panel body -->

                        </div>
                        <!-- /.panel -->

                    </div>
                    <!-- /.col lg 12-->

                </div>
                <!-- /.row -->


           </div>
            <!-- /.container-fluid -->

        </div>
        <!-- /#page-wrapper -->

    </div>
    <!-- /#wrapper -->

<?php
//pemanggilan file setting footer
include "setting_footer.php";

?>

 

Hasil dari file input_profil.php tersebut akan tampil seperti ini

input-profil

Kelima, Buat file baru beri nama edit_profil.php simpan di folder ADMINWEB

isi dari file edit_profil.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">
                <!-- .row -->
                <!-- Page Heading  breadcumb-->
                <div class="row">
                    <div class="col-lg-12">
                        <h3>
                            Ubah Data Profil
                        </h3>
                        <ol class="breadcrumb">
                            <li class="active">
                                <i class="fa fa-dashboard"></i> Home
                            </li>
                            <li class="active">
                                <i class="fa fa-list"></i> Ubah Data
                            </li>
                        </ol>
                    </div>
                </div>
                <!-- /.row -->

                <?php
                //ambil data dari tabel berdasarkan id
                $tampildata=mysqli_query($conect, "select*from tb_profil where id_profil='$_GET[id_profil]'");
                $b=mysqli_fetch_array($tampildata);

                //variabel setiap input di form
                $judul=mysqli_real_escape_string($conect, $_POST['judul']);
                $des=mysqli_real_escape_string($conect, $_POST['deskripsi']);

                //jika menekan tombol simpan
                if(isset($_POST['simpan'])){
                if(empty($judul)){
                $er_judul="<div class='alert alert-warning alert-dismissable'>
                <button type='button' class='close' data-dismiss='alert' aria-hidden='true'>&times;</button>
                <i class='fa fa-info-circle'></i> Masukan Judul </div>";
                }
                elseif(empty($des)){
                $er_des="<div class='alert alert-warning alert-dismissable'>
                <button type='button' class='close' data-dismiss='alert' aria-hidden='true'>&times;</button>
                <i class='fa fa-info-circle'></i> Masukan Deskripsi </div>";
                }
                else{
                $save=mysqli_query($conect, "UPDATE tb_profil set judul_profil='$judul',deskripsi_profil='$des' where id_profil='$_GET[id_profil]'");
                if($save){ //jika simpan berhasil
                echo "<script>alert('Data Berhasil Diubah');document.location='profil.php'</script>";
                }
                else{  //jika simpan gagal
                $error="<div class='alert alert-warning alert-dismissable'>
                <button type='button' class='close' data-dismiss='alert' aria-hidden='true'>&times;</button>
                <i class='fa fa-info-circle'></i> Error</div>";
                }

                }
                }
                ?>
                <!-- .row -->
                <div class="row">

                <!-- .col lg 12 -->
                    <div class="col-lg-12">

                    <!-- panel . (Pelajari cara membuat panel di bootstrap yah)-->
                        <div class="panel panel-danger">

                        <!-- panel heading -->
                            <div class="panel-heading">
                                <a href="profil.php" title="Input data"><button name="input" class="btn btn-primary">Kembali</button></a>
                            </div>
                        <!-- /.panel heading -->

                        <!-- panel body -->
                            <div class="panel-body">
                            <div class="col-sm-10">
                            <!-- /.form menggunakan form group, pelajari cara membuat form di bootstrap-->

                            <form action="" method="post" enctype="multipart/form-data" role="form">
                            <?php echo $error;?>
                            <div class="form-group">
                                <label>Judul Profil</label>
                                <input type="text" class="form-control" placeholder="Judul Profil" name="judul" value="<?php echo $b['judul_profil'];?>" maxlength="100">
                            </div>
                            <?php echo $er_judul;?>
                            <div class="form-group">
                                <label>Deskripsi</label>
                                <textarea class="form-control" placeholder="Deskripsi Profil" name="deskripsi" id="editor1"><?php echo $b['deskripsi_profil'];?></textarea>
                            </div>
                            <?php echo $er_des;?>
                            <button type="submit" name="simpan" class="btn btn-success">Simpan</button>

                            </form>
                                <!-- /.form -->

                            </div>
                            <!-- /.panel body -->

                        </div>
                        <!-- /.panel -->

                    </div>
                    <!-- /.col lg 12-->

                </div>
                <!-- /.row -->


           </div>
            <!-- /.container-fluid -->

        </div>
        <!-- /#page-wrapper -->

    </div>
    <!-- /#wrapper -->

<?php
//pemanggilan file setting footer
include "setting_footer.php";

?>

Hasil dari file tersebut akan tampil seperti ini

edit-profil

Ketiga, Buat file baru beri nama hapus_profil.php simpan di folder ADMINWEB

isi dari file hapus_profil.php seperti ini

<?php
session_start();
//panggil koneksi
include "../assets/relasi/koneksi.php";

$id=$_GET['id_profil'];  //dapatkan id

if(isset($id)){ //jika ada id
//hapus data di tabel
$hapus=mysqli_query($conect, "DELETE from tb_profil where id_profil='$id'");
//jika hapus berhasil
if($hapus){
    echo"<script>alert('Data Berhasil di Hapus');document.location='profil.php'</script>";
}
else{ //jika gagal
    echo"<script>alert('Error Bos !!');document.location='profil.php'</script>";
}

}
?>

Oke Selesai

 

 

Develindo Web | Tutorial Pemrograman Website