i (am) Blogger and U?

from X-periment to X-perience

Aplikasi Web: Custom For..

Aplikasi Web Custom Form, software berbasis web dengan fitur utama adalah pembuatan DYNAMIC FOR [...]

Anime/Movie Community Sh..

Produk ini adalah aplikasi web full-custom yang diperuntukkan bagi Anda yang ingin membuat situ [...]

One-Page Portofolio / Ga..

One-Page Portofolio/Gallery adalah paket aplikasi web yang memfasilitasi Anda baik perseorangan [...]

Toko Online Barang Digit..

Toko Online Barang Digital 1 adalah paket full-features aplikasi toko online khusus untuk benda [...]

Aplikasi Web: URL Shorte..

URL Shortener Complete 2 adalah aplikasi yang membantu Anda untuk menjalankan situs/web yang me [...]

Aplikasi Web: Forum Miri..

Aplikasi ini merupakan aplikasi layaknya forum pada umumnya. Hal spesial dari aplikasi ini adal [...]

2011
24Apr

Rilis Library CodeIgniter Gudlux_manager

Post category: Web Development

Berawal dari "kegiatan yang berulang kali dilakukan" yakni menempatkan CSS dan Javascript di header (dan gambar di beberapa lokasi) maka terpikir untuk membuat "library sederhana" untuk sedikit mempersingkat hal yang berulang-ulang tadi. Sempat mencari ke situs sana situs sini dan menemukan beberapa library yang melakukan hal serupa (yang menurut saya agak ribet) maka saya membuat yang simpel dan awalnya memang ditujukan untuk penggunaan pribadi. Akan tetapi, sekarang saya ingin sedikit berbagi mengenai library sederhana yang saya beri nama Gudlux_manager. Bagi yang berminat silahkan untuk men-download Gudlux_manager.

Sebelum menggunakan library ini, perlu diperhatikan hierarki folder yang digunakan untuk menyimpan file-file CSS, Javascript, dan image (gambar). Silahkan buat folder bernama "komponen" (atau terserah anda tapi pastikan untuk mengubah namanya di library) dengan hierarki seperti di bawah ini (folder css dan js berada di bawah folder komponen):


Library ini memang sengaja tidak saya sertakan file config karena yang variabel konfigurasi hanya ada satu (itu pun kalau memang mau diganti) yakni $gudlux_folder. Jadi, kalau mau mengganti nama folder utama (default adalah komponen) silahkan ganti isi variabel $gudlux_folder dengan nama yang lain.

Penggunaan library ini ditampilkan dalam gambar di bawah ini:

Menampilkan satu file css ke dalam view
$this->load->library("gudlux_manager");
$this->gudlux_manager->css("NAMA_CSS_1.css");
$data['css'] = $this->gudlux_manager->tampilkan();
$this->load->view('nama_view',$data);

Lihat Gambar Contoh Menampilkan satu file css ke dalam view

Menampilkan lebih dari satu file css ke dalam view
$this->load->library("gudlux_manager");
$this->gudlux_manager->css("NAMA_CSS_1.css");
$this->gudlux_manager->css("NAMA_CSS_2.css");
$this->gudlux_manager->css("NAMA_CSS_3.css");
$data['css'] = $this->gudlux_manager->tampilkan();
$this->load->view('nama_view',$data);

Lihat Gambar Contoh Menampilkan lebih dari satu file css ke dalam view

Menampilkan satu file javascript ke dalam view
$this->load->library("gudlux_manager");
$this->gudlux_manager->js("NAMA_Javascript_1.js");
$data['js_file'] = $this->gudlux_manager->tampilkan();
$this->load->view('nama_view',$data);

Lihat Gambar Contoh Menampilkan satu file javascript ke dalam view

Menampilkan lebih dari satu file javascript ke dalam view
$this->load->library("gudlux_manager");
$this->gudlux_manager->js("NAMA_Javascript_1.js");
$this->gudlux_manager->js("NAMA_Javascript_2.js");
$this->gudlux_manager->js("NAMA_Javascript_3.js");
$data['js_file'] = $this->gudlux_manager->tampilkan();
$this->load->view('nama_view',$data);

Lihat Gambar Contoh Menampilkan lebih dari satu file javascript ke dalam view

Menampilkan satu file css dan satu file javascript ke dalam view
$this->load->library("gudlux_manager");
$this->gudlux_manager->js("NAMA_Javascript_1.js");
$this->gudlux_manager->css("NAMA_CSS_1.css");
$data['js_css'] = $this->gudlux_manager->tampilkan();
$this->load->view('nama_view',$data);

Lihat Gambar Contoh Menampilkan satu file css dan satu file javascript ke dalam view

Menampilkan banyak file css dan javascript ke dalam view
$this->load->library("gudlux_manager");
$this->gudlux_manager->js("NAMA_Javascript_1.js");
$this->gudlux_manager->js("NAMA_Javascript_2.js");
$this->gudlux_manager->js("NAMA_Javascript_3.js");
$this->gudlux_manager->css("NAMA_CSS_1.css");
$this->gudlux_manager->css("NAMA_CSS_2.css");
$this->gudlux_manager->css("NAMA_CSS_3.css");
$data['js_css'] = $this->gudlux_manager->tampilkan();
$this->load->view('nama_view',$data);

Lihat Gambar Contoh Menampilkan banyak file css dan javascript ke dalam view

Menampilkan satu file gambar ke dalam view
$this->load->library("gudlux_manager");
$this->gudlux_manager->image("NAMA_file_image_1.png");
$data['gbr'] = $this->gudlux_manager->show_img();
$this->load->view('nama_view',$data);

Lihat Gambar Contoh Menampilkan banyak file image ke dalam view

Menampilkan banyak file gambar ke dalam view (gambar berurutan)
$this->load->library("gudlux_manager");
$this->gudlux_manager->image("NAMA_file_image_1.png");
$this->gudlux_manager->image("NAMA_file_image_2.png");
$this->gudlux_manager->image("NAMA_file_image_1.jpg");
$this->gudlux_manager->image("NAMA_file_image_2.jpg");
$data['gbr'] = $this->gudlux_manager->show_img();
$this->load->view('nama_view',$data);

Lihat Gambar Contoh Menampilkan banyak file image ke dalam view

Khusus untuk gambar ada kalanya yang ditampilkan tidak berurutan dan terpisah-pisah, misalnya dalam paragraf pertama ada Image1.png kemudian di paragraf ketiga ada gambar Image3.jpg maka untuk melakukan hal ini digunakan:
$this->load->library("gudlux_manager");
$data['gbr1'] = $this->gudlux_manager->img_khusus("NAMA_file_image_1.png");
$data['gbr3'] = $this->gudlux_manager->img_khusus("NAMA_file_image_3.png");
$this->load->view('nama_view',$data);

Lihat Gambar Contoh Menampilkan banyak file image tidak berurutan ke dalam view

Library ini akan menampilkan CSS, Javascript dan image ke dalam format seperti di bawah ini:
untuk file javascript


untuk file CSS


untuk file image(gambar)


Sebagai catatan, pastikan anda sudah mengaktifkan autoload url --> $autoload['helper'] = array('url');

Mungkin library ini masih sangat sederhana dan tentunya masih bisa dikembangkan lagi dengan berbagai hal.


mackmoo | 14 May 2011
Komentar: makasi bro, dg menggunakan komponen ini makin mempermudah belajar ane.. :)
sekalian CRUD klo ada.. hehe
>> Comments closed. <<