ExtMail Template 模版修改说明.docx

ExtMail Template 模版修改说明.docx

《ExtMail Template 模版修改说明.docx》由会员分享，可在线阅读，更多相关《ExtMail Template 模版修改说明.docx（18页珍藏版）》请在冰点文库上搜索。

ExtMailTemplate模版修改说明

ExtMailTemplateIntro

版权声明：

本文版权归作者所有，如其他个人、第三方网站或媒体报刊等需转载全文或节选，为支持我们的工作，请务必注明如下信息：

∙文档所有者：

ExtmailDevTeam;

∙文章原始出处：

http:

//www.extmail.org/docs/Extmail_Template_Intro/

∙项目首页：

http:

//www.extmail.org

如果因此而给您带来麻烦，请您原谅，谢谢合作。

变更说明

∙

关于此文

∙版　　本：

1.00

∙作　　者：

Ray,Hezhiqiang

∙项目主页：

http:

//www.extmail.org

∙最后更新：

2008-05-31

本文档主要讲述Extmail的模板原理和Extmail模板的修改方法、语言包对应关系等，最后给出修改实例。

编写本文的初衷，是给希望修改Extmail界面元素或编写新的Extmail模板的网管/用户参考，本文采用了部分王鹏辉2007-06-17讲座资料。

本文档假设读者安装EMOS1.3（即Extmail安装目录为：

/var/www/extsuite/extmail），并具有一定的Unix平台/Linux平台系统经验，懂得常规的系统操作，如文件的删除、目录创建、改名和vi编辑器的基本使用以及具有HTML基础知识。

本文档所有内容均在EMOS1.3系统安装、测试通过，其它系统酌情修改对应文件的路径。

本文档由Extmail项目组负责解释，并根据Extmail项目的建设和发展，适时予以更新。

如手册与实际项目情况有冲突，以文档服从实际为原则。

文档目录

∙ExtMail模板系统介绍

∙ExtMail模板系统组成部分

∙ExtMail模板变量基础介绍

变量

块（blocks）

循环

包含（Include）

∙HTML页面、Perl程序和语言包对应关系

∙模板的创建流程

∙修改实例：

ExtMail登陆页面

页面Title

Logo

鼠标指向Logo的显示

技术支持和自愿捐助连接

欢迎词

页面底部信息

设定默认域名

修改IPsecurity为默认不选择

欢迎使用

POP3和SMTP设置信息提示

特点介绍

去除免费注册按钮

∙修改实例：

ExtMail首页

退出、关于、帮助链接

页底部信

项目新闻

天气预报

ExtMail模板系统介绍

为了能让不同国家的用户使用系统并且能充分展现使用者的个性化需求，Extmail在设计之初就充分考虑到了语言与界面的切换问题，发展至今已成为一个真正的多语言系统，并且能够方便的支持主题（界面）和多语言界面的更换功能。

ExtMail模板系统是以Perl的HTML:

:

KTemplate模块为核心（HTML:

:

KTemplate是由KasperDziurdz先生开发的一款功能强大的HTML代码解析模块，详细信介绍参见http:

//search.cpan.org/~kasper/HTML-KTemplate-1.33/KTemplate.pm），加上与之配合的多语言系统与模板文件，构成了完整的ExtMail模板系统。

此结构设计大大简化了模板开发的难度和压力，您无需掌握Perl、无需拥有太多的编程经验，只需依照现有的编码规则编制模板文件，就可以做出自己的个性化界面。

页面生成示意图

模板驱动流程

模板的驱动在业务层开始，当一个页面得到请求的时候，业务层通过数据层取得产生页面所需要的数据，然后从多语言系统中取得相应语言的翻译，加上此页面上相应的逻辑，所有信息通过Ext:

:

Template与HTML:

:

KTemplate传递给模板文件统一替换执行，生成最终可见的页面。

ExtMail模板系统组成部分

Ext:

:

Template

   Ext:

:

Template模块提供了HTML:

:

KTemplate的ExtMail接口，并且定义了HTML:

:

KTemplate在ExtMail中的Options；

Ext:

:

Lang

   Ext:

:

Lang是ExtMail的语言模块，作为多语言处理的接口，负责加载语言文件（Ext:

:

Lang:

:

）模块，并且提供一些方法和变量。

Ext:

:

Lang:

:

   Ext:

:

Lang:

:

为ExtMail多语言翻译文件包，以Hash表结构存储，定义了语言、编码、翻译字段等；

Html目录

   模板的HTML文件

Ext:

:

CGI

模块相应存放位置

模板HTML文件：

   /var/www/extsuite/extmail/html

   注：

默认HTML模板：

/var/www/extsuite/extmail/html/default

Ext:

:

Template：

   /var/www/extsuite/extmail/libs/Ext

Ext:

:

Lang

   /var/www/extsuite/extmail/libs/Ext/App

Ext:

:

Lang:

:

   /var/www/extsuite/extmail/lang

Ext:

:

CGI：

   /var/www/extsuite/extmail/cgi

ExtMail模板变量基础介绍

变量

模板变量是形如:

<%VARFOO%>的标签，VARFOO如果是大写变量则为程序变量，包含的是由程序输出的内容，小写变量为语言包中的变量，主要用于多语言环境、翻译等。

例：

abook.html中：

此处即为模板变量，因为小写所以是语言包变量。

该变量在zh_CN语言包文件中被赋值为：

meta_title=>'WebMail通讯录'；

在en_US语言包中被赋值为：

meta_title=>'PersonalAbook'；

由此不同语言环境在abook.html中看到的TITLE有所不同；

块（blocks）

在模板中，还存在大量的诸如IF…ELSE…END这样的逻辑块（blocks），这些块可以实现某些特定需求，比如根据用户不同，显示不同的文字内容，或者循环显示、打印一些内容，如表格或段落等。

每个块以开始，以大家可以发现，块的起始和结束其实就是HTML代码中的注释:

）

Extmail模板中支持的块名目前有：

A. IFELSEEND（条件选择1）;

B. BEGINEND（循环）;

C. UNLESSEND（条件选择2）;

D. IFEND（条件选择3）;

条件选择1

--IFVARFOO-->

如果VARFOO为真，则显示这段文字

--ELSEVARFOO-->

VARFOO为假，显示这段文字

--ENDVARFOO-->

在程序中，VARFOO这个变量如果为真，则显示蓝色的内容，否则显示红色的内容。

条件选择2

--UNLESSVARFOO-->

只有VARFOO为假才显示这段内容

--ENDVARFOO-->

在程序中，VARFOO这个模板变量只有为假时，才显示上面块之间的内容。

条件选择3

--IFVARFOO-->

如果VARFOO为真则显示这段内容

--ENDVARFOO-->

在程序中，模板变量VARFOO如果为真，就显示上面这段文字内容

循环

--BEGINLOOPVAR-->

这个是循环<%COUNT%>

--ENDLOOPVAR-->

循环是一个特殊的块，它能循环显示内容，并且每次循环内还可以嵌套变量。

如上面的例子中，如果程序在循环时改变COUNT的内容，则可以看到诸如：

这个是循环1

这个是循环2

这个是循环3

这样的内容。

在目前系统模板里，大量使用了循环，以显示如：

邮箱列表，邮件列表，帐户列表等可变的信息。

建议：

对于不熟悉这些块（blocks）的用户，不要随便修改块逻辑，而仅仅修改HTML或普通变量（这种形式）。

并且修改时还应该保留一份能用的backup。

包含（Include）

模板引擎还支持包含特性，即通过INCLUDE指令，将另一个模板包含进来，合成一个大模板。

在建立页面时，会有一些部分每个页面都需要的，比如说邮箱列表，或者导航条等，利用这个特性，可以将公共部分放到一个小模板里，然后在其他模板里INCLUDE就可以了。

语法：

--INCLUDE‘other.tpl’-->

例:

在模板中的

--INCLUDE‘TOP_BAN.html’-->就是包含了顶部的导航条。

HTML页面、Perl程序和语言包对应关系

模板HTML文件、Ext:

:

Lang和Ext:

:

Lang:

:

之间的对应关系如下（其中*.html为模板HTML文件，*.pm为Ext:

:

Lang，%*为Ext:

:

Lang:

:

具体目录参见：

模块相应存放位置）：

index.html =>  Login.pm

abook.html =>  Abook.pm

folders.html=>  Folders.pm

pref.html =>  Pref.pm

compose.html=>Compose.pm

filter.html => Filter.pm

globabook.html=>GlobalAbook.pm

netdisk.html => NetDisk.pm

readmsg.html => Message.pm

welcome.html => Folders.pm

Login.pm=>%lang_login =>  登陆页面

Abook.pm=>%lang_abook =>  通讯录—个人地址本

Folders.pm=>%lang_folders =>  首页、收件箱

Pref.pm=>%lang_pref   =>   偏好设置-常规设置、POP3取信帐号

Compose.pm=>%lang_compose =>  写邮件

Filter.pm=>%lang_filter   =>  偏好设置-过滤器设置、自动回复设置、白名单、黑名单

GlobalAbook.pm=>%lang_globalabook =>  通讯录-全局地址本

NetDisk.pm=>%lang_netdisk  =>  网络磁盘

Message.pm=>%lang_readmsg  =>  读邮件

App.pm=>%lang_global

模板的创建流程

目录结构

在ExtMail根目录的html文件夹下创建自己的模板文件夹mytemplate

必要文件

按照default模板的文件目录结构创建出相应的模板文件

开始创建

撰写html/JS/CSS等等文件

启用新模板

修改webmail.cf

SYSUSERTEMPLATE=mytemplate

修改实例：

ExtMail登陆页面

创建和修改ExtMail模板在技术上是一体的，但是如果不会修改模板，创建就无从谈起。

下面我们通过修改ExtMail的登陆页和首页来说明如何修改。

注：

本例中以修改简体中文语言为主，如果您使用的是改其他语言，请修改相应文件；

本例均以ExtMail为说明，ExtMan的结构和修改大同小异，请自行对照修改；

 1.   页面Title

修改文件：

/var/www/extsuite/extmail/lang/zh_CN

修改位置：

%lang_login=（

meta_title=>'欢迎使用ExtMail',

 2.   Logo

修改文件：

/var/www/extsuite/extmail/html/default/images/logo.gif

修改内容：

替换成需要的Logo图片文件

注意：

替换图片之后需要重新设置权限。

Root：

读取，root：

只读，只读。

 3.   鼠标指向Logo的显示

修改文件：

/var/www/extsuite/extmail/html/default/index.html

修改位置：

//www.extmail.org/"target=_blank>

 4.   技术支持和自愿捐助连接

修改文件：

/var/www/extsuite/extmail/html/default/index.html

修改位置：

//www.extmail.org/support/<%LANG%>/index.html"target="_blank"><%support_link%>|

middle"src="/extmail/images/donate.png">

//www.extmail.org/donate/"target="_blank">

#5678A6"><%donate%>