Konfigurasi Template codeigniter Admin Part 2

195 views
Konfigurasi Template codeigniter

Konfigurasi Template codeigniter Admin Part 2, Oke sekarang kita masuk ke part 2 untuk merancang template ya. setelah sebelumnya kita sudah membuat konfigurasi sekarang buka kembali projek. Buat temen temen yang baru baca artikel ini silahkan kalian kembali ke part sebelumnya Konfigurasi Template di codeigniter Part 1 agar kita paham apa yang sedang kamu pelajari di artikel ini,  disini saya menggunakan visual studio code sama seperti tutorial sebelumnya.

Kita buka folder views di folder Application applicationviews buat 2 buah folder lalu beri nama backend dan frontend. Lalu di dalam folder backend buat folder layout lalu silahkan buat file php seperti di bawah ini

Read More

head.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, shrink-to-fit=no">
    <meta name="description" content="">
    <meta name="author" content="">
    <title>Administrator</title>
    <link href="<?php echo base_url('assets/template/backend/vendor/fontawesome-free/css/all.min.css'); ?>" rel="stylesheet" type="text/css">
    <link href="https://fonts.googleapis.com/css?family=Nunito:200,200i,300,300i,400,400i,600,600i,700,700i,800,800i,900,900i" rel="stylesheet">
    <link href="<?php echo base_url('assets/template/backend/css/sb-admin-2.min.css'); ?>" rel="stylesheet">
    <link href="<?php echo base_url('assets/template/backend/vendor/datatables/dataTables.bootstrap4.min.css'); ?>" rel="stylesheet">

</head>

<body id="page-top">
    <div id="wrapper">

header.php 

<div id="content-wrapper" class="d-flex flex-column">
<div id="content">
<nav class="navbar navbar-expand navbar-light bg-white topbar mb-4 static-top shadow">
<button id="sidebarToggleTop" class="btn btn-link d-md-none rounded-circle mr-3">
<i class="fa fa-bars"></i>
</button>
<ul class="navbar-nav ml-auto">
<div class="topbar-divider d-none d-sm-block"></div>
<li class="nav-item dropdown no-arrow">
<a class="nav-link dropdown-toggle" href="#" id="userDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<span class="mr-2 d-none d-lg-inline text-gray-600 small">Admin Name</span>
<img class="img-profile rounded-circle" src="https://source.unsplash.com/QAB-WJcbgJk/60x60">
</a>
<div class="dropdown-menu dropdown-menu-right shadow animated--grow-in" aria-labelledby="userDropdown">
<a class="dropdown-item" href="#">
<i class="fas fa-user fa-sm fa-fw mr-2 text-gray-400"></i>
Profile
</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="#" data-toggle="modal" data-target="#logoutModal">
<i class="fas fa-sign-out-alt fa-sm fa-fw mr-2 text-gray-400"></i>
Logout
</a>
</div>
</li>
</ul>
</nav>
<div class="container-fluid">

sidebar.php 

<ul class="navbar-nav bg-gradient-primary sidebar sidebar-dark accordion" id="accordionSidebar">
<a class="sidebar-brand d-flex align-items-center justify-content-center" href="index.html">
<div class="sidebar-brand-icon rotate-n-15">
<i class="fab fa-app-store"></i>
</div>
<div class="sidebar-brand-text mx-3">Admin </div>
</a>
<hr class="sidebar-divider my-0">
<li class="nav-item">
<a class="nav-link" href="<?php echo base_url('admin/dashboard'); ?>">
<i class="fas fa-fw fa-tachometer-alt"></i>
<span>Dashboard</span></a>
</li>
<hr class="sidebar-divider">
<div class="sidebar-heading">
Main Menu
</div>
<li class="nav-item">
<a class="nav-link" href="<?php echo base_url('admin/article'); ?>">
<i class="fas fa-fw fa-rss"></i>
<span>Article</span></a>
</li>
<hr class="sidebar-divider">
<li class="nav-item">
<a class="nav-link" href="<?php echo base_url('admin/category'); ?>">
<i class="fas fa-fw fa-tag"></i>
<span>Category</span></a>
</li>
<hr class="sidebar-divider">
<li class="nav-item">
<a class="nav-link" href="<?php echo base_url('admin/user'); ?>">
<i class="fas fa-fw fa-user"></i>
<span>User</span></a>
</li>
<hr class="sidebar-divider">
<div class="sidebar-heading">
Seting Web
</div>
<li class="nav-item">
<a class="nav-link collapsed" href="#" data-toggle="collapse" data-target="#collapseTree" aria-expanded="true" aria-controls="collapseTwo">
<i class="fas fa-fw fa-cog"></i>
<span>Konfigurasi</span>
</a>
<div id="collapseTree" class="collapse" aria-labelledby="headingTwo" data-parent="#accordionSidebar">
<div class="bg-white py-2 collapse-inner rounded">
<h6 class="collapse-header">Setings:</h6>
<a class="collapse-item" href="<?php echo base_url('admin/meta'); ?>">Meta</a>
<a class="collapse-item" href="<?php echo base_url('admin/meta/logo'); ?>">Logo</a>
<a class="collapse-item" href="<?php echo base_url('admin/meta/favicon'); ?>">Favicon</a>
</div>
</div>
</li>
<hr class="sidebar-divider">
<div class="text-center d-none d-md-inline">
<button class="rounded-circle border-0" id="sidebarToggle"></button>
</div>
</ul>

footer.php 

</div>
</div>
<footer class="sticky-footer bg-white">
<div class="container my-auto">
<div class="copyright text-center my-auto">
<span>Copyright &copy; Your Website 2019</span>
</div>
</div>
</footer>
</div>
</div>
<script src="<?php echo base_url('assets/template/backend/vendor/jquery/jquery.min.js'); ?>"></script>
<script src="<?php echo base_url('assets/template/backend/vendor/bootstrap/js/bootstrap.bundle.min.js'); ?>"></script>
<script src="<?php echo base_url('assets/template/backend/vendor/jquery-easing/jquery.easing.min.js'); ?>"></script>
<script src="<?php echo base_url('assets/template/backend/js/sb-admin-2.min.js'); ?>"></script>
<script src="<?php echo base_url('assets/template/backend/vendor/datatables/jquery.dataTables.min.js'); ?>"></script>
<script src="<?php echo base_url('assets/template/backend/vendor/datatables/dataTables.bootstrap4.min.js'); ?>"></script>
<script src="<?php echo base_url('assets/template/backend/js/demo/datatables-demo.js'); ?>"></script>
</body>

</html>

content.php 

<?php
if ($content) {
$this->load->view($content);
}

wrapp.php 

<?php
require_once('head.php');
require_once('sidebar.php');
require_once('header.php');
require_once('content.php');
require_once('footer.php');

Struktur folder view sekarang menjadi seperti gambar di bawah ini

Konfigurasi Template codeigniter

Oke sampai disini tutorial tentang cara konfigurasi template untuk halaman admin, mudah mudahan bermanfaat tunggu kelanjutan dari tutorialnya tetep selalu kunjungi blog edikomputer. Selanjutnya kita akan belajar merancang halaman dashboard

Buat kamu yang ingin belajar desain grafis secara interaktif, kamu bisa mengunjungi channel youtube edikomputer untuk mendapatkan tutorial gratis tentang desain grafis. di channel ini kamu bisa belajar program desain seperti : Coreldraw, photoshop dan Illustrator. silahkan kunjungi channel edikoputer dan jangan lupa subscribe untuk mendapatkan tutorial terbaru tentang desain grafis. Channel desain grafis

Related posts

Leave a Reply

Your email address will not be published. Required fields are marked *