Discuz!前端模板入门指导

王朝学院·作者佚名  2016-08-22
窄屏简体版  字體: 小  |  中  |  大  |  超大  

为了能更形象的描述模板制作的原理和基础构造,我们做一个整体的比喻:Discuz! X 好比一个人,我们提供的程序架构就好比一个人的骨架和整体器官,模板就好比是这个人穿的一套衣服。Discuz! X 默认内置一套模板,模板扩展机制就是一套针对Discuz! X 的服装制作标准。根据这个标准可以给Discuz! X穿上你量身制作的衣服。下面我带领大家了解一下这套标准的整体架构和机制。

认识默认内置的模板套系

首先,我们必须先来看看默认内置的这套模板套系。这套模板将是我们学习和扩展模板套系的先决基础。Discuz! X 默认的模板全部统一放在网站根目录下./template/default/,当你全新安装一个Discuz! X 社区论坛之后,你看到的所有论坛界面的源html文件都是存放在这个目录下面的。这个目录下面同样按照模块功能将每个模块用到的模板都单独做了分类,分别放到对应的模块模板文件夹下面。下面是对每个文件夹的概括介绍(以Discuz! X2.5为例):

1、公共模板文件夹(内含大部分模板CSS样式文件)./template/default/common/。

提示:包含header.htm,footer.htm,pubsearchfrom.htm等公共模块模版文件和css文件。

2、论坛模板文件夹./template/default/froum/。

提示:包含论坛首页discuz.htm,帖子列表页forumdisplay.htm,帖内容页viewthread.htm模板文件等。

3、群组模板文件夹./template/default/group/。

提示:包含group.htm浏览群组时的模板,group_index.htm群组首页模板等模板文件等。

4、空间家园模板文件夹./template/default/home/。

提示:包含space_home.htm空间,home页模板文件,space_header.htm空间头部模板文件等。

5、会员模块模板文件夹./template/default/member/。

提示:包含登录login.htm,register.htm册,getpassWord找回密码模板文件等。

6、首页门户、频道、专题的模板文件夹./templatedefault/portal/。

提示:模板文件夹!view.htm 查看页面,comment.htm 评论页面模板文件,index.htm门户首页模板文件等。

7、排行榜模板文件夹./template/default/ranklist/。

提示:包含member.htm用户排行模版文件,activity.htm活动排行模版文件等。

8、搜索模板文件夹./template/default/search/。

提示:包含搜索结果页footer.htm尾部模版,thread_list.htm帖子搜索结果展示模版等。

9、网站扩展配色模板文件夹./template/default/style/。

提示:默认内置5个扩展配色模板。

10、tag模块模板文件夹./template/default/tag/。

提示:包含论坛标签展示页面tag.htm。

11、会员模块模板文件夹./template/default/userapp/。

提示:包含娱乐广场(云平台开启漫游应用)首页userapp_index 模版文件等。

12、网站初始化模板配置文件discuz_style_default.xml。

13、大小两张预览图PReview.jpg和preview_large.jpg。

以上为内置默认模板套系的文件目录结构,这些静态的html构成了Discuz! X 看到的默认展示样式。另外这套模板套系中出现的文字,都统一存储在语言包当中网站根目录./source/language下,一般是不需要修改的。

Discuz! X模板扩展机制的3点注意事项

通过上面的介绍我们对默认的内置模板已经有了一个大体的了解,那么我们如何去扩展一套新的模板以更加个性化展示我们的网站呢。这里你就需要对Discuz! X 默认的模板扩展机制有个基本的解了。以下使我们必须清楚的:

1、任何扩展模板都是以内置默认模板套系为基础的!例如:

我们要新建一套yourstyle扩展模板套系。Discuz! X程序读取模板的机制是,读取当前模板套系目录下的模板文件,如yourstyle文件夹下common/header.htm文件(扩展的模板套系的文件夹目录结构、名称和文件名要对应默认default),如果yourstyle扩展模板套系没有对应文件夹目录下的对应文件,则自动读取默认风格 /tempalte/default目录下的common/header.htm文件。默认风格/tempalte/default相当于我们的基础模块,如果我们不用修改这个模块模板,我们就不必要在重新去生成这个地方的模板了!

2、扩展的风格不再需要原来的css文件,只需要新建一个以extend_为前缀加源文件名的扩展css文件即可,例如:

extend_common.css文件、extend_module.css这里面只需要加入你自定义的扩展css代码即可,这部分代码将在生成 css缓存时和默认的default模板文件夹下的对应css文件中的代码一起解析生成新的当前模板样式文件。

3、module.css文件的模块化分部加载css!需要完全按照现有格式进行扩展,例如:

/** forum::viewthread,home **/

这里的css代码将会加载到指定的(即forum.php?mod=viewthread,和home.php脚本所访问的页面)页面当中,已减少css冗余。

/** end **/

只在指定的当前访问脚本地址CURSCRipT::$mod单独加载,例如:forum.php?mod=forumdisplay

如何制作模板套系风格

了解了以上内容之后,大家就可以开始扩展制作自己的模板套系风格。

1、首先我们需要在template/文件夹下新建一个yourstyle文件夹放置模板文件,然后复制default下的 discuz_style_default.xml,重命名为discuz_style_你的风格名称.xml(注意这里discuz_style_是必须保留的)。这个文件配置的即是下图中后台显示的配置区域中的变量内容。

 
 
免责声明:本文为网络用户发布,其观点仅代表作者个人观点,与本站无关,本站仅提供信息存储服务。文中陈述内容未经本站证实,其真实性、完整性、及时性本站不作任何保证或承诺,请读者仅作参考,并请自行核实相关内容。
 
© 2005- 王朝網路 版權所有 導航