Templating: Memasang Template Bootstrap Di Codeigniter

Bootstrap merupakan salah satu framework HTML dan CSS yang pada filenya telah terdapat jQuery yaitu framework JavaScript. Banyak web designer yang menggunakan bootstrap sebagai framework yang mereka gunakan karena tampilannya yang elegan. Jika membuka wapplyzer, tercatat 1.126.686 website yang menggunakan bootstrap pada 26 April 2016 sebagai frameworknya. Dengan hal tersebut juga, terdapat banyak template – template website yang dibuat oleh web designer baik yang gratis ataupun berbayar. Berdasarkan hal tersebutlah, banyak mahasiswa tingkat akhir yang menggunakan CI dan bootstrap ataupun orang yang belajar tentang CI yang menggunakan bootstrap untuk tampilannya.

Setelah menginstall CodeIgniter silakan unduh template bootstrap disini kita menggunakan Bootstrap Zero. langsung saja berikut langah- langkahnya :

Kemudian cari file template yang telah diunduh dan ekstrak. Dalam folder hasil ekstrak tersebut terdapat folder CSS dan JavaScript serta file – file pendukung lainnya seperti gambar.

Buka file welcome_message.php yang terletak pada Codeigniter/application/views. File welcome_message.php merupakan tampilan awal setelah menginstall CodeIgniter. Kemudian hapus tag yang ada kecuali skrip PHP yang berada paling atas file <?php defined(‘BASEPATH’) OR exit(‘No direct script access allowed’); ?> Buka salah satu tampilan dari template yang kita unduh dalam kasus ini penulis memilih login.html yang akan menjadi tampilan awal saat dijalankan.

Salin tag pada file tersebut dan pindahkan ke welcome_message.php. Sesuaikan beberapa hal seperti titlenya.

Kemudian cari tag yang berisi tag untuk meload css dan JavaScript <link href=”css/bootstrap.min.css” rel=”stylesheet”> dan ubah menjadi <link href=”<?php echo base_url(‘assets/css/bootstrap.min.css’)?>” rel=”stylesheet”> Base_url merupakan salah satu fungsi dari helper URL dan url tersebut ditambahkan assets karena folder dan file pendukung diletakkan pada folder assets.

Selain file CSS, base_url juga dapat digunakan untuk memanggil file JavaScript dan file gambar, video dan suara yang merupakan pendukung dalam membuat tampilan. Cara di atas dapat digunakan untuk semua framework seperti Zurb Foundation, Skeleton, Gumby dan file CSS dan JavaScript buatan kita sendiri.