i (am) Blogger and U?

from X-periment to X-perience

Profile / Portofolio Pro..

Aplikasi Profil / Portofolio Pro 2, software berbasis web untuk pengelolaan portofolio atau unt [...]

One-Page Portofolio / Ga..

One-Page Portofolio / Gallery 2 memiliki fitur-fitur yang sama persis dengan One-Page Portofoli [...]

One-Page Portofolio / Ga..

One-Page Portofolio / Gallery 3 memiliki fitur-fitur yang sama persis dengan One-Page Portofoli [...]

Badge/Watermark Image Ge..

Badge/Watermark Image Generator adalah aplikasi web yang digunakan untuk membuat badge/watermar [...]

Template Toko Online: Sh..

SHOPPER adalah HTML template (menggunakan Bootstrap 3.3.6) yang ditujukan untuk toko online. Te [...]

Web Profil / Portofolio ..

Web Profil/Portofolio Basic 1, aplikasi/software untuk mengelola portofolio (atau bisa juga dij [...]

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. <<