Image Load

Hello world,

Melanjutkan dari part pertama yaitu tentang membuat halaman website statis dengan controller dan views pada Codeigniter, kali ini kita akan membuat halaman-halaman dan mengarut menu-menu dalam website. Pada part pertama kita sudah membuat sebuah halaman lihat di sini. Selanjutnya kita akan membuat halaman lain sekaligus membuat menu-menu untuk bernavigasi ke halaman-halaman yang ada. Langkah pertama kita akan mengubah url pada menu yang ada. lihat contoh berikut edit pada file application/views/header.php.

<nav class="navbar navbar-expand-lg navbar-light fixed-top" id="mainNav">
<div class="container">
<a class="navbar-brand" href="<?=base_url()?>">Start Bootstrap</a>
<button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation">
Menu
<i class="fas fa-bars"></i>
</button>
<div class="collapse navbar-collapse" id="navbarResponsive">
<ul class="navbar-nav ml-auto">
<li class="nav-item">
<a class="nav-link" href="<?=base_url()?>">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="<?=base_url()?>about">About</a>
</li>
<li class="nav-item">
<a class="nav-link" href="<?=base_url()?>post">Sample Post</a>
</li>
<li class="nav-item">
<a class="nav-link" href="<?=base_url()?>contact">Contact</a>
</li>
</ul>
</div>
</div>
</nav>

Pada contoh di atas kita mengubah isi dari url menjadi base_url() dan nama controller halaman lain dimana base_url() bernilai sesuai dengan halaman utama website kita pada localhost berarti localhost/codeigniter-module. Kemudian kita tinggal membuat halaman sesuai dengan menu yang ada, sebagai contoh kali ini kita bisa membuat halaman about. Kita mulai dengan membuat file controller dengan nama About.php dan letakkan pada folder application/controllers/.

About.php

<?php
defined('BASEPATH') OR exit('No direct script access allowed');

class About extends CI_Controller {
public function __construct()
{
parent::__construct();
$this->load->helper('url');
}
public function index()
{
$this->load->view('header');
$this->load->view('about');
$this->load->view('footer');
}
}


Kemudian kita buat juga halaman htmlnya dari template yang kita pakai sebelumnya seperti berikut. cek templatenya di sini. Simpan dengan nama about.php dan letakkan pada folder application/views/.

<!-- Main Content -->
<div class="container">
<div class="row">
<div class="col-lg-8 col-md-10 mx-auto">
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Saepe nostrum ullam eveniet pariatur voluptates odit, fuga atque ea nobis sit soluta odio, adipisci quas excepturi maxime quae totam ducimus consectetur?</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Eius praesentium recusandae illo eaque architecto error, repellendus iusto reprehenderit, doloribus, minus sunt. Numquam at quae voluptatum in officia voluptas voluptatibus, minus!</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aut consequuntur magnam, excepturi aliquid ex itaque esse est vero natus quae optio aperiam soluta voluptatibus corporis atque iste neque sit tempora!</p>
</div>
</div>
</div>

<hr>

Sampai di sini silakan coba dijalankan dan klik menu about. Jika ingin membuat halaman-halaman lain kalian tinggal ikuti saja sesuai dengan tahap di atas.


Selamat mencoba :)