discuz模板制作方法.doc

模板制作方法 前言介绍 本文档主要收集了Discuz! 模板开发过程中的一些资料, 主要包括：html书写注意事项, Discuz! 模板语法规则, CSS扩展规则等一些开发文 档资料。概述了新建风格的详细流程和开发过程中需要注意的一些事项, 使您更加快捷高效的进行Discuz! 的模板前端开发工作。 HTML 对 HTML 标记参数进行赋值时，需使用双引号，例如： input type=”text” name=”test” value=”ok” / 非成对标记必须以“/”结尾，例如： input type= name= id= class= … / 语法缩进 在 Discuz! 的 *.html 模板文件中，由于模板源代码具备逻辑结构，故不考虑 HTML 本身的缩进，所有缩进均为逻辑上的缩进结构。缩进 采用 Tab 作为符号，不使用空格。例如： !--{loop $threadlist $thread}-- table cellspacing=”0” cellspadding=”0” border=”0” trtd$thread[message]/td/tr /table !--{/loop}-- 模板套系与风格区别 模板套系：统一的一类模板，集中放置并打包的系列。 风格：应用了某个模板套系下的模板展示方案。 风格管理中常量介绍 匹配模板：对应的模板套系。 扩展配色：在风格基础上，可供用户选择的配色方案，它对应 ./template/mytest/style/ 目录中的样式文件。全新创建配色方案 时，应在 ./template/mytest/style/ 目录中建立配色方案目录及 CSS 文件，如 t1/style.css 。（mytest 为模板标识） 默认配色：用户访问站点时，首先看到的配色方案。 默认表情分类：对应 ”后台 - 界面 - 表情管理“ 中所启用的表情。 界面基础图片目录：风格基础图片存放的目录，在 CSS 文件中使用 {IMGDIR} 的常量进行输出，在 Discuz! X2 版本之后的模板中 需要使用 $_G[style][imgdir]。 扩展图片目录：风格扩展图片存放的目录，在 CSS 文件中使用 {STYLEIMGDIR} 的常量进行输出，在 Discuz! X2 版本之后的模板 中需要使用 $_G[style][styleimgdir] 。 其他风格常量：以上没有提到风格常量，均可以在后台取得以花括号框选的常量用以在CSS文件中使用（X2以后的模板中均需 要 $_G[style]中对应的数组键值），涉及到CSS样式的动态变更，可以在修改对应设置如：正常字体大小 {FONTSIZE}:12px/1.5，则 直接修改程序运行中CSS缓存中的值。 自定义模板变量 - 新增：可以根据扩展需求，针对个性化的CSS进行全局的定义。 添加变量后, 即可在 CSS 文件中以{TESTCODE}形式调用。 模板目录结构 公共模板文件夹（内含大部分模板css）./template/default/common/ 论坛模板文件夹./template/default/froum/ 群组模板文件夹./template/default/group/ 空间家园模板文件夹./template/default/home/ 会员模块模板文件夹./template/default/member/ 首页模板文件夹./template/default/portal/ 首页模板文件夹./template/default/search/ 会员模块模板文件夹./template/default/userapp/ 扩展新模板 论坛模板文件, 默认放置在 网站根目录 /template/default/ 下, 如果想修改默认模板的话, 直接修改此文件夹下的模板即可。 Discuz! X 程序读取模板的流程为, 先读取当前模板套系目录下的模板文件, 如 yourstyle 文件夹下 common/header.htm 文件, 如果没有 这个文件, 则自动读取默认风格 /tempalte/default 目录下的 common/header.htm 文件。这里需要提醒一下, 扩展的风格不再需要原来 的 CSS 文件, 只需要新建一个以 extend_ 为前缀加源文件名的扩展 CSS 文件即可, 例如：extend_common.css 文件、 extend_module.css。扩展的 CSS 文件只需要加入扩展的 CSS 代码即可！这扩展代码将在生成缓存时, 自动追加到模板缓存文件中。 首先在 template/ 文件夹下新建一个 yourstyle 文件夹放置模板风格文件, 然后复制 default 下的 discuz_style_defa