Sekarang saya akan membuat tutorial bagaimana Cara membuattemplate site pada codeigniter. Maksud template disini bukan membuat template css utuh pada umumnya namun template disni membagi sebuah bagian design template yang sudah ada menjadi 4 bagian atau lebih sesuai kebutuhan sehingga mempermudah dan efisien dalam meletakan suatu script untuk diletakan pada head, body, konten dan footer, Sebgai contoh gambaran.
Mungkin gambaran nya seperti itu kurang lebih soalnya susah untuk diungkapkan namun seperti itu gambaran simplenya, dari pada bingung lihat langsung caranya. Untuk persiapan maka anda harus membuat sebuah project dengan codeigniter selanjutnya ikuti langkah dibawah ini.
1. Buatlah sebuah folder layout pada Views.
2. Buatlah sebuah file dengan nama header.php dan simpan pada folder layout, dan masukan script header anda, seperti contoh dibawah.
<!DOCTYPE html>
<html lang="en">
<head>
<title>Template Codeigniter</title>
<link rel="stylesheet" href="<?php echo base_url(); ?>assets/css/bootstrap.min.css" type="text/css">
<script type="text/javascript" src="<?php echo base_url(); ?>assets/js/bootstrap.js"></script>
<script type="text/javascript" src="<?php echo base_url(); ?>assets/js/jquery-1.11.3.min.js"></script>
</head>
<body>
3. Selanjutnya buatlah sebuah file navbar.php (Optional) dan simpan pada folder layout, dan masukan script navbar anda, seperti contoh dibawah.
<nav class="navbar navbar-default ">
<div class="container-fluid">
<!-- Brand and toggle get grouped for better mobile display -->
<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="#">Brand</a>
</div>
<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav">
<li><a href="#">Home <span class="sr-only">(current)</span></a></li>
<li><a href="#">About</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>
<form class="navbar-form navbar-right">
<div class="form-group">
<input type="text" class="form-control" placeholder="Search">
</div>
</form>
</div><!-- /.navbar-collapse -->
</div><!-- /.container-fluid -->
</nav>
4. Buatlah sebuah file content.php dan simpan pada
folder layout, script ini berfungsi untuk memanggil file conten yang anda buat.
<?php
if (!defined('BASEPATH')) exit ('No direct script access allowed');
if($content) {
$this->load->view($content);
}
<div class="row">
<div class="navbar navbar-default navbar-fixed-bottom">
<div class="col-sm-6 col-sm-offset-4">
<p class="navbar-text">© 2017 - cahbagusnongkrong.blogspot.com
</div>
</div>
</div>
</body>
</html>
6. Dan yang terakhir buatlah file template.php dan simpan pada folder layout, file ini berfungsi untuk memanggil semua folder file layout beserta konten.
<?php
require_once('header.php');
require_once('navbar.php');
require_once('content.php');
require_once('footer.php');
?>
7. Tahap membuat template sudah selesai saat nya kita membuat isi konten kita, sebagai contoh ketikan script dibawah ini dan simpan dengan nama konten_saya.php pada folder Views atau yang lainnya sesuai selera anda.
<div class="container">
<div class="row">
<div class="jumbotron">
<div class="text-center">
<p><h2>Disini buat konten</h2></p><br>
</div>
</div>
</div>
</div>
8. Sekarang kita buat sebuah controllers untuk memanggil views dan tempalte yang sudah dibuat.
<?php
defined('BASEPATH') OR exit('No direct script access allowed');
class Welcome extends CI_Controller {
public function index()
{
$data = array(
'content' =>'isi_konten'
);
$this->load->view('layout/template', $data);
}
}
9. Jika sudah jalan kan browser kita dan hasil tetap sama seperti tampilan biasanya namun keuntungannya kita tidak membuat script yang sama pada setiap Views dan kita bisa membuat konten dengan file khusus jadi bisa lebih mudah untuk mengatur konten kita.
Semoga bermanfaat
0 komentar: