Using Smarty Templates in KnowledgeBuilder

Posted by: Chris    In: General

4 Aug 2005

## Introduction to Smarty Tags ##
Smarty templates are nothing more than regular HTML with special tags to control the displaying of dynamic data, in our case things like the the article’s title and contents on a Article page, or the listing of sub-categories on a Category page. With that in mind, we’ll dive straight into a small tutorial on the basics of Smarty markup.

### Smarty tags ###
Smarty tags are enclosed in `{ }` characters. Anything you put between these two characters is not shown directly in the page, but is processed by the Smarty engine.

### Variables ###
Smarty variables (for the most part) are assigned from the PHP script before loading the template. They are used to hold dynamic data, and can be simple things like words or numbers, but also more complex things like lists. For example, the Smarty variable `$site_name` is available to every context and contains the name of your site that you configured in the Admin section.

To display the contents of a simple variable in your HTML just put the name of the variable inside a set of smarty tags, like this: `{$site_name}`. So if you wanted to set the title of a page to your site’s name, you could do this:
[html]

[/html]

And when the page is shown, the actual HTML will come out like this:
[html]

[/html]

### Lists ###
*Lists* (or Arrays as they are sometimes called) are a more complex type of variable in Smarty. Instead of holding one value, *lists* hold multiple values and Smarty provides ways of looping over each value in the list. The most common use of *lists* in KB is for the `category.htm` template, which has lists of subcategories and articles for the current category you are viewing.

One way to loop over all of the values in a *list* is the Smarty `{section} … {/section}` block. Here’s an example from the `category.htm` template:
[html num=23]{section name=cat loop=$categories}

{if $categories[cat].locked}{else}{/if}
{$categories[cat].name} ({$categories[cat].numarticles})
{if $categories[cat].description ne “”}

{$categories[cat].description}

{/if}

{* Every third time we want a new row *}
{cycle assign=tempvalue values=”,,
“}
{$tempvalue}
{/section}[/html]

Now, there are lots of things going on in that block of HTML, but for now we’re only going to focus on the `{section}` block. At the very least (and there are more options that can be found on the [Smarty Documentation][1] site) the `{section}` block needs two parameters in the opening statement: `name` and `loop`. `loop` is the name of the *list* variable that holds the items you want to loop through, and `name` is the name of your section. The name of your section is very important in the block of HTML inside.

What a `{section}…{/section}` block does is print out the everything in between the `{section}` and `{/section}` tags once for every value in the list you specify with the `loop` parameter. So if our `$categories` list has 5 categories in it, the example `{section}` will print out all that HTML 5 times. This is where the `name` parameter comes in. Each time the HTML is printed out, you want to display information from the next value in the `$categories` list, so that you end up displaying information about all 5 categories. Every time through the loop you can access the current value from the list by putting the name of the section in `[]` brackets after the list name, like so: `$categories[cat]`. Each time through the loop, `$categories[cat]` will be a different category in the list of categories.

As for the other things in the example, we’ll cover `{if}` in a bit, and documentation on `{cycle}` can be found [here][2].

### Objects ###
Besides simple variables that contain things like words and numbers a lot of the Smarty variables used in KB hold more complex data in the form of *Objects* and *lists*. An *Object* is like a container for information, a single entity that holds various *properties*. Take the concept of an Article for example. An article has all sorts of information associated with it, things like it’s title, contents, author, creation date, number of times it’s been viewed, a rating, etc. In KB, the Article smarty object has the following properties:

* id – The ID of the article
* category – The ID of the category that the article is in
* question – The question
* content – The answer
* author – The name of the author
* authorid – The ID of the author
* date – The creation date for the article
* datemodified – The date the article was last modified
* numviews – The number of times the article has been viewed
* locked – Whether or not the article is “locked”
* numstars – The rating of the article (1 – 5)

To access a *Object’s* properties use the following structure: `$variablename.property`. So if you have an article held in the variable `$articleInfo`, and you want to display the question in bold you could do the following:
[html]{$articleInfo.question}[/html]

### Conditionals ###
One of the more powerful aspects of Smarty is it’s *conditionals*: the ability to dynamically determine if you should or shouldn’t print something out based on some property or variable. For example, in the *Category* context, you only want to display the table of sub categories if the current category actually _has_ sub categories right? Well, in the *category* context, there is a Smarty variable named `$num_categories` that holds the number of child categories, so we wrap the entire block of HTML that displays subcategories in a conditional, like so:

[html]{if $num_categories > 0}




{/if}[/html]

Now, every time the page loads to display a category, if there aren’t any sub categories, everything between the `

` tags will just be left out. You can
read more about conditionals and the various comparisons you can make (less than, greater than, equal to, etc) in the [Smarty Documentation][1] site.

### Finding out what information is available on each page ###
To find out exactly what information is available in each context all you need to do is put the smarty tag `{debug}` at the top of `index.htm`. Then, every time you view a new page, a window will pop up showing you every variable that is available to the page and what information it contains. If you’re working on editing or creating a new template set, this debug window is your definitive source of information about what sort of data is available in each context.

Just make sure to take the line out when your site goes into production.

*Continue on to the next page to learn about where to get more information*

[1]: http://smarty.php.net/manual/en “Smarty Template Documentation”
[2]: http://smarty.php.net/manual/en/language.function.cycle.php “Smarty Cycle Function Documentation”

Pages: 1 2 3 4

Related posts

4 Responses to Using Smarty Templates in KnowledgeBuilder

Avatar

Tim

August 4th, 2005 at 12:34 pm

Very nice write up. The {Debug} is great tool – I wish I had known about this earlier.

tb

Avatar

Chris

August 4th, 2005 at 12:42 pm

Yeah, {debug} is your best friend when working on a Smarty based site.

Avatar

Make Your Own Web Site » Make Your Own Web Site

April 3rd, 2008 at 5:24 pm

Make Your Own Web Site » Make Your Own Web Site…

As a final bid for bringing together community through the library a calendaring system could be implemented which gives all recognized community organizations an opportunity to plug into a central calendar system, hosted by the library; providing a li…

Avatar

Create My Business Plan

October 30th, 2008 at 3:21 am

Smarty Template Engine is really work smartly….i am appreciating it from core.Thanks!!

Comment Form

Subscribe By Email
Receive email alerts when new blog posts are available!


© 2010 ActiveCampaign,Inc. All rights reserved.