Sistem templating adalah salah satu fitur atau library yang harus dipikirkan di dalam CodeIgniter, karena CodeIgniter memiliki metode yang sangat sederhana. Tidak memiliki sistem layout, widget dan lain-lain. Untuk membuat sistem templating di CodeIgniter kita dapat membuat sendiri dengan menggunakan fungsi-fungsi yang telah disediakan oleh CodeIgniter atau kita juga dapat menggunakan sistem templating yang sudah ada dan populer. Kegunaan sistem templating adalah :
• Kerja Sama Tim Yang Lebih Baik – Dengan pemisahan menggunakan templating ini, maka rekan bagian pengerjaan desain tidak lagi terganggu oleh kode program yang Anda buat. Begitupun Anda, tidak khawatir lagi script/kode program yang telah dibuat akan terganggu.
• Skrip/code Yang Bersih – Situs dengan aplikasi kompleks, misalnya sebuah portal, pasti memerlukan skrip yang kompleks yang menghabiskan sampai ribuan baris. Tentunya akan sangat mengganggu sekali kalau skrip yang sudah memusingkan itu ditambah lagi dengan tag- tag HTML di dalamnya.
• Perubahan Tampilan Lebih Cepat Dan Mudah – Dengan pemisahan melalui template, hal tersebut dapat dilakukan dengan mudah, bahkan tanpa harus merombak skrip PHP sedikitpun.
Native CodeIgniter Tempating
Dengan menyusun view-view yang ada, kita sebenarnya dapat membuat sebuah tempate library yang cukup powerful. Idenya sederhana saja, cukup membagi sebuah halaman menjadi beberapa area. Sebagai contoh kita akan menggunakan template dari opendesign.org. Dari desain tersebut dapat kita bagi menjadi area header, top menu, right menu dan content. Masing-masing area tersebut akan digabungkan dalam satu halaman utuh yang dinamakan template.
Masing-masing area tersebut akan ditangani oleh sebuah view agar tidak terjadi duplikasi dan akan mempermudah penggunaan kembali area tersebut. Adapun area-area tesebut dapat dilihat pada gambar berikut.
Template yang akan dibuat terbagi menjadi empat bagian yaitu Header (berfungsi sebagai tempat logo dan slogan aplikasi ), Top menu (bagian menu utama disebelah atas), Right Menu (menu navigasi tambahan disebelah kanan) dan sebuah Content. Area content ini lah yang seringkali berubah pada setiap page.
Untuk mengimplementasikan sistem templating tersebut sebaiknya kita buat sebuah library template. Adapun langkah-langkah yang harus dilakukan adalah:
1. Membuat Library Template
Fungsi library tersebut hanya mengatur view mana yang akan dipanggil dan meletakkannya di dalam template. Kenapa membuatnya dalam sebuah library? Karena dengan cara ini memberikan flesibilitas terhadap sistem template. Cara pembuatan library ini diawali dengan membuat sebuah file bernama template.php pada folder application/libraries. Adapun isi file template.php adalah:
1. <?php
2. class Template {
3. protected $_ci;
4. function __construct()
5. {
6. $this->_ci =&get_instance();
7. }
8.
9. function display($template,$data=null)
10. {
11. $data[‘_content’]=$this->_ci->load->view(
12. $template,$data, true);
13. $data[‘_header’]=$this->_ci->load->view(
14. ‘template/header’,$data, true);15. $data[‘_top_menu’]=$this->_ci->load->view(
16. ‘template/menu’,$data, true);
17. $data[‘_right_menu’]=$this->_ci->load->view(
18. ‘template/sidebar’,$data, true);
19. $this->_ci->load->view(‘/template.php’,$data);
20. }
21. }
Perhatikan fungsi display, disana ada dua parameter yaitu template dan data. Parameter data berfungsi sebagai data yang akan dikirimkan ke controller. Sedangkan template adalah view yang akan dipanggil untuk ditampilkan sebagai content utama. Pada template ini akan dibagi menjadi empat area yaitu content, header, top menu, dan right menu. Masing-masing area diisi oleh sebuah view (perhatikan baris 11,13,15,17). Masing-masing view tadi di-load dan disimpan dalam memori. Lalu digabungkan kedalam sebuah template (baris 19). Fungsi yang ada pada library ini sebenarnya dapat kita tambahkan lagi, misalnya untuk keperluan seo, kita ingin memanipulasi title dan meta tag dll. Library diatas merupakan contoh paling sederhana ketika kita ingin membuat sebuah sistem template sendiri.
2. Membuat Template Layout View
Sebuah template layout view adalah sebuah view yang akan menggabungkan masing-masing view menjadi suatu bentuk kesatuan. Adapun isi dari template layout adalah:
Application/view/template.php
1. <!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN”
2. “http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”>
3. <htmlxmlns=”http://www.w3.org/1999/xhtml”xml:lang=”en”lang=”en”>
4. <head>
5. <meta http-equiv=”content-type” content=”text/html; charset=utf-
8″/>
6. <link rel=”stylesheet”type=”text/css”href=”<?php echo
base_url();?>public/style.css”/>
7. <title>Sistem Template CodeIgniter Template</title>
8. </head>
9. <body>
10. <divid=”wrap”>
11. <divid=”header”>
12. <!–
13. Area Header
14. –>
15. <?php echo $_header;?>
16. </div>
17. <div id=”menu”>
18. <!–
19. Area Top Menu
20. –>
21. <?php echo $_top_menu;?>
22. </div>
23. <div id=”contentwrap”>24. <div id=”content”>
25. <!–
26. Area content
27. –>
28. <?php echo $_content;?>
29.
30. </div>
31.
32. <div id=”sidebar”>
33. <!–
34. Area Right Menu
35. –>
36. <?php echo $_right_menu;?>
37. </div>
38. <div style=”clear: both;”></div>
39. </div>
40.
41. <div id=”footer”>
42. <p>Copyright ©<ahref=”#”>Ibnoe</a> | Design by
43. <a href=”http://www.readcrazyreviews.com”>
44. Read Crazy Reviews</a></p>
45. </div>
46.
47. </div>
48.
49. </body>
50. </html>
File diatas merupakan penggabung dari semua bagian yang telah dibahas. Perhatikan baris 15, 21, 28, dan 36. Keempat variabel tersebut akan diisi view dari masing-masing bagian. Berikut ini adalah view-view yang menjadi part/area dari template
a. View header
Application/view/template/header.php
1. <h1><a href=”#”>Red Wall Template</a></h1>
2. <h2>Your web site slogan goes here</h2>
b. View Top menu
Application/view/template/menu.php
1. <ul>
2. <li><a href=”#”>Home</a></li>
3. <li><a href=”#”>Articles</a></li>
4. <li><a href=”#”>About Us</a></li>
5. <li><a href=”#”>Resources</a></li>
6. <li><a href=”#”>Contact Us</a></li>
7. </ul>
c. View sidebar menu
Application/view/template/sidebar.php
1. <h3>Main Content</h3>
2. <ul>
3. <li><a href=”#”>Conflantur</a></li>4. <li><a href=”#”>Externarum vi</a></li>
5. <li><a href=”#”>Essem paulo</a></li>
6. <li><a href=”#”>Aeque fecto ii</a></li>
7. <li><a href=”#”>Quo locis utens</a></li>
8. </ul>
9.
10. <h3>Related Web Sites</h3>
11. <ul>
12. <li><a href=”#”>Plus vi</a></li>
13. <li><a href=”#”>Agi praecise</a></li>
14. <li><a href=”#”>Infinitum veritates</a></li>
15. <li><a href=”#”>Corporea ac perpauca</a></li>
16. <li><a href=”#”>Aeque fecto</a></li>
17. </ul>
Setelah memiliki view ketiga area tersebut (header, top menu dan sidebar) maka kita siap untuk menggunakan sistem template ini. Selanjutnya adalah membuat sebuah controller. Agar lebih mudah pembuatan controller-nya maka gunakan saja controller default dari CodeIgniter, yaitu dengan sedikit melakukan perubahan kode program pada controller-nya.
Application/controllers/welcome.php
1. <?php if (! defined(‘BASEPATH’)) exit(‘No direct script access
allowed’);
2.
3. class Welcome extends CI_Controller {
4.
5. function __construct()
6. {
7. parent::__construct();
8. $this->load->library(‘template’);
9. $this->load->helper(‘url’);
10. }
11.
12. function index()
13. {
14. $this->template->display(‘welcome_message’);
15. }
16.
17. function contoh_parameter()
18. {
19. $this->template->display(‘view_parameter’,
20. array(‘judul’=>’judul View’));
21. }
22.
23. }
24.
25. /* End of file welcome.php */
26. /* Location: ./application/controllers/welcome.php */
Perhatikan pada baris 8, di situ kita me-load library yang telah dibuat tadi. Pada baris 14 dan 19 kita menggunakan fungsi display untuk menampilkan template. Kita harus menyiapkan sebuah view yang bernama welcome_message. View tersebut akan diletakkan pada area content. Isi viewnya sama dengan view pada umumnya.
Sumber : www.koder.web.id
itu yang line 19 yang di control itu view_parameter apa yah masih kurang paham mungkin bisa di contohkan penggunaan,a hehhe ..
hahha udah paham mas thanks ni jd membantu 😀 (y) ..
ya gan, sama – sama
Hem di coba dulu deh, gan coba bagaimana biar jalan setiap href atau hyperlink nya ketika di klik di load sendiri file nya, ah ribet amat ya bahasa gw,
gini-gini banyak banget cara buat template menggunakan codeigniter ada nyang pake library ada juga yang lain, pemula awal gw pake library tapi punya kesulitan yaitu setiap file gw musti load semua vied nya, adakah teknik yang lebih mudah gan ?
Maaf ribet bahasa gw 😀
http://www.sidaurukfreddy.hol.es
Wait ini pakai library ya, ane coba dulu lah dari komen duluan malah gak ngerti ntar :v
Payah nih tutorial nya gak lengkap udah di ulang-ulang 😦
function contoh_parameter() ini manggil fungsi/file yang mana ya??