Join the friendly bunch on IRC...
I. InstallationFor download and installation please refer to PHPTAL :: Template Attribute Language for PHP
II. "Hello World"
Now let's create our first template (helloworld.html):
HTML Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title tal:content="your_title">Your site name here</title> </head> <body> ${your_content} </body> </html>
PHP Code:
<?php
require_once 'PHPTAL.php';
$tal = new PHPTAL('helloworld.html);
$tal->your_title = 'Hello world title';
$tal->your_content = 'Hello world!!!';
echo $tal->execute();
?>
If you script throws an exception, check your PHPTAL installation. Maybe your paths are set incorrectly.
tal:content="your_title" replaces the contents of the title tag with the contents of $tal->your_title
This could also be done with ${your_title} inside the title tag (<title>${your_title}</title>), but there's one important difference:
If $tal->your_title is not set, tal:content="your_title" throws an exception, ${your_title} just displays nothing.
III. Hello Universe
Let's create another template (hellouniverse.html):
HTML Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title tal:content="your_title">Your site name here</title> </head> <body> <div tal:repeat="planet planets" tal:content="planet" /> </body> </html>
PHP Code:
<?php
require_once 'PHPTAL.php';
$tal = new PHPTAL('hellouniverse.html');
$tal->your_title = 'Hello Universe';
$tal->planets = array('Earth', 'Mars', 'Jupiter', 'Saturn', 'Venus', 'Moon');
echo $tal->execute();
?>
So the HTML output should be
HTML Code:
<div>Earth</div> <div>Mars</div> <div>Jupiter</div> <div>Saturn</div> <div>Venus</div> <div>Moon</div>
IV. Hello Universe extended
Let's modify our hellouniverse.php:
PHP Code:
<?php
require_once 'PHPTAL.php';
$tal = new PHPTAL('hellouniverse.html');
$tal->your_title = 'Hello Universe';
$tal->planets = array(
'Earth' => array('Radius' => 6371.0, 'Satellites' => 0, 'isPlanet' => true),
'Mars' => array('Radius' => 3396.2, 'Satellites' => 2, 'isPlanet' => true),
'Pluto' => array('Radius' => 1195.0, 'Satellites' => 3, 'isPlanet' => false),
'Jupiter' => array('Radius' => 71492.0, 'Satellites' => 63, 'isPlanet' => true)
);
echo $tal->execute();
?>
HTML Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title tal:content="your_title">Your site name here</title> </head> <body> <table> <caption>Planets</caption> <thead> <tr> <th>Name</th> <th>Radius</th> <th>Satellites</th> <th>is a Planet</th> </tr> </thead> <tbody> <tr tal:repeat="planet planets"> <td tal:content="repeat/planet/key">Name</td> <td tal:content="planet/Radius">Radius</td> <td tal:content="planet/Satellites">Satellites</td> <td> <span tal:condition="planet/isPlanet" tal:replace="string:Yes" /> <span tal:condition="not:planet/isPlanet" tal:replace="string:No" /> </td> </tr> </tbody> </table> </body> </html>
Getting the key or the index of the current array item is done via "repeat/current_array_item/key" (like shown in the example) or via "repeat/current_array_item/index".
For some other loop information refer to the PHPTAL manual (2.*TAL namespace)
tal:condition="planet/isPlanet" tells PHPTAL to display the surrounding tag only to be displayed, if isPlanet ist true (boolean true, not empty string, not 0 or not null)
tal:condition="not:planet/isPlanet" tells PHPTAL - oh come on man, I don't have to explain this.
tal:replace is nearly the same as tal:content, but tal:replace replaces the whole surrounding tag.
For using the string: modifier please refer to the manual (7.*PHPTALES)
V. Hello OO Universe
Now let's spice up things a little bit.
Modify the hellouniverse.php:
PHP Code:
<?php
class Piece_of_Rock
{
public $radius, $satellites = 0, $planet = true;
public function __construct($name, $radius, $satellites = 0, $isPlanet = true)
{
$this->name = $name;
$this->radius = $radius;
$this->satellites = $satellites;
$this->planet = $isPlanet;
}
public function getName()
{
return $this->name;
}
public function getRadius()
{
return $this->radius;
}
public function getSatellites()
{
return $this->satellites;
}
public function isPlanet()
{
return (boolean) $this->planet;
}
}
$planets = array(
new Piece_of_Rock('Earth', 6371.0, 1),
new Piece_of_Rock('Mars', 3396.2, 2),
new Piece_of_Rock('Pluto', 1195.0, 3, false),
new Piece_of_Rock('Jupiter', 71492.0, 63)
);
require_once 'PHPTAL.php';
$tal = new PHPTAL('hellouniverse.html');
$tal->your_title = 'Hello Universe';
$tal->planets = $planets;
echo $tal->execute();
?>
HTML Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title tal:content="your_title">Your site name here</title> </head> <body> <table> <caption>Planets</caption> <thead> <tr> <th>Name</th> <th>Radius</th> <th>Satellites</th> <th>is a Planet</th> </tr> </thead> <tbody> <tr tal:repeat="planet planets"> <td tal:content="planet/name">Name</td> <td tal:content="planet/getRadius">Radius</td> <td tal:content="planet/getSatellites">Satellites</td> <td> <span tal:condition="planet/isPlanet" tal:replace="string:Yes" /> <span tal:condition="not:planet/isPlanet" tal:replace="string:No" /> </td> </tr> </tbody> </table> </body> </html>
A few other tutorials will follow (as time allows):
- Writing REAL templates (not just replacing variables and iterating over arrays)
- i18n
- Security issues
