

当前位置:首页>>Discuz学习教程
Discuz!前端模板入门教程
点击数:1409 更新时间:2017-05-25 13:38:01 来源: 昕竹轩网站设计-【返回】
认识默认内置的模板套系
首先,我们必须先来看看默认内置的这套模板套系。这套模板将是我们学习和扩展模板套系的先决基础。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.phpmod=viewthread,和home.php脚本所访问的页面)页面当中,已减少css冗余。
/** end **/
只在指定的当前访问脚本地址CURSCRIPT::$mod单独加载,例如:forum.phpmod=forumdisplay
如何制作模板套系风格
了解了以上内容之后,大家就可以开始扩展制作自己的模板套系风格。
1、首先我们需要在template/文件夹下新建一个yourstyle文件夹放置模板文件,然后复制default下的 discuz_style_default.xml,重命名为discuz_style_你的风格名称.xml(注意这里discuz_style_是必须保留的)。这个文件配置的即是下图中后台显示的配置区域中的变量内容。

2、修改文件中以下四个参数

另外我们复制的配置文件中需要我们特别注意的就是以下两个参数:

实例如下图:
1. 在template下新建一个文件夹,放置扩展的模板套系文件。






Diy 功能介绍:
Diy 功能是帮助网站管理人员通过前台点击操作,快速调用网站数据的一种便捷功能,能够让网站管理人员在不用自己手动编写代码的情况下快速调用自己网站的特定条件下的数据到页面指定位置的功能!
Diy 使用指南:
如果你想在一个页面进行diy 数据必须注意以下事项:
1、页面上必须存在可diy 区域。默认模板套系中内置了很多可diy 的区域。但是如果没有你需要加入如下形式的可diy 模板标签。
< !--
注释:两部分必须一致,且页面中此id 标识要唯一,如果你想在指定的地方调用diy 数据,就在对应的模板相应位置处添加diy 标签代码。
2、页面中必须有 (style id="diy_style" type="text/css") (/style)代码。
注释:这段代码是用来存放diy 时的样式设置,没有无法写入。
对于已经满足条件的diy 页面我们可以按照下面步骤进行 diy 数据的调用:
首先管理员登录后点击进入diy 模式:

(1) 点击 添加框架 先添加框架。
(2) 可拖拽区域中有框架后,然后点击 添加模块


这些模版 后台-》门户-》模块模版进行管理。
在这里你可以自己定义展示获取数据的模板, 只要在它对应的分类里按照特定分类对应的模板格式进行修改即可。

本资讯信息是来自 昕竹轩工作室 小编 通过网络收集而来的关于discuz网站开发,使用、安装、架设相关的学习资源。
您若也有需要分享的可以直接在我们网站上分享你的内容,让大家都知道。
版权声明,本活动信息隶属网络收集而来若有侵权请联系我们,我们将及时清除信息。
广告位
【必备推荐】(Top) 返回页面顶端
【精品案例】更多案例展示
【最新留言】
(Top) 返回页面顶端
登录 |
免费注册 |
忘记密码 |
邮箱:CSW8923@126.com
服务电话:17895923895 客服QQ:568441621 
Copyright © 2014-2015 Htmcss.Com All Rights Reserved 版权所有昕竹轩网站设计 备案号:闽ICP备16024510号-4

Copyright © 2014-2015 Htmcss.Com All Rights Reserved 版权所有昕竹轩网站设计 备案号:闽ICP备16024510号-4
你设置的联系邮箱是*: (当有人给你留言回复之时,联系邮箱可以及时通知你)
我们建议你填写正确的邮箱地址,如果你之前填写邮箱地址是错误的可以通过 【修改资料】 来重新设置