Template Library for Ext.CodeIgniter

For someone who spent 3 years maintaining my own PHP Framework I find it hard to understand why CodeIgniter bundle in a Template Library. There are actually a few good 3rd party Template Engine which you can find for CodeIgniter but let me share with you a port over Template Library for my so call own PHP Framework.

Requirements and Basic Informations

is based and developed on CodeIgniter 1.7.1, it might work with previous version but please do test it out first.
the library is build on top of Loader and Output Library allowing you to fully utilize caching, profiler output etc.
support Parser Library.

Getting Started

To use the Template library, you have to checkout a copy of latest Ext.CodeIgniter or grab the following files:

Setup Template Folder

You will need to create a folder ./public/styles/default/ at the root folder of your CodeIgniter installation. A terminal command equivalent to this is:

> mkdir -p public/styles/default

Setup Template File

For this example let just make a simple template, by default the Template Class will look for “index.html”.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
        <title>{{PAGE-TITLE}}</title>
        <link href="{{STYLE-URI}}css/all.css" media="all" rel="stylesheet" type="text/css" />
    </head>
    <body>
        <div id="header">
            <h1>{{TITLE}}</h1>
            <div id="navigation">{{NAVIGATION}}</div>
        </div>
        <div id="content">
            {{CONTENT}}
        </div>
        <div id="footer">
            <p>{{FOOTER}}</p>
        </div>
    </body>
</html>

Possible Parse Keyword

Keyword	Description
{{TITLE}}	Application/Site Title.
{{PAGE-NAME}}	Current Page Title
{{PAGE-TITLE}}	Current Page Title and Application/Site Title.
{{URI}}	Equivalent to `current_url()`
{{BASE-URI}}	Equivalent to `base_url()`
{{INDEX-URI}}	Equivalent to `site_url()`
{{STYLE-URI}}	Generate full url path to current active template
{{SCRIPT-URI}}	Generate full url path to script folder: `./public/scripts`
{{NAVIGATION}}	Navigation group
{{HEADER}}	Header group
{{CONTENT}}	Content group
{{SIDEBAR}}	Sidebar group
{{FOOTER}}	Footer group

Initializing the Template Class

he following code loads and initializes the template class based on your configuration settings

$this->load->library('Template');

Configuration

Open system/application/config/application.php and go to line 13 and 24.

/*
|--------------------------------------------------------------------------
| Base Site Name
|--------------------------------------------------------------------------
|
| Name of your site/application, e.g:
|
|    My First Website
|
*/
$config['site_name'] = 'AdsMalaya';

/*
|--------------------------------------------------------------------------
| Template Option
|--------------------------------------------------------------------------
|
| Enable you to configure template option
| Default template: <your-site>/public/styles/<theme>/<filename>.html
*/
$config['template']['theme'] = 'default';
$config['template']['filename'] = 'index.html';

Here you can modify the title of your application or site and the folder and filename of the default template.

$this->ui->set_output()

There are 3 possible output type: html (default), text or json (require json_encode to be enabled)

$this->ui->set_output('json');

Only html output will load the template file.

$this->ui->set_title()

$this->ui->set_title('Example Page');

The function will only set page title, while application/site title is only editable through the configuration file.

$this->ui->set_template()

$this->ui->set_template('feedmalaya');

The template engine will use folder ./public/styles/feedmalaya/ instead of the one specified in the configuration file.

$this->ui->set_file()

$this->ui->set_file('site.html');

There are time when you need to have different set of layout but using the in the same theme.

$this->ui->data()

Set output for text or json. Here an example how to use it.

$data = array (
    'success' => TRUE,
    'text' => 'Some text'
);
$this->ui->set_output('json');
$this->ui->data($data);
$this->ui->render();

$this->ui->view(‘filename’, $data, $group)

The method is almost identical to $this->load->view with the exception of the third parameter.

$data = array (
'success' => TRUE,
'text' => 'Some text'
);
$this->ui->view('myfile', $data, 'sidebar');
// will render to sidebar
$this->ui->render();

You can embed the view to any of the following group:

header
navigation
content (default)
sidebar
footer

$this->ui->append(‘some text’, $group);

Append existing template group with some text.

$heading = heading('Hello world', 2);
$this->ui->append($heading);

$this->ui->prepend(‘some text’, $group);

Prepend existing template group with some text.

$heading = heading('&copy; CodeIgniter', 2);
$this->ui->prepend($heading, 'footer');

Conclusion

How you can make use of it as I made in my project. If you manage to fine any bug please report it to us, Thank you.

15 Responses to Template Library for Ext.CodeIgniter

Pingback: 40+ CodeIgniter Framework Tutorials for Kick-Ass PHP Application | PHP Frameworks
Pingback: CRUD Library for Ext.CodeIgniter: An Example « Mior Muhammad Zaki
Pingback: 40+ CodeIgniter Framework Tutorials for Kick-Ass PHP Application | Programming Blog
Pingback: 40+ CodeIgniter Framework Tutorials for Kick-Ass PHP Application | Son Of Byte
shin says:

November 10, 2009 at 4:54 am

It will be great if you can put together some sample codes for MVC. I want to see a simple example so that I can see how it works.

Pingback: 43 примера использования PHP фреймворка CodeIgniter | Vizor-IT blog
Dre says:

January 13, 2010 at 5:04 pm

How to load View in view like.

CONTENT -> folder/content.php

so you can have theme like:

index.html,
css/
js/
page/
page/content.php
forum/threads.php

- Zaki says:
  
  January 13, 2010 at 5:22 pm
  
  Based on the Template Class, all template/theme file including HTML, CSS and Images will be stored under ./public/styles/{theme_folder}/ while view should be under ./system/application/views/ just like you load a view in default CodeIgniter
  
Dre says:

January 13, 2010 at 6:54 pm

I made some modifications.
The idea is to have theme outside apps, like

Application
System
Themes

$path = dirname(BASEPATH).'/themes/'.$this->theme.'/'.$folder.'/'.$file.EXT;

$this->fragment[$part] .= $this->ci->load->part_view($path,$vars,$return);

I made part_view() func. so I can load view from /theme/default/$folder/$file or /default/file

This gives me to be able to make view outside app folder, so I can overwrite views/file.

My next step is to make Options from Options lib, so to load from DB.

I can send you my file if you want to take a look, Its a bit hard coded, but I can explain or you can read it.

- Zaki says:
  
  January 13, 2010 at 11:11 pm
  
  That is one way of doing it, would really love it if you release your modification to be use for public, well that what the focus on open-source development right.
  
Pingback: 30 Top Codeigniter best Tutorials You must want to know. | 99Points
cyberizal says:

April 28, 2010 at 6:49 pm

ko mmg best lah miki.. simply superb..

Pingback: 40+ CodeIgniter Framework Tutorials for Kick-Ass PHP Application
Pingback: 40+ CodeIgniter Framework Tutorials for Kick-Ass PHP Application | Hassan C
Pingback: Blog's Dac Diep Vuong » Blog Archive » 30 Top Codeigniter best Tutorials You must want to know

Mior Muhammad Zaki