Intended Audience
Smarty Overview
Smarty for Designers
Smarty for Programmers
Sample Script
Summary
Intended Audience
This article is intended for PHP programmers and HTML
designers interested in applying a new technique for web development – PHP
templating. Advanced knowledge of PHP programming and HTML is assumed.
Smarty Overview
The theoretical web development process is that: first the
designer makes the interface, and breaks it down into HTML pieces for the
programmer then the programmer implements the PHP business logic into the HTML.
That’s fine in theory, but in practice, from my
experience, the client frequently comes with more requirements, or maybe more
modifications to the design or to the business logic. When this happens , the
HTML is modified (or words rebuilt ) programmer changes the code inside HTML.
The problem with this scenario is that the programmer needs to
be on stand-by until the designer completes the layout and the HTML files.
Another problem is that if there is a major design change then the programmer
will change the code to fit in the new page. And that’s why I recommand
Smarty. Smarty is a templating engine for PHP.
You can download it from
http://www.phpinsider.com/php/code/Smarty/
or http://smarty.php.net . The installation
process is very simple. Just read the documentation and follow up the
instructions.
So what is Smarty ? Smarty is a set of PHP classes that
compile the templates into PHP scripts. Smarty is a template language and a very
useful tool for designers and programmers.
Smarty for Designers
Designers work with HTML files. To work with Smarty, you work
with template files. These files are are made up of static content but combined
with Smarty mark-up tags. All the template files have a .tpl extension. The
Smarty template tags are enclosed within { and } delimiters.
Let’s consider the basic structure of a web page. There
is a header, a middle part, and a footer. A template file that includes the
header and the footer looks like this:
{include file="header.tpl"}
<form name="form1">
Label1 <input type="text" name="text1">
<input type="submit" value="submit">
</form>
{include file="footer.tpl"}
All the templates should reside in a single template
directory. After calling a template for the first time, the compiled template
will reside in templates_c.
Smarty language is very poweful. All the variables that come from PHP are identified in Smarty with {$Variable_Name} (we precede them with a $ sign). So if we have a variable in PHP that is called $MyName, then to print it in Smarty you have to write something like:
<html>
<body>
Welcome, {$MyName} <br>
</body>
</html>
The power of Smarty lies also in its flexibility. You
can insert IFs and LOOPs into the template. The syntax for IF is:
{if <condition> }
html code
{else}
html code
{/if}
Let’s say you have a dynamic menu based on links.
Depending on the link you click, you go to a specific page. So you get from PHP
a variable $Menu with a integer value,
depending on the page you are. The template looks like :
{if ($Menu == 1) }
Option 1
{else}
<a href="option1.php">Option 1</a>
{/if}
{if ($Menu == 2)}
Option 2
{else}
<a href="option2.php">Option 2</a>
{/if}
For coding a loop let’s suppose you get an array like
the following from PHP :
<table>
<tr
{section name=user loop=$userID}
{if $smarty.section.user.iteration is odd}
bgcolor=#efefef
{else}
bgcolor=#ffffff
{/if}
>
<td> ID = {$userID[user]} </td>
<td> Name = {$name[user]} </td>
<td> Address = {$address[user]} </td>
</tr>
{sectionelse}
<tr>
<td>
There is no user.
</td>
</tr>
</section>
</table>
Iteration is an internal counter for Smarty. It helps us to know the current iteration of the section. I use this internal variable to make alternate row colors in the table by checking if current iteration value is odd or not (Note that iteration was added to Smarty from version 1.4.4).
An alternative for LOOPS is FOREACH which is used to loop over a single associative array.
<foreach from=$users item=current_user>
Name = {$current_user}
<foreachelse}
No user available.
</foreach>
The main difference between SECTION and FOREACH is that for SECTION you can start from a specific value, and can also set a step for the iteration, whereas for FOREACH you have to loop over all values.
Smarty for Programmers
The advantage for programmers is that they write the code in a PHP file without having to mix the instructions with HTML. Furthermore, if the designer changes the layout of a page the programmer doesn’t have to change the code to suit the new layout since the functionalities won’t change. You do your work in your files, assign to the templates all the values needed to print on the site and go out for a beer. You won’t get phone calls asking you to change a bit of code because the designer changed the layout and now a set of internal errors cropped up.
In the PHP file you need to include the Smarty class require ‘Smarty.class.php'. After that you need to instantiate the smarty with $smarty = new Smarty.
To assign a variable to the template you need to $smarty->assign('UserName', ‘John Doe’). After everything is finished you call the method to display the template $smarty->display('index.tpl').
A sample code looks like this (index.php) :
<?php
require 'Smarty.class.php';
$smarty = new Smarty;
$smarty->assign('Username', 'John Doe');
$smarty->display('index.tpl');
?>
The template (index.tpl) looks like this:
<html>
<body>
Welcome {$Username}
</body>
</html>
You can also create an array in PHP an pass it to the template:
$tmp = array ( 'UID'=> '10', &'Name' => 'John Doe', 'Address'=>'Home address');
$smarty->assign('info', $tmp);
Sample Script
This script connects to a local database and select all the
products from the ‘Products’ table. Then it passes all the values to
the template, which prints them on the screen.
INDEX.PHP
<?php
require 'Smarty.class.php';
$smarty = new Smarty;
$hostname = "localhost";
$dbUser = "sqluser";
$dbPass = "sqlpass";
$dbName = "sqldb";
// connect to the database
$conn = mysql_connect($hostname, $dbUser, $dbPass) or die("Cannot connect to the database");
mysql_select_db($dbName);
$sql = "SELECT prodID, info FROM products ORDER BY prodID ASC";
// get all the products from the table
$res = mysql_query($sql);
$results = array();
$i=0;
while ($r=mysql_fetch_array($res)) {
$tmp = array(
'prodID' => $r['prodID'],
'info'=> $r['info']
);
$results[$i++] = $tmp;
}
// pass the results to the template
$smarty->assign('results', $results);
// load the template
$smarty->display('index.tpl');
?>
INDEX.TPL
<html>
<body>
Here's a table with the results: <br>
<table cellpadding=1 cellspacing=0 border=0 width=100%>
{section name=nr loop=$results}
<tr {if $smarty.section.nr.iteration is odd} bgcolor="#efefef"{/if}>
<td class=fb width=15%>
<nobr><a href=”show-product.php?id={$results[nr].prodID}">Press here</a>
<td class=fb width=29%><a href="show.php?id={$results[nr].prodID}"
{popup inarray=$smarty.section.nr.iteration}
>{$results[nr].info}</a></td>
</tr>
{sectionelse}
<tr><td align="center"><br><b>no product </b> <br> </td></tr>
{/section}
</table>
<br>
Here's a select with the results: <br>
<select name="mys">
{section name=nr loop=$results}
<option value="{$results[nr].prodID}">{$results[nr].info}</option>
{/section}
</select>
</body>
</html>
Summary
Smarty is a great tool for both designers and developers. By using Smarty you can reduce the site development and maintenance times. If you are a developer you no longer need to mix PHP code with HTML code. Just take care of business logic and leave the HTML to the designer.
About the Author
Cezar Floroiu is a student at “Politehnica” University, Automation and Computer Science Faculty in Bucharest, Romania. He is a freelance web developer involved in many projects as a PHP, ASP / ASP.NET programmer.
You can contact him directly at cez@xnet.ro .
April 11, 2008 at 6:12 am
Your theory is very attractive and simple appreciate it .thanks
April 11, 2008 at 6:16 am
smarty is back bone of php developer to programming when comes at the points of designing . Its the basic requirementsof today competitive markets and this topic is very useful to begginner.
May 29, 2008 at 7:13 am
it is very attractive, easy and understandable. u help me alot. i was not understanding the smarty. but with ur example i am able to understand smarty in a eaiser way. thanks alot for this page. please create more helping tips. these will help people alot.
June 2, 2008 at 5:55 am
This topic is very useful to understanding smarty. Thanks
February 26, 2009 at 11:50 pm
Great information! I just started working with Smarty, your post has greatly helped me understand it better. Was wondering through if you/somone could post example code to show-product.php?id= or show.php?id= that when clicking on the link, would actually pull the individual record/page from the database and display certain information about the "product"?
April 8, 2009 at 1:42 pm
This post is written in a very comprehensive manner. Very great Job! Thanks.
October 21, 2009 at 8:08 am
Just arrived in foreign country and found out that I will work with Smarty. Despite all problems with language, Smarty is easier than it seems (I was introduced to the companie’s templates folder and it was really big)…
So, it’s not difficult to understand the proccess, but so far, this article was the simplest and best to get ready working on it.
Thanks.