你现在的位置:首页 > PHP网站建设知识库 > ecmall > 正文

ecmall模板制作教程大全

模板技术在PHP网站建设中比较流行,几乎所有的开源PHP建站系统都会用到模块技术,好处是方便样式的维护。这篇文章是ecmall模板制作的入门级教程,希望看完后朋友们对ecmall模板有一个比较系统、深入、直观的认识。
 
一.先了解一下ecmall模板文件的列表,模块目录和文件起什么作用的。

theme/   主题目录

商城模板
theme/mall/   包含所有商城模板,里面的每个目录即为一套模板
theme/mall/default/  商城默认模板,里面的html文件是模板文件,theme.info.php 主题信息配置
theme/mall/default/styles/  皮肤目录,里面每一个目录即为一套皮肤
theme/mall/default/styles/default/ 默认皮肤目录
style.info.php 皮肤配置信息
screenshot.jpg 主题截图
preview.jpg 主题预览图

店铺模板
theme/store/ 包含所有店铺模板
theme/store/default/ 默认店铺模板
theme/store/default/styles/ 皮肤目录,里面每一个目录即为一套皮肤
theme/store/default/styles/default/ 默认皮肤目录
style.info.php 皮肤配置信息
screenshot.jpg 主题截图
preview.jpg 主题预览图

先学习一下与模板相关的几个概念

1.主题

严格意义上来讲,大家常说的一套模板,在ECMall中被定义为一个主题。一个主题是一套模板和一套皮肤的组合,这可能跟其他某些开源产品有所区别。一套模板可以对应多套皮肤从而形成多个主题。比如 默认模板+粉红皮肤 = 默认粉红主题,默认模板+淡蓝皮肤 =默认淡蓝主题,这样就能在网站后台(设置->主题设置)看到这两个主题。模板和皮肤的概念我接着往下说。

2.模板、皮肤

模板负责决定页面中都由哪些数据、信息构成。
从网页制作角度来看。模板就是一系列HTML网页文件构成。
皮肤负责决定页面中的数据、信息如何展示给用户。
皮肤就包含图片、层叠样式表CSS、JAVASCRIPT等。
如何找到当前页面对应的模板文件

注意:

强烈建议不要修改默认模板,否则以后升级会很麻烦。如果要修改我们可以新建一套,然后在后台启用新主题
在制作模板前先掌握摸清模板的藏身之处是很得力的,知己知彼百战不殆,废话少说了,动真格的,举例给大家说明。

例一:分析注册页面对应哪些模板文件
通过首页点注册进入注册页面,发现地址栏的地址为(需要关闭伪静态功能):
引用:
http://www.phpstudio.info/demo/index.php?app=member&act=register&ret_url=
前面的http://www.phpstudio.info/demo/是网站访问的路径这个不用多说,
这里的index.php就是网站根目录那个index.php文件,这个是php程序文件,在ECMall中是系统入口文件,所有前台页面必须通过这个入口进行访问(当然后台也有入口admin/index.php)
我们分析模板要看的是app和act两个参数:这里的是app=member和act=register。
这里的app、act代表什么含义呢?
app是英文单词application的缩写,意思是“应用”,那么这里我们访问的就是一个叫member(意为会员)的应用
act是英文单词action的缩写,意为“行为”,那么这里我们访问的就是member应用的register行为
引用:
插播广告
通常情况下
如果地址栏没有app,那么app默认为default
如果地址栏没有act,那么act默认为index
app是放到app目录下的。进去之后发现有个member.app.php,这个文件就是我们要找的注册页面对应的app文件。
打开member.app.php,文件里面是php程序代码,通过搜索“function register”我们就找到了register act即会员应用的注册行为。
这里function register开始是定义函数的代码,我们需要找到结束位置。我们在这个函数内就能找到这段代码
引用:
$this->display('member.register.html');
这里单引号中间的“member.register.html”就是模板文件名了。
ps:可能同学们很多不是做程序的,如果你很难判断这个function register函数代码哪里是结束,可以借助有折叠功能的编辑器。

现在我们得知了模板文件名。那么这个文件在哪里呢?
有了上头对模板分布的基础认识,可以下结论其实可能性就两个,themes/mall/default(默认商城模板目录)或themes/store/default(默认店铺模板目录)。
到了这一步,其实很简单了。我们可以根据页面的含义来找。这里的注册行为是商城的功能,所有当然在商城模板目录。这样模板位置我们算是找到了,很简单吧。

让我们来看看这个member.register.html的庐山真面目。
打开后我们看到了大部分模板都有的这样的结构
复制内容到剪贴板
代码:
{include file="header.html"}
......
{include file="footer.html"}
首尾都有{include file="xxx"}这样的模板标签,这代表这个模板含有嵌套模板,我们当前的这个模板嵌套了两个模板header.html和footer.html,他们的位置与member.register.html同级目录的。
到目前为止已经教给大家一种比较通用的找模板的方法。通过这种方法你可以应付大部分情况了。
希望大家通过这个教程能对ECMall模板有个全局的认识。强烈建议经常问“这个页面的模板在哪里”的同学认真看看。

二.如何新建一套商城主题。

第一步:复制默认主题

进入theme/mall/目录,找到default目录 复制一个复件,重命名,起一个我们想要的名字“mytheme”

\

第二步:修改主题配置

进入刚刚复制的那个文件夹(mytheme)里面,打开theme.info.php文件
上面这段代码是主题的配置信息,其中
version:主题版本,主题作者自行设定版本号
author:主题作者
description:主题描述。
请自行进行修改,修改好后保存。如果你的版本是UTF-8的需要在保存时用文件菜单里的“另存为”,选择UTF-8编码,这时弹出的提示是否替换,选择“是”。

第三步:修改预览图和缩略图

主题预览图在themes/mall/mytheme/styles/default下
这里我们的新主题只有一套默认皮肤,如果再复制styles目录下的default文件夹,重命名为newstyle,这时我们就得到了由一套模板和两套皮肤组成的两套主题了。这里再次巩固一下上面讲到的ECMall主题的定义。
第四步:启用新主题
进入后台“设置”-->“主题设置”,发现我们新建的主题显示出来了 
点击“应用”后。即可切换到我们自己的主题了。

ecmall模板制作一定要在新建的空模板上完成,避免修改默认模块后不能恢复。