在PHP的世界里已经出现了各式各样的模板类,但就功能和速度来说Smarty还是一直处于领先地位,因为Smarty的功能相对强大,所以使用起来比其他一些模板类稍显复杂了一点。现在就用30分钟让您快速入门。
一. 安装
首先打开网页http://smarty.PHP.net/download.PHP,下载最新版本的Smarty。解压下载的文件(目录结构还蛮复杂的)。接下来我演示给大家一个安装实例,看过应该会举一反三的。
(1) 我在根目录下建立了新的目录learn/,再在learn/里建立一个目录smarty/。将刚才解压缩出来的目录的libs/拷贝到smarty/里,再在smarty/里新建templates目录,templates里新建cache/,templates/,templates_c/, config/
(2) 新建一个模板文件:index.tpl,将此文件放在learn/smarty/templates/templates目录下,代码如下:






新建index.PHP,将此文件放在learn/下:
















(3) 执行index.php就能看到Hello World!了。
二. 赋值
在模板文件中需要替换的值用大括号{}括起来,值的前面还要加$号。例如{$hello}。这里可以是数组,比如{$hello.item1},{$ hello.item2}… 而PHP源文件中只需要一个简单的函数assign(var , value)。
简单的例子:*.tpl:







三. 引用
网站中的网页一般header和footer是可以共用的,所以只要在每个tpl中引用它们就可以了。
示例:*.tpl:




模板文件中可以使用if else等判断语句,即可以将一些逻辑程序放在模板里。"eq", "ne", "neq", "gt", "lt", "lte", "le", "gte" "ge", "is even", "is odd", "is not even", "is not odd", "not", "mod", "div by", "even by", "odd by","==","!=",">", "<","<=",">="这些是if中可以用到的比较。看看就能知道什么意思吧。
示例:





{/if}
五. 循环
在Smarty里使用循环遍历数组的方法是section,如何赋值遍历都是在模板中解决,php源文件中只要一个assign就能解决问题。
示例:



输出结果为: id: 1000<br> id: 1001<br> id: 1002<br>
六. 常见问题
Smarty将所有大括号{}里的东西都视为自己的逻辑程序,于是我们在网页中想插入javascrīpt函数就需要literal的帮忙了,literal的功能就是忽略大括号{}。
示例:











什么是section?






就像在Smarty 官方手册里提到的,模板section 是用来循环数组里的数据的。所有的section 标签必须和/section 标签成对儿
使用。必须使用的参数是name 和loop。section 的name 可以随你所好,可以是由字母、数字和下划线组成的。section 可以嵌
套使用,互相嵌套的section 它们的name 必须与众不同。变量loop(通常是数组的值)决定着section 将要循环的次数。当用
section 显示一个变量时,section 的name 必须紧跟在变量名的后面,并用中括号 [] 括起来。当loop 变量没有值时,
sectionelse 就会运行。
下面就是一个name 为left_block,loop 为$LEFT_BLOCK_BODY 的section,注意到
当中显示变量的方法了么?section 的name 也就是left_block 紧跟在$LEFT_BLOCK_BODY 的后面,并用中括号 [] 括起来了。



为什么要使用section?
就像phpBB2 的成员列表,如下图,显示的内容
当你设计成员列表时(如图1 所示),你要用到section。
(图1)
因为你无法确认有多少个用户注册,即使确认就100 个限制用户注册,用传统的table 设计网页你需要作的是牲口般的工作,所以把
这些交给section 来处理吧。
其实还有很多地方可以用到section。比如用div 来作网页布局的时候,左、中、右区域的区块儿和模块儿都是由后台数据库的block
management 来管理的,网页设计者根本就不知这些动态浮动的区块儿、模块儿在什么地方、什么时候、什么样式、什么内容出现,
或者这些区块儿和模块儿压根儿就不让你看见(管理员控制面板对一般用户就是隐藏的),section 可以轻松地管理登陆框、导航栏、
新闻发布、谁在线、语言选择等区块儿和模块儿。
如何使用section?
Smarty 中的section 和PHPLib 中template 的block 很相似,但section 更为smart。如果你使用过PHPLib 的block 很快
PHPMORE VOL5 19/26
你就会过渡到section,如果你以前压根儿就没有听说过这些事儿, 反而更容易掌握section 的概念,因为什么都不知道嘛。Just
kidding^_^
来个简单的导航栏元素设计的例子。传统的导航栏设计很实诚(如图2 所示),
(图2)
有多少个链接就用dreamweaver 设计几个,有千千万万个怎么办呢?而且还要随时变化怎么办呢?你只用设计一个链接其他的就让
section 去循环显示好了。用dreamweaver 设计一个名为navigation.htm 的页面(只保留了table 当中要用到的元素,其余的
html 元素在不影响显示的前提下均以省略),如下面html 代码。
<{$L_TITLE_NAVIGATION}>
href="<{$u_navigation[navigation]}>"><{$l_navigation[navigation]}>
其中就定义了超链接变量,<{$l_navigation[navigation]}>就定义
了超链接的名称,用<{section name=navigation loop=$l_navigation}>和<{/section}>框住要循环显示的部分,一个自
动化的导航栏的表现层就设计好了。(请参看MVC 模型)
光有皮肤没有骨架是支撑不起导航栏来的,所以让我们看看如何用PHP 代码控制显示导航栏的。写一个名为navigation.php 的PHP
文件,代码如下:





















首先,$template->assign 是在调用Smarty 的smarty 类当中的assign 函数,assign 的意思就是赋值、分配、指派的意思。
$template->assign 给navigation.htm 网页模板中的l_navigation 变量赋了一个数组,并提供了6 个变量型的数组值(你
要在其他地方给它们负值,或者直接像给超链接地址负值一样用" …… "的形式)——用来显示超链接的名称,其中的数组键值用PHP
默认的0、1、2……就省略了;还给u_navigation 变量赋了一个数组,相对称的也是6 个但已给出数值的变量——用来定义超链接的
去向(其中运用了参数?name 来判断转向哪个模块儿)。你可能会产生疑问:循环的次数在哪里定义的?loop 变量名仅仅是
$l_navigation 数组呀!如果你有机会查看Smarty 的代码,你会发现loop = count($l_navigation),只是这个过程被封装
了,你只用调用这个section 接口就OK 了。
然后,利用smarty 类当中的display 函数,就可以运行navigation.php 查看你的导航栏了
$template->display(“navigation.htm”);
进一步使用section
就像我前面提到的,section 主要在处理多个重复其不断变化的元素上优势明显。这里由于篇幅有限,就把思想和大家共享,把未完
善的内容留给以后的文章。变化的数据来源于数据库,那么在$template->assign 一个section 变量的时候可以用到DB(是PEAR
PHPMORE VOL5 21/26
提供的对多种数据库操作的集成度很高的类,可以一次编写标准的SQL 语句在大多数主流数据库上到处运行)和section 的综合利用。
在网页中显示居于左侧的区块儿和模块儿
$sql = "SELECT block_value FROM sirtoozee_blocks
WHERE block_side = 'left' and block_visble = 'true'
ORDER BY 'weight ";
//用getCol 这个API 可以得到一维数组$block = array('','',...)
$block_value = $db->getCol($sql);
$template->assign("LEFT_BLOCK_BODY", $block_value)
你可以print_r($block_value)看看$block_value 这个数组结构是不是就是array('' …… '', ... )的结构一模一样。其
中具体的DB 类的使用和网页layout 布局我会在以后的文章中详细讲解。
如果大家对调用Smarty 不熟悉,我在这里也简单介绍安装配置Smarty 的方法:
到http://smarty.php.net 下载stable 版本的smarty,将压缩包里./libs 文件夹里的所有文件解压缩到Smarty(需要自己
新建)文件夹中,并将你设计的网页模板文件,如navigation.htm 放在templates(需要自己新建)文件夹下,还需要为Smarty
新建config、cache、templates_c 文件夹用来编译生成临时文件,最后形成如下的文件目录结构:
./
./Smarty/internals
./Smarty/plugins
./Smarty/Config_File.class
./Smarty/debug
./Smarty/Smarty.class
./Smarty/Smarty_Compiler.class
./templates
./templates_c
./config
./cache
用如下代码调用Smarty 类













