Tutorial Template Dinamis dan Integrasi AdminLTE dengan CodeIgniter

Pada kesempatan kali ini saya akan berbagi tutorial cara membuat template yang dinamis dimana template yang digunakan adalah adminlte versi 2.4.3 kemudian diintegrasikan dengan framework codeigniter.

Pada artikel sebelumnya saya sudah buatkan cara Cara Integrasi Template AdminLTE 3 Dengan CodeIgniter dimana itu hanyalah integrasi saja, tanpa adanya layout atau kerangka agar code menjadi lebih rapi dan sedikit. Template dinamis adalah kita membuat suatu kerangka untuk template yang digunakan, ketika memanggil suatu halaman maka tidak perlu kita memanggil header, footer dan lainnya terus menerus dalam halaman tersebut.

Tutorial Template Dinamis dan Integrasi AdminLTE dengan CodeIgniter

1. Download codeigniter versi 3.1.11 [ download ]

2. Ekstrak hasil download ke folder khusus coding

3. Ganti nama folder menjadi ci-adminlte kemudian buka di text editor

4. Buka application/config/autoload.php dan sesuaikan seperti berikut :

Code awal :

$autoload['libraries'] = array();
$autoload['helper'] = array();

Ganti menjadi seperti code berikut :

$autoload['libraries'] = array('session','form_validation','template');
$autoload['helper'] = array('url','form','file');

Keterangan :

Pada libraries terdapat “template” dinama ini adalah pemanggilan class Template yang ada di application/libraries/Template.php, selain dari template itu adalah bawaan dari codeigniternya.

5. Ganti base_url menjadi dinamis Cara Membuat Base URL Dinamis

6. Buat file application/libraries/Template.php dan masukkan code berikut :

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

class Template
{
    var $template_data = array();
    function set($name, $value){
        $this->template_data[$name] = $value;
    }

    function load($template = '', $view = '' , $view_data = array(), $return = FALSE){
        $this->CI =& get_instance();
        $this->set('contents', $this->CI->load->view($view, $view_data, TRUE));
        return $this->CI->load->view($template, $this->template_data, $return);
    }
}

7. Buka application/controllers/Welcome.php dan ganti function index menjadi seperti berikut :

public function index()
{
  $this->template->load('layouts/template', 'welcome_message');
}

Keterangan :

$this->template->load(); adalah code yang kita buat core nya pada langkah 7 dan layouts/template adalah pemanggilan kerangka template yang akan digunakan, sedangkan welcome_message adalah isi atau contentnya.

8. Buka application/views/welcome_message.php dan ganti code nya dengan code berikut :

9. Buat file di application/views/layouts sesuai dengan nama yang ada di bawah kotak code :

10. Buat folder assets, folder ini berfungsi untuk menyimpan semua asset seperti images, js, css dan template adminlte. Data dari assets bisa didownload pada link di bawah kemudian ekstrak di ci-adminlte.

11. Coba buka di browser http://ci-adminlte.test/ dan hasilnya akan seperti gambar berikut :

Jika tampilannya seperti gambar di atas maka tutorial template dinamis dan integrasi adminlte dengan codeigniter sudah berhasil dilakukan. Bagi yang ingin mendownload full source code nya bisa download di github susantokun.

Itulah tutorial template dinamis dan integrasi adminlte dengan codeigniter yang dapat saya sampaikan, semoga bermanfaat.

Baca Juga : Tutorial CRUD CodeIgniter