ECshop模板机制整理

quasiceo 2014-05-04

展开全文

模板机制

近期新项目涉及到ECshop的二次开发，趁此良机正好可以对闻名已久的ECshop系统进行深入了解。要了解一个系统，那么该系统的模板机制就是最重要的一环。相关整理如下：

一、模板引擎：

ECshop给我的第一印象是用的smarty模板引擎，可是很快就发现有些不一样，使用smarty模板引擎的系统通常会至少会包括smarty的核心文件：smarty.class.php、smarty_Compiler.php、config_File.class.php和debug.tpl，而在ECshop中并没用发现smarty的核心类。还是通过程序寻找答案吧，在前台或者后台的公用文件init.php中$smarty对象的初始化中，可以看到加载的模板引擎文件是cls_template.php，原来ECshop团队对smarty的核心部分做了整理及修改，这个引擎相对更加精简，但是使用的时候可能需要注意，不是所有的smarty语法都可以在ECshop中使用，要使用还需修改模板引擎。

二、数据处理：

ECshop根目录下及admin目录下的文件是对应前台、后台页面的数据处理页，在这些文件中对页面所要展示的内容进行处理，之后通过smarty的assign()方法注册变量，最后通过display()方法加载相应的模板文件。但这里我们需要注意ECshop单独封装的几个方法，用于处理模板的公共内容及页面中某些动态内容的加载。如lib_main.php中的assign_template()会设置我们的网店的公共信息及网站设置；assign_dynamic()方法则是设置该页面中的动态加载内容。当页面所需的变量设置完成后，进入smarty的display()方法。

三、解析模板

首先，在ECshop中有.dwt和.lbi两种格式的模板文件，那么这两种文件之间是什么关系呢？可以这样理解.dwt文件是针对前台每个显示页面的模板“框架”，而.lbi模板中则是对页面中公共“内容”的整理，每个.lbi文件都是页面中的一个模块。二者是怎样关联到一起的呢？在模板文件夹中有一个libs.xml文件，这里则是具体配置每个模板“框架”中可以显示哪些“内容”（具体内容之后谈及模板管理会细说）。

下面查看解析模板的过程，在.dwt文件中根据框架的设计会划分出几个“可编辑区域”，.lbi模板正是加载到“可编辑区域”中进行输出的。那么我们需要注意的是.dwt模板中的几对标签：

①这对标签就是“可编辑区域”标签，在这对标签之间输出的内容是可以通过模板管理进行设置的。主要是选择输出不同的.lbi文件。

②这对标签则是对相应的page_header.lbi文件的加载及输出。这个头部的模板每个页面都需要加载，如果我们想更改模板中的头部内容，只要修改page_header.lbi即可，大大提高了效率。

模板文件加载完成之后，即可通过smarty引擎解析smarty标签，完成模板的输出。

模板修改

经常可以看到ecshop的dwt文件里面有“和”这么一段代码,有很多朋友误认为只是注释代码，这里首先来介绍一下#BeginLibraryItem这段代码。可以看到后面有“page_header.lbi“这个.lbi文件是一个库文件，打开后发现里面就是一些html代码，index.dwt为模板，那么这个.lbi可以理解为模板index.dwt的子模板，.lbi专门供别的的dwt模板导入的子模板. 那么 TemplateBeginEditable这个又是干什么用的呢？很多人知道这个是可编辑区域的意思，意思就是在TemplateBeginEditable 和 TemplateEndEditable之间的位置是可编辑区域，具体的我们来举个例字。首先我们到ecshop 管理员后台的模板管理->设置模板里面可以看到以下这个

可以看到上面的默认选择了首页模板，假如当你将商品分类树选择为右边主区域点击确定之后清楚缓存，在刷新首页这是你会发现，原来的商品分类树从左边跑到右边了。在上面的下拉框中我们看到只有三个选择，右边主区域，左边主区域，广告位，如果你想多加几个选项，那么很简单，只要你在你要改的模板内多加上几个就行了，假如你要在index.dwt模板添加 “左上角主区域”，和“右下角主区域”，那么你可以在index.dwt 里面加入

这是你再到后台，模板设置里面看首页的选项中就有这个选项

下面我来讲解一下怎么制作自己的模板，我拿index.dwt为例，首先在\themes\default\下将index.dwt文件拷贝一份改名为home.dwt在<body>里面加一句话 "这是自己定义的home.dwt模板" 以方便调试, 同样在根目录下的index.php文件拷贝一份改名为home.php里面加一行 echo '这是自己定义的home.php'; 代码以便调试同时把$smarty->display('index.dwt', $cache_id);改为$smarty->display('home.dwt', $cache_id);然后清楚缓存在浏览器通过http://localhost/ecshop/home.php执行你会发现这个页面跟首页一样，只是多了一段 "这是自己定义的home.php 这是自己定义的home.dwt模板" 文字。当然home.php 和home.dwt 文件里面的内容可以自己定义.
当你再到后台模板管理->设置模板里面的选择模板下拉框选项中没有你加的home模板，这时你就要在\admin\includes\lib_template.php里配置一下。在代码”$template_files = array('index.dwt', “ 加上你的模板”$template_files = array('home.dwt','index.dwt',“ ，告诉系统有home.dwt这么一个模板,其次在$page_libs = array( 这个二位数组里面的 'index' => array( 这个数组拷贝一份，改名为home ，意思就是告诉系统你这个home模板里面可以导入哪些.lbi文件.这点配置还不够，你还要在\languages\zh_cn\admin/template.php语言包里面加一行$_LANG['template_files']['home'] = 'Myhome模板';代码.然后你再到后台模板管理->设置模板可以看到如下结果

你会发现下拉框中多了一个Myhome模板选项,当你点击旁边的确定按钮时会报错，这是因为你还有一个xml文件没修改，打开themes\default\libs.xml文件，将 <file name="index.dwt"> 节点内的代码拷贝一份把节点名改为<file name="home.dwt">这时你再来重复上次的操作点击旁边的确定，就不会报错了。

接下来我们制作.lbi库文件
首先我们在\themes\default\library\目录下新建一个home.lbi文件里面输入"这是我自的lbi文件"然后在\admin\includes\lib_template.php文件里面，你刚才新加的'home' => array(home数组里面添加你的home.lbi 既在这个数组末尾加'/library/home.lbi' => 0 同样像修改模板一样在\languages\zh_cn\admin\template.php 里面加入一行 $_LANG['template_libs']['home'] = 'Myhome库文件'; 代码这时你到后台模板管理->库项目管理你就会发现刚刚你加的库文件出来了。

里面代码可以自己修改

这时候你再到模板管理->设置模板->选择Myhome模板确定后，下面可以发现你要编辑的lbi出来了，

默认是非可编辑区库文件如果你要变为可选择项那么你可以到\themes\default\libs.xml文件里找到刚才你加的 <file name="home.dwt"><region name="左边区域">里面加上<lib>home</lib>你再回来看就可以了。记得要把后面对应的显示复选框勾选上，否则你保存不了你的选择。

这时你再来访问http://localhost/ecshop/home.php 你会发现 "这是我自的lbi文件" 文字出来了。

另外需要补充一下的

遵循如下3步骤
     1 在library 里面新建 lbi 文件，比如 phpsir.lbi , 请设置 777,到后台库项目里面就能看到和可以编辑 phpsir.lbi
     2 修改 admin/includes/lib_template.php 里面的 $page_libs 变量
     3 在 libs.xml 里面找对应模板dwt文件，里面写入 <lib>phpsir</lib>

到后台模板设置，就可以调整此块内容居于左右位置了