Smarty - Part 1 - Installation and Setup

[Orjan]

Content
This tutorial will be in several parts:

Part one, Installation and Setup
Part two, Smartify your Forms
Part three, Creating tables and lists
... more to come

About Smarty
This tutorial will treat a former PHP-project named Smarty, it's a template engine, which works as some kind of middleware between your PHP coding and the outputted HTML. It helps you create templates for you page, and with ease change template and with that your entire layout, without touching your PHP code.

Smarty can be found at Smarty : Template Engine, where you can download Smarty and also read the documentation. At the writing of this tutorial, version 2.6.26 was most recent, and based on that. A version 3 is during construction according to the web site.

Idea with using Smarty
The idea with Smarty is to ease your programming. When using Smarty, you don't need your PHP script to be in output order. The whole idea with smarty is that your PHP do not print or echo anything by itself. Let smarty and the templates do everything of that for you!

Installation
There are two possible ways of installing Smarty, either a lose install which is easy to move and install on other servers, and a little bit trickier way, but it lets you reuse the library to save diskspace if you have Smarty on several projects on the server, it is a little but safer, as you install it outside the webroot, but It shouldn't do any harm to be in the website directory either. Here, I'll follow the easy install into the website directly in this tutorial.

Installation is easy, you unpack the tar.gz or zip you download and get an directory named Smarty-versionnumber. Rename this to just "Smarty". Under this directory, create a directory called "compile", this is where the system creates temporary files, so this directory needs write access for the web server user.

Templates
Templates is html files with Smarty codes added to it. these are usually stored in a subdirectory to your web site, I usually call it "templates", create this directory.

Set up Smarty in your PHP
You need a few lines of code to start the Smarty engine:

require_once("Smarty/lib/Smarty.class.php");
$smarty = new Smarty(); 

We're done creating the object from where we will handle the template engine. Now, we ned to do some settings to make it work properly:

Compile ID gives your site an unique alias, this is if you have several applications sharing the same compilation directory. This can be ommitted if you only will use the compilation directory for this single application.

$smarty->compile_id = "smarty_tutorial"; 

Then there is a need to tell the path to the template dir, using the dirname(__FILE__) makes you don't have to change this for other servers with other setups of the directory trees.

$smarty->template_dir = dirname(__FILE__)."/templates/"; 

Here, we state the compilation directory so Smarty knows where to store the compiled files.

$smarty->compile_dir =  dirname(__FILE__)."Smarty/compile/"; 

This line is only needed during your development phase, and should be changed to false when you put the web site to live environment. this makes Smarty to always recompile if there are any changes in the template files that it can't detect itself.

$smarty->force_compile = true; 

So, the beginning of your PHP file should probably look like this:

require_once("Smarty/lib/Smarty.class.php");
$smarty = new Smarty();
$smarty->compile_id = "smarty_tutorial";
$smarty->template_dir = dirname(__FILE__)."/templates/";
$smarty->compile_dir =  dirname(__FILE__)."/Smarty/compile";
$smarty->force_compile = true; 

Smarty variables
To be able to send information from your own PHP code into the templates, all data is needed to be assigned to Smarty, this is done calling a method called assign. The method takes two parameters, the first one is a string naming the variable content for the template, the second one is the data to be assigned to that name:

$smarty->assign("welcomemsg", "Hello CodeCall readers!"); 

This means, that we now have available an variable to use in the templates names "welcomemsg", and it will contain the string above. Here you can add whatever you want, arrays, strings or numbers, as you need to publish. More to how to handle Arrays in Smarty in another part.

Publish your page!
So, now, we say you have created all your variables you need to send to Smarty, it's time to publish your page.

$smarty->display("hello.tpl"); 

Thats' it. That's all for the PHP file. Now it's all up to create the template and let Smarty do it's job for you.

Create your template
Start a new file places in your templates directory, name it "hello.tpl" according to what we named it to just the step above. This file is where you put all the needed html. I will not do a perfect html here, I do what it needs only. Add doctype and other code as you need to make it genuine.

<html><head>
<title>Testing my Smarty Template</title>
</head><body>
<div id="welcome">{$welcomemsg}</div>
</body></html>

As you can see, everything seems normal, except for the content of that div tag. this is where Smarty does the work for you. Smarty takes everything within the bracelets {} and interprets it. In this case, we want to output an variable, so we start with an dollar sign and directly follow it with the assigned variable name, close the bracelet.

Now, you can put all on your server, and try to access the php file you created. The tpl-files are not to be accessed. If everything is correct, you will get a page with it's html look like this:

<html><head>
<title>Testing my Smarty Template</title>
</head><body>
<div id="welcome">Hello CodeCall readers!</div>
</body></html>

Not a trace anywhere from Smarty's existence, just plain html. This way, you can assing how many variables you want, and use them how you want. you can create many different template files, and change the layout, just make Smarty display the right template file. of course, you don't have to write the name of the template file, you could have a variable containing it's name, and depending on other things in your script, choose between which template to use in that case.

Next part will handle Forms, and how Smarty can ease your form creating pain.

[Jordan]

Wow, that is impressive! I can see the huge benefit of using Smarty. I'm also going to be doing a couple of templates using Smarty. Is there anyway to dump all of the data assigned to Smarty?

+rep

[Turk4n]

Really useful !!!
Rep+ !

[Orjan]

Wow, that is impressive! I can see the huge benefit of using Smarty. I'm also going to be doing a couple of templates using Smarty. Is there anyway to dump all of the data assigned to Smarty?

+rep

I usually have a debug flag that enables or disables this:

print_r($smarty->get_template_vars()); 

[Jordan]

Perfect! That will help me Create a template for this code I did not write.

[Jordan]

Another question, is it possible to execute PHP inside of Smarty .tpl files?
I realize I could search this but it doesn't provide any benefit for CC in doing so.

[Orjan]

Yes, use {php}and {/php} tags. This far, I've never needed them anyway, as there are so much more to be shown in coming parts of this tutorial.

[Jordan]

Great! Smarty seems like an amazing template system. I may rework ASCIIBin to use it.

[iConquest]

I definitely need this! Thankyou

[John]

Nice tutorial Orjan, but honestly, as a programmer I see no need for smarty. With a properly designed front controller, and a page controller (and perhaps a model) for your views - that provides sufficient abstraction of your business logic and display. Plus the overhead of smarty, IMO, isn't worth eliminating a few <?php echo $var; ?> in my code just to be replaced with {$var}. However, in a situation where collaboration between a programmer and a designer necessary, smarty is only good from a security stand point.