Smarty Icon

You may use the Smarty logo according to the trademark notice.

Smarty Template Engine Smarty Template Engine

For sponsorship, advertising, news or other inquiries, contact us at:

Sites Using Smarty

Advertisement

If you’re looking for a £5 deposit casino bonus then we suggesting visiting www.5bingosites.com

Crash Course

Templating basics: Assign content to Smarty, then display a template file.

The template file then contains the presentational output interspersed with {tags} that Smarty replaces with dynamic content.

As you can see, Smarty cleanly separates your presentation (HTML/CSS) from your application (PHP) code. However, it still contains some logic of its own. With respect to Smarty's design principles, the logic in the templates should be for presentation only. For instance, looping over table row colors or including one template from another would be considered presentation logic. This way the application code only needs to supply the content, and the template can take care of the presentation. The idea is to keep the template designer role (front-end developer) and application programming role (backend-developer) separated. You should be able to completely redesign the presentation (of the content) without altering the application code. You should also be able to restructure the application code and use the same templates, just keep the content assigned to the same variables. This design goes a long ways toward maintenance and stability.

Sometimes alteration of the assigned content is required for presentation. This is accomplished with variable modifiers. These are used to alter the output of assigned variables from within the template. In our example, we would like to display George's name capitalized, and we would like to properly HTML escape the amphersand (&) symbol in the address. We also show how to display the current date with custom formatting.

Using modifiers, we have just handed formatting control of the assigned content over to the template. The idea is to assign the unmodified content to the template, keeping presentation logic out of your application code.

You can chain any number of modifiers together on one variable, making this feature quite flexible. There are many more modifiers that come with Smarty, or you can make your own with its easy to use plugin architecture. Drop your new modifier into the plugin directory, then mention it in the template!

You can also use or create template functions. Template functions carry out tasks in the template. For example, you can include other templates with the {include} function, you can generate a set of select options with the {html_options} function, or you can cycle through a set of values with the {cycle} function. Let's say you have many templates with the same header and footer information. You can manage these as separate templates and include them.

One feature of the {include} function is locally scoped variables. Notice that $title is a template variable not assigned directly to the template, but assigned by passing it as an attribute to the {include} function. This way the $title variable is only available within the scope of the header template, and can be dynamically changed any time the header.tpl file is included. Also, notice we used the default modifier on $title so in the case $title is empty, the text "no title" will show up instead of displaying nothing.

An alternate approach to managing template hierarchy is Template Inheritance. A template can inherit another, and change specific blocks of content within that template. For example:

parent.tpl

<html>
  <head>
    <title>{block name=title}Default Title{/block}</title>
  </head>
  <body>
    {block name=body}Default Body{/block}
  </body>
</html>

child.tpl

{extends file="parent.tpl"}
{block name=title}My Title{/block}
{block name=body}My Body{/block}

output

<html>
  <head>
    <title>My Title</title>
  </head>
  <body>
    My Body
  </body>
</html>

There are some nice functions that automate tasks such as html dropdown boxes. One is html_options. You assign the arrays of data to the template, then this function does all the work to generate the HTML output for it.

You can quickly loop over arrays of data with the foreach function. Here's an example of that, and we also threw in alternating row colors via the {cycle} function, and we use the {strip} function to strip out extra white space.

Smarty also has built-in caching capabilities to help speed up the page rendering. A copy of the template output is stored in a text file, then that is displayed upon subsequent calls to the request instead of dynamically rendering the page each time. This can speedup page rendering substantially, especially if there is a lot of processing involved to create the page such as database calls and variable assignments. You can also leave parts of a page dynamic just by marking them as nocache.

You can also have multiple cached versions of a single page by passing a unique cache id to the display() function. See the docs for details.

There are many more builtin and custom functions that come with Smarty, or you can make your own, again with the easy to use plugin architecture.

There is a lot more to learn about Smarty, now head over to the documentation!