Tutorial Codeigniter Part 4 : Membuat Template Admin Dinamis

Kembali lagi di codebanten pada tutorial sebelumnya kita bermain dengan controller di codeigniter selanjutnya kita akan mencoba membuat template admin website sederhana menggunakan codeigniter. Didalam tutorial kali ini akan dijelaskan bagaimana menggunakan teknik menggunakan view dan dikombinasikan dengan controller, sebagai gambaran kita akan membuat secara terpisah menjadi 4 file seperti header, navbar, sidebar dan footer dan membuat file konten sendiri yang nanti konten inilah menjadi dinamis sehingga memudahkan dalam memodifikasi template admin tanpa harus menulis ulang syntax yang sama. Disini saya menggunakan SB Admin kalian bisa mendownloadnya disini

Setelah mendownload template SB admin lalu extract kedalam folder project kita lalu rename menjadi assets

 

Cara Membuat Template Admin Dinamis

Hal yang pertama dilakukan adalah membuat controller yang akan menampilkan view. disini saya membuat controller dengan nama Halaman.php dan sebuah view dengan nama v_halaman.php harus diingat untuk controller pada huruf awal harus kapital dan juga buat folder baru pada view, misalnya kita beri nama templates lalu didalamnya kita buat file baru header.php, navbar.php, sidebar.php, footer.php selanjutnya kita konfigurasikan helper url terlebih dahulu untuk memanggil file css dan javascript :

buka file autoload.php pada folder : application/config/autoload.php

sebenarnya kita bisa menambahkan helper pada controller, karena kita akan menggunakannya secara berulang maka lebih tepat kita simpan di autoload.php maka kita tidak perlu lagi memanggil helper di controller.

Selanjutnya konfigurasikan base_url() buka folder : application/config/config.php

atur base_url menjadi nama folder project yang kita buat sebelumnya disini dicontohkan dengan http://localhost/codebanten/

selanjutnya kita coba hubungkan file css dan js dengan bantuan base_url

hasil dari syntax

• <?= base_url('assets/vendor/fontawesome-free/css/all.min.css');?>
• <?= base_url('assets/vendor/jquery/jquery.min.js');?> 

sama dengan 

• http://localhost/codebanten/assets/vendor/fontawesome-free/css/all.min.css
• http://localhost/codebanten/assets/vendor/jquery/jquery.min.js

dimana sesuai dengan letak file css pada folder project kita saat pengaturan pada file config.php

setelah selesai mensetup url untuk css dan js serta base_url kita akan membuat folder baru di dalam folder view untuk menyimpan file template yang akan kita buat menjadi 4 bagian, beri nama folder template

sesudah membuat folder baru kita buat file partialsnya

application/view/template/header.php

application/view/template/navbar.php


application/view/template/sidebar.php

application/view/template/footer.php


lalu kita buat view halamannya application/view/v_halaman.php


semua file view sudah kita buat, selanjutnya kita atur pada bagian controllernya application/controller/Halaman.php sebagai berikut :


panggil viewnya harus secara berurutan mulai dari header, navbar, sidebar, dan footer dengan begitu kita hanya tinggal mengubah di bagian v_halaman untuk membuat halaman lain.

Hasilnya akan seperti ini

Oke cukup sekian tutorial dari saya terima kasih sampai berjumpa kembali

Referensi :

https://www.malasngoding.com/membuat-template-web-dengan-codeigniter/

Channel Web Programming UNPAS