Recently, we have been looking and testing different templating engines for PHP. As part of our research, we came across Twig, a modern template language for PHP. We immediately liked the fact that Twig was a stand-alone engine, and not a complete Web framework.
Some of the features of Twig:
- Compiles templates into plain optimized PHP code
- Template inheritance. Define a layout in one template and populate the blocks in another template.
- You can define and use macros
In this PHP TWIG template tutorial, I’ll explain how to use Twig.
First, let’s have alook at the file structure of the project:
- compilation_cache: Directory where the compiled PHP templates will be written too. Please note that this directory must be writable by the Web server user.
- css: Used to store the CSS files.
- lib/Twig: The actual TWIG templating engine. The latest version of the engine can be found here.
- templates: Where all the templates will be stored.
- demo.php: Main PHP file for the project.
The PHP source file
demo.php file acts as the controller in our example. It basically does the following:
- Line 2-10: Sets up the TWIG templating engine.
- Line 12: Loads the
- Line 14-15: Retrieves the data from the model (is this case, a simple JSON array).
- Line 18-21: Invokes the templating engine, injecting the
display()method will output the resulting HTML directly, but if you want to assign the result to a variable, you can use the
The HTML template files
Now, let’s have a look at the template files.
base.html is the base template that
listview.html will be extending. This is the equivalent of the master page in .Net. In our case, we define 4 blocks that we’ll be able to override/extend in child templates:
- line 4-8:
- line 7:
- line 11:
- line 13-15:
Please note that in the case of the
footer blocks, a default rendering is defined, so it may not need to be extended.
Now, let’s have a look at the
listview.html file. This is the actual template file that is loaded on line 12 of
- Line 1: Specifies that this template extends (or is a child) of the
- Line 2: Simple TWIG comment
- Line 4: Overrides the
titleblock defined on line 7 of
base.html. In this case, we’ll just display the
pageTitlevariable that was injected on line 19 of
- Line 7-22: Overrides the
contentblock defined on line 11 of
- Line 8: Display the
pageTitlevariable inside the <H1> tags
- Line 11-20: Loop through all the elements in the
docsarray loaded on line 15 of
- Line 14: Apply the
summaryitem.htmltemplate to all of the elements in
- Line 15-17: Apply the
detailitem.htmltemplate only to the first 6 elements in the
- Line 8: Display the
summary.html template demonstrates two very powerful features of TWIG:
- Line 2-3: How you can easily access the fields of a
- Line 2: The use of the
upperfilter. Other filters include
join, etc. For more information, please visit the TWIG web site.
detailitem.html templates shows how you can display all the fields of an element.
So far, we have not found any major problem using TWIG. The performance is really good (in fact, according to author, TWIG is faster than all other PHP templating engines) and it is easy for our HTML integrators to learn the language.
We currently have a pilot project using TWIG and we’ll keep you posted on the results.
Thanks to Daniel for helping in building this PHP TWIG template tutorial.
I just found a presentation about TWIG that the author gave the 2009 PHP/Zend conference.