Smarty Templating Basics

CMS Made Simple™ uses Smarty to build core and third party module templates. You can do *so much* with it, but you need to have some basic knowledge to start really using it to the fullest. In this tutorial I will give you an oversight of the most useful codes, including practical examples.

Smarty is a template engine for PHP, facilitating the separation of presentation (HTML/CSS) from application logic. This implies that PHP code is application logic, and is separated from the presentation.

This tutorial will always be "work in progress". I will add/change items when I see a related question at the forum or when I come across a problem/solution myself.

How to use

Assign a value to a variable

{$foo = 'value'}

Assign a value to a global variable

{$foo = 'value' scope=global}

Assign multiple values to one variable

{capture assign=foo}{uploads_url}/images/path/{$image_name}.jpg{/capture}

{$foo} will be "http://www.website.com/uploads/images/path/photo-name.jpg"

Only display variable when it has a value

{if !empty($foo)} <-- Means, if $foo is not empty
<div class="bar">
Value: {$foo}
</div>
{/if}

Only display content block when it is filled

{$content2 = "{content block='content2'}"}

{if !empty($content2)} <-- Means, if $content2 is NOT empty
<div id="content2">
{$content2}
</div>
{/if}

Only display when variable is empty

{if empty($foo)} <-- Means, if $foo is empty

{/if}

Equation

Equations

! NOT
&& AND
|| OR
== EQUALS
!= NOT EQUALS

Modifiers

Always display in lower case

This is used to lowercase a variable.

{$foo|lower}

'AbCdEf' will be 'abcdef'
'abcdef' wil be 'abcdef'

Always display in upper case

This is used to uppercase a variable.

{$foo|upper}

'AbCdEf' will be 'ABCDEF'
'ABCDEF' wil be 'ABCDEF'

Capitalize words

This is used to capitalize the first letter of all words in a variable.

{$foo|capitalize}

'abc def ghi' will become 'Abc Def Ghi'

Give a variable a default value

{$foo|default:'Default value'}
{$image|default:'default-image.jpg'}

Rounding value

{$foo|round}

'20,23' will become '20'

Truncate value

{$foo|truncate:30}

Get a part of a variable

Return the portion of variable specified by the start and length parameters.

{$foo|substr:10}

Price and format

Return the variable with two decimals and replace the dot for a comma.

{$price = '12345'}
{$price|number_format:2:',':'.'}

The output will be 12.345,00 instead of 12345

Calculating

Count values

{$a = '60'}
{$b = '30'}
{$a + $b}

The output will be 90

Substract values

{$a = '60'}
{$b = '30'}
{$a - $b}

The output will be 30

Multiply values

{$a = '6'}
{$b = '20'}
{$a * $b}

The output will be 120

Divide values

{$a = '120'}
{$b = '20'}
{$a / $b}

The output will be 6

Calculate percentage

{$part = '20'}
{$total = '80'}
{math equation='part/total*100' part=$part total=$total assign='percentage'}
{$percentage|round}

Result will be 25%

Show related articles:

Comment Form

ReviewManager

GDPR privacy disclaimer
This form will send me your email address and your IP address.
If you don't want that, don't use this form!

ReviewManager

3 Comments

24-02-2023

Douglas C Smith

It stripped out my code so I guess there's nothing we can do here.

24-02-2023

Douglas C Smith

I'm taking a shot that maybe you can help me with this. I'm doing a site that has a mobile component. I'm using this UDT to detect mobiles:

Simple but works very well. In my template I put {mobiledetect} and bingo it changes to the mobile site. Problem is I don't want to use a peticular template on one of my menu items.
So in the template I put {if ! mobiledetect} blah blah blah{/if}
It always returns true. Whether it be a PC or a mobile. I'm close but not quite there.
Thanks in advance and I'd be glad to buy you a cup of Joe!
Doug

10-11-2016

Simon

Thank you for the introducton!
Is there any chance to upgrade the current smarty version with the latest 3.x version in cmsms 2.1.5?

Smarty Templating Basics

Article optimized for CMSMS 2.x

  Author: Rolf
  Last updated: 23-06-2018
  Comments: 3
  http://cms.ms/Bo5e