Skip navigation

Tag Archives: template

Template adalah suatu metode yang memudahkan kita dalam proses pembangunan sebuah web. Dengan menggunakan template kita tidak perlu mengulang-ulang html-coding untuk menghasilkan tampilan yang baseform-nya sama. Pada Codeigniter, metode templating akan semakin memudahkan kita dalam membangun web tanpa mengabaikan MVC framework.

Berikut ini adalah langkah-langkah menggunakan metode templating simpel pada codeigniter.

1. Membuat Library

langkah pertama adalah dengan membuat class Template.php yang disimpan di application/libraries

class Template {
var $template_data = array();

function Template() {
  $this->template_data['jsscript'] = '';
  $this->template_data['cssstyle'] = '';
}

function set($name, $value) {
  $this->template_data[$name] = $value;
}

function set_js($value) {
  $this->template_data['jsscript'] .= "<script type='text/javascript'>".$value."</script>\n";
}

function load_js($value) {
  $this->template_data['jsscript'] .= "<script type='text/javascript' src='".base_url().$value."'></script>\n";
}

function load_css($value) {
  $this->template_data['cssstyle'] .= "<link rel='stylesheet' href='".base_url().$value."' type='text/css' media='screen'>";
}

function display($template = '', $view = '' , $view_data = array(), $return = FALSE) {
  $this->CI =& get_instance();
  $this->set('contents', $this->CI->load->view($view, $view_data, TRUE));
  return $this->CI->load->view($template, $this->template_data, $return);
}
}

2. Autoload library template tadi pada application/config/autoload.php

$autoload['libraries'] = array('template', 'database', 'session');

3. Membuat Template View

Langkah berikutnya adalah membuat view sederhana, yang akan berperan sebagai template file. Berikut contoh view template sangat sederhana yang diberi nama theme.php dan disimpan di application/view

<html>
<head>
<title><?= $headtitle ?></title>
<?= $cssstyle ?>
<?= $jsscript ?>
</head>

<body>
<div id="wrapper">
<h2 id="contenttitle"><?= $contenttitle ?></h2>
<divĀ  id="maincontent"><?= $contents ?></div>
</div>
</body>
</html>

Pada bagian head template view di atas, dibagi menjadi 3 bagian, pertama adalah headtitle yang berfungsi sebagai tempat title halaman web nantinya, kedua adalah cssstyle yang berfungsi sebagai tempat css file ataupun css file-link. Dan yang ketiga adalah jsscript sebagai tempat js file ataupun js file-link.

Sedangkan pada bagian body dibagi menjadi dua bagian yaitu contenttitle sebagai tempat Judul halaman, dan contents sebagai tempat konten utama.

3.Membuat View

Jika di atas sudah dibuat view untuk template, maka sekarang dibuat view untuk halaman yang lebih spesifik. Misalkan lyricview.php :

<div id="postinfo">Posted on <?= $postinfo ?></div>
<div id="lyrics"><?= $lyrics ?></div>
<div id="taginfo">This post is under <?= $taginfo ?></div>

4. Penggunaan dan Eksekusi lewat Controler

Misal, dibuat Class Lyric:

class Lyric extends Controller {

function Lyric() {
parent::Controller();
}

function index() {

$headtitle = 'Audioslave - Be Yourself Lyric on Mywebdotcom';
$contenttitle = 'Audioslave - Be Yourself Lyric';
$contents['postinfo'] = '25 Juni 2009';
$contents['lyrics'] = '
be yourself its all that you can do
be yourself its all that you can do
be yourself its all that you can do';
$contents['taginfo'] = 'audioslave';

$this->template->load_css('public/css/tabber.css');
$this->template->load_js('public/js/tabber.js');
$this->template->set('headtitle', $headtitle);
$this->template->set('contenttitle', $contenttitle);
$this->template->display('theme', 'lyricview', $contents);
}
}

5. Panggil melalui url http://namadomain/lyric/

Semoga bisa membantu..

Advertisements