discuz模版制作

模板制作前请将你的界面设计好,并制作成html+CSS的格式。

这里我就以大魔王的“蓝色经典”作为样版(知识共享,希望大魔王不要介意,如有侵权,请及时通知我)。

效果图如下:(图1)在开始前,先了介绍一下discuz!的几个模板文件:1、 header.htm --------------------------------------页面头部2、 discus.htm---------------------------------------------------------------论坛首页3、 footer.htm---------------------------------------------------------------页面底部4、 viewthread--------------------------------------------------------------查看帖子内容discuz!论坛的页面通常是几个模板文件共同作用下达到的效果,如图1就是header.htm+discus.htm+footer.htm这三个文件共同作用的效果。

(图2)Footer.htm对应的是:(图3)剩下的就是discuz.htm文件显示的了。

当然你要将首页显示的效果就制作成一个文件模板也是可以的,这里之所以分开,是因为header.htm和footer.hmt文件通常还会被其它的模版文件引用。

也就是说,其它的页面(比如发贴的页面)的头部、底部与首页的头部、底部完全一样,分开来写就可以达到重复利用,减少劳动的效果。

下面我们就开始制作:首先,现在我要制作的这套模板叫test,那么我就在templates目录下建立一个test目录。

在test目录下再新建一个images文件夹用于存放这套模板的图片,把切好的所有图片保存到这个文件夹中。

templates/test文件夹用于存放这套模板的htm文件,在这个目录中新建三个文件header.htm、discuz.htm、footer.htm,打开你设计好的主页html文件,将你想作为头部的那一段代码复制粘贴到header.htm文件中,相应的将作为底部的那一段代码复制粘贴到footer.htm文件中,其余的代码复制粘贴到discuz.htm文件中。

最后在discuz.htm文件的最顶部和最底部分别加上:{subtemplate header} 和{subtemplate footer}这两句算是discuz的语言,意思是将header.htm和footer.htm文件包含进来,这样就构成了一个完整的主页面了。

接下来的工作要在论坛后台设置中来完成(1)进入论坛点击“系统设置——> 界面——> 模板管理”,在新增模板后填入模板名称,模板文件所在目录,板权信息然后提交即可!如图4:(图4)(2)在“界面——> 风格管理” 中,在新增界面风格后填入方案名称“test”然后提交即可!(3)提交方案名称后,您就可以在界面风格中看到您所定义的新的风格方案。

如下图:(图5)注意上面用红色圆圈圈起来的那幅模版预览图,你的是不是没有显示出来?这需要将你的首页的效果图做成110x120并命名为preview.jpg,将这图片放到test目录下就可以了。

到此,一套新的风格模板方案就添加到模板库里了,但还不是我们需要的最终效果,接下来要对模板文件继续进行调整,以达到想要的最终效果(4)点击 [编辑] 后就可以进入该模板的风格配色方案的编辑页面,按照图6把各个对应参数填入相应位置。

(图6)填写好后,点击“提交”,更新一下缓存,浏览论坛首页出现下图:(图7)呵呵,有内容出来了,可是排版上却变得乱七八糟了,这是因为还没有引入CSS文件。

这时将原来设计好的CSS 文件放到你模板目录下(templates/test),并将它重命名为“css_append.htm”(注意:改后的文件名是css_append,后缀名是htm)。

接着打开header.htm文件,找到你引入CSS文件的语句,这会因为引入的语句不同而不同,我这里是<style type="text/css">@import url(css/style.css);</style>将这个替换为:$rsshead$extrahead{subtemplate css_script}这样就可以将你的CSS文件引入了。

进入后台更新一下缓存,现在的效果图如下:(图8)这样就整齐了许多,这时你是不是发觉少了点东西?没错,图片没有显视出来。

下面我们先将背景图(也就是CSS文件中引入的图片)显示出来。

打开css_append.htm文件,找到所有你引入图片的地方,将路径替换为“{STYLEIMGDIR}”。

例如:这里有一句:#footer{padding:1em 0;background:url(images/footer_bg.gif) }将它改为:#footer{padding:1em 0;background:url({STYLEIMGDIR}/footer_bg.gif) repeat-x top;} {STYLEIMGDIR}实际上是discuz的一个变量,当模板被解释时,就会用一个值来替换这个变量,这个变量的值可以在后台设置。

进入后台后点击“界面——> 风格管理”出现下图:(图9)找到你正在制作的test风格,点击“编辑”按钮,出现下图:(图10)看到了吧,当模板被解释时,就会用上面所填的路径来替换这个变量。

好了,现在更新缓存再看一下效果:(图11)哈哈,和原来设计的效果图一样了,是否有一种成功的喜悦?虽然,到这里已经迈出了成功的一步,但革命尚未成功,同志仍需努力!现在制作的模版是静态的,也就是说就算你发贴了,里面的内容也不会改变的,甚至你点个连接都会出错的。

下面我们就来让它“动”起来。

一、修改头部文件header.htm1、打开正在制作的模板header.htm文件(以下简称header.htm),以及默认模板templates\default 的header.htm文件(以下简称“默认header.htm”)。

2、将header.htm文件的标题用 $navtitle $bbname $seotitle 来代替。

例如:我这里是:“<title>搜球论坛</title>”改后就变成了“<title> $navtitle $bbname $seotitle </title>”3、看header.htm里是否有类似“<meta name="keywords" content="" />”这样的语句,有就删除。

然后,将默认header.htm里的以下语句:<meta name="keywords" content="{$metakeywords}$seokeywords" /><meta name="description" content="$metadescription $bbname $seodescription - Discuz! Board" /> <meta name="generator" content="Discuz! $version" /><meta name="author" content="Discuz! Team and Comsenz UI Team" /><meta name="copyright" content="2001-2009 Comsenz Inc." /><meta name="MSSmartTagsPreventParsing" content="True" /><meta http-equiv="MSThemeCompatible" content="Yes" /><meta http-equiv="x-ua-compatible" content="ie=7" />复制粘贴到header.htm文件相应的位置(注这些对界面没什么影响,但对SEO优化有帮助)4、将默认header.htm里的以下语句:<script type="text/javascript">var STYLEID = '{STYLEID}', IMGDIR = '{IMGDIR}', VERHASH = '{VERHASH}', charset = '$charset', discuz_uid = $discuz_uid, cookiedomain = '$cookiedomain', cookiepath ='$cookiepath', attackevasive = '$attackevasive', allowfloatwin = '$allowfloatwin', creditnotice = '{if $creditnotice}$creditnames{/if}', {if in_array(CURSCRIPT, array('viewthread', 'forumdisplay'))}gid = parseInt('$thisgid'){elseif CURSCRIPT == 'index'}gid = parseInt('$gid'){else}gid = 0{/if}, fid = parseInt('$fid'), tid = parseInt('$tid')</script> <script type="text/javascript" src="include/js/common.js?{VERHASH}"></script> 复制粘贴到header.htm文件相应的位置(至于这些有什么作用,自己查一下吧)5、将头部的logo“动”起来(图12)找到显示logo的地方,我这里是:<div class="logo"><a href="index.php">搜球论坛</a></div>将“index.php”和“搜球论坛”分别用$indexname和$bbname代替($indexname 是首页文件名的变量,$bbname 是论坛名称变量,其它相同的地方都可以用这两个变量作替换,以增加模版的适应性。

合集下载

discuz模板制作教程精品

discuz模板制作教程精品

一、如何在模块中增加“标题”及“更多”的链接如下图样式方法:通过框架或模块都可以实现上述样式,我们以框架为例,我们在DIY的时候选中要编辑的框架点击编辑如下图所示之后点击标题在弹出的层中可以添加标题及链接,位置选择居左如下图所示同时可以设置标题的颜色及大小接下来增加“更多”的链接点击弹出层的添加新标题按扭如下图所示,会“复制”出一份新的标题你只需修改就可以了把其中的“精彩教程” 改成“更多” ,链接以及字体、颜色都进行修改就可以了,这里的位置一定要选择“居右”完成,这样框架就有了标题及更多,模块的方法同上二、DIY的模块中如何调整链接的颜色如下图样式方法:选中要修改的模块,点击编辑,选择数据如下图所示在弹出层中选择编辑如下图所示在弹出的层中可以对标题进行加粗、斜体、加下划线、修改颜色等操作完成三、如何在现有的模块中添加新的数据选中要添加数据的模块点击编辑--数据如下图所示在弹出的层中选择任意一条数据点击编辑如下图所示点击编辑后在弹出的层中选择从数据源获取此处可以添写帖子ID、文章ID、日志ID、图片ID 来获取数据如下图所示点击获取会填充模块内相应的数据字段(此处的数据字段会根据模块样式的不同有所变化,请注意)完成四、DIY时如何调用外部程序的数据当我们与第三方程序整合后如何在门户、频道、论坛、或可以DIY的区域调用这些第三方程序的数据首先我们可以在需要调用的地方拖一个展示类中的静态模块如下图所示如上图所示选择数据来源为“自定义HTML”一般第三方系统的数据调用都会有输出JS格式的我们把第三方程序提供的JS代码粘贴进HTML代码框就可以了如下图所示完成五、首页多格或首页四格如何DIY出来我们以论坛首页为例(在任何页面都可以)来制作一个首页四格首先在论坛首页拖一个1:1的框架如下图所示接下来向已拖好的1-1框架的框架里左侧的1 里面拖入一个1:1的框架如下图所示接下来向右侧的1里面也拖入一个1:1的框架如下图所示接下来我们就可以通过拖拽模块到框架中去了此时我们可以去掉框架的标题,同时为每一个模块增加一个标题如下图所示你可以通过不同的模块样式或者CSS来美化这里完成六、如何修改整个模块的链接样式比如下图方法:选中要编辑的模块,点击编辑--样式进行修改如下图所示以上修改针对整个模块完成七、如何修改两个模块或两个框架之间的距离如下图样式选择要编辑的框架或者模块,点击编辑--样式选择外边距,勾选分别设置,在右边距中写入合适的数字就可以了例如10如下图所示完成后的效果如下图样式完成。

discuz模版教程

discuz模版教程

第1步:进入版块内点击右上角的DIY(如下图,注:静态化无法DIY,请取消静态化)第2步:拉好框架(先放3:1的,再将后两个框架放入其中)如下图所示(下面说的都无需再拉多个框架,这一步已把该拉的红框都拉好了):第3步:设好红框(就是指向出现红色的框架,在这我将其称为红框)的样式参数(如下图,对比看说明)图中1:边框,请将默认的【大小】改成0(因为这样不会显示边框线,不选则会显示官方默认的边框线)图中2:边框一定要为0,这样是最大化,0和不填是不一样的!图中3:边框一定要为10,这样是和下方框体的距离,若填0则会连在一起!图中4:此处请一定不要选择【无边框框架】否则你用TAB框架则在标题加链接时会成白色,留空不选即可!第4步:先DIY右边的。

请拉一个红框的框架到图中右边的框架内,然后点击样式,如图:图中1:边框线颜色为:1PX。

我用的是粉红色!根据自己的爱好选色!图中2:上为0(但官方默认的是1PX的距离,所以该处请填0,其它的请设置为1)第5步:红框的边框线,粉红的(如下图)图中1:请设为4PX(想更粗请设大点)图中2:左10PX(是与左边的框架保持10PX的距离,要不会连在一起)第6步:拉一个论坛类的帖子模块放在上一步设置好的红框内,点样式设置参数(如下图)图中1:链接字体,12PX是官方默认的,可以留空。

后面的是字体颜色!图中2:请选边框为0,也可以留空(这里和红框不一样,留空也不会有官方的默认边线)。

图中3:外边距设置和内边距有所不一样,自己理解,请看图中设置,假如你把图中右10PX 输入到下面的内边距的话,标题就偏了~最好这样搞!图中4:内边距的下2PX是为了对平左边框架,所以才设置为2,你可以根据右边的边框线对平(这里请善用QQ截图功能,最后我会教你如何用QQ截图进行DIY较正)第7步:标题,我在这用的方法是不正规设置方法,主要是考虑到美化,用的是图片(看下图)图中1:你看错了,那不是空的,是在智能ABC(我打五笔的)输入V+1这是空格白键,无字体的,但是会有字体一样,因为官方是默认无字体的话是无法设置标题的,所以用这招骗过官方!图中2:图片路径,为不平铺!0K,左边的DIY完成,先讲到这,顶的人多,再教你DIY另一边的~最后说一下我DIY用到的常用工具:1:QQ截图,我设置了快键(ALT+Q)方便截图及对齐边框,效果如下,自己理解。

Discuz X2模板制作指南

Discuz X2模板制作指南

默认风格图片扩展及其他参数
• 其他xmL的参数都是记录的默认风格的初始配置参数。 下面我重点要说的是,关于扩展图片的问题! 注意:我们在做的时候尽量保持精简干净的原则,不要重新设置imgdir这个参数,只需要 重新指定一下扩展目录就可以了。我们自己的图片单独放到这个文件目录就可以了。 <item id="imgdir"><![CDATA[template/cznnw_v8_dzx/www_cznnw_com]]></item>
这样一套最简陋的完全copy默认套系模板下 过的模板便制作完成了!
复制完毕开始折腾吧
以上xml文件建立后,我们自己的模板就成型 了,下面我们在原有模板的基础上开始我们 自己的模板制作吧!
开始折腾
我们选择刚刚新建的新套系模板为默认模板,这是我们就可以,以默认模板为基 础修改我们自己的默认风格了。 所有的静态展示htm文件,你可以进行修改了。比如最常用的里只是,我们要修 改论坛首页,这个页面放置在template/default/forum/discuz.htm文件中。 我们变可以再我们新建的默认模板下面,新建一个forum文件夹然后将,默认的 discuz.htm拷贝到我们刚刚建立的forum文件夹。根据discuz默认的机制,先读取 当前模板套系的文件,如果没有则引入默认的模板文件。 Common文件夹是我们经常用到的默认的常用公共文件的存储地。 在这里我们扩展css的时候,只要新建一个extend_XXX.css文件,他就会在解析的 时候自动追加到对应的css文件底部。所以大家不要再重新copy一个多余的css文 件到这里了。
3、引入自己diy的css代码 <link href="$_G['setting']['csspath']template/default/portal/index/styl e/style.css" rel="stylesheet" type="text/css" />

模版风格的制作导出及安装入门讲解说明

模版风格的制作导出及安装入门讲解说明

(5)在制作界面方案 navy blue 的时候作者自定义了几个 css,主要是用来控制用登陆信息部分的文字颜色、 背景,为了方便调整,将这些颜色和背景图片通过后台定义成变量。({HMIMG1}-menu_left.gif, {HMIMG2}-menu_right.gif,hmtextcolor-#FFFFFF)
forumdisplay.htm --- 论坛主题列表
forumdisplay_subforum.htm --- 子论坛列表
当然刚开始接触模板制作也可以只修改其中的一部分,只要将css.htm,header.htm,footer.htm这三个文件按照您的风格制作出来就可以让模板风格作变换,其他文件也可以根据您对风格的要求进行调整。
(7)您会看到,这这个页面中包含 css,footer,header 三个模板文件,这三个文件是我们之前通过 default 目 录复制过来的默认模板文件。我们要将这些文件的内容替换成我们自己的模板文件内容才可以,点击 css 后的 [编辑] 进入模板文件编辑页面,将自己定义的 css 粘贴到默认 css 模板文件。
{template css}
<!--{loop $plugins['links'] $plugin}-->……<!--{/loop}-->
$charset
{lang memberlist}
{MAINTABLECOLOR}
这样6类在一般htm文件中不常见的语句和变量,这些语句是Discuz!模版中的特有语句,具体说明如下:
(2)把风格包中的 images 内的 navyblue 目录上传到论坛目录下 images 目录内;
Discuz!模板风格的制作及安装入门

Discuz模板制作教程

Discuz模板制作教程

近几天做了几套模板先将心的整理一下发给大家以供各位参考借鉴。

在做模板之前大家最好具备一些基本的网页制作方面的知识。

那么咱们先来看看如何制作一套简单的模板流程。

1、在Photoshop中制作风格页面并切图保存;2、制作html文档,css调整;在开始前,先了介绍一下discuz!的几个模板文件:1、header.htm--页面头部2、discus.htm--论坛首页3、index_header.htm--头部发帖按钮,和公告内容页。

4、footer.htm-- 页面底部5、viewthread.htm-- 查看帖子内容6、css_common.htm--公共样式css样式页面7、css_script.htm--其他常用css样式页面首先我们要制作的这套模板叫test,那么我就在templates目录下建立一个test目录。

在test目录下再新建一个images文件夹用于存放这套模板的图片,把切好的所有图片保存到这个文件夹中。

templates/test 文件夹用于存放这套模板的htm文件,首先我们先到default默认模板下面去复制header.htm、discuz.htm、footer.htm这三个htm文件。

然后分别打开着三个文件,可能这里你需要一些常用的htm语言常识,和一些基本的css语法。

如果你不会的话可以去查阅一些资料。

我们大多时候我们不必完全去重新做。

默认模板的head等头部信息我们还是非常有必要要保留。

将你做好的静态文件的切图我ps缩小成一个110X120大小名为preview.jpg的图片放到test目录下(这是后台安装界面显示的缩略图)。

接下来的工作要在论坛后台设置中来完成(1)进入论坛点击“系统设置——> 界面——> 模板管理”,在新增模板后填入模板名称,模板文件所在目录,板权信息然后提交即可!如(3)然后切换到“系统设置——> 界面——>风格管理”,您就可以在界面风格中看到您所定义的新的风格方案。

教你Discuz模板制作详细步骤

教你Discuz模板制作详细步骤

接触Discuz! 有一段时间了,使用的风格都是别人的免费品。

一来自己的美工水平实在不行,二来网上很少有比较完整的模板制作教程。

因为工作的需要,现特写了一份模板的制作教程。

小弟才疏学浅,不对之处还请指正。

模板制作前请将你的界面设计好,并制作成html+CSS的格式。

这里我就以大魔王的“蓝色经典”作为样版(知识共享,希望大魔王不要介意,如有侵权,请及时通知我)。

效果图如下:(图1)在开始前,先了介绍一下discuz!的几个模板文件:1、 --------------------------------------页面头部2、论坛首页3、页面底部4、viewthread--------------------------------------------------------------查看帖子内容discuz!论坛的页面通常是几个模板文件共同作用下达到的效果,如图1就是++这三个文件共同作用的效果。

对应的是:(图2)对应的是:(图3)剩下的就是文件显示的了。

当然你要将首页显示的效果就制作成一个文件模板也是可以的,这里之所以分开,是因为和文件通常还会被其它的模版文件引用。

也就是说,其它的页面(比如发贴的页面)的头部、底部与首页的头部、底部完全一样,分开来写就可以达到重复利用,减少劳动的效果。

下面我们就开始制作:首先,现在我要制作的这套模板叫test,那么我就在templates目录下建立一个test目录。

在test目录下再新建一个images文件夹用于存放这套模板的图片,把切好的所有图片保存到这个文件夹中。

templates/test文件夹用于存放这套模板的htm文件,在这个目录中新建三个文件、、,打开你设计好的主页html文件,将你想作为头部的那一段代码复制粘贴到文件中,相应的将作为底部的那一段代码复制粘贴到文件中,其余的代码复制粘贴到文件中。

最后在文件的最顶部和最底部分别加上:{subtemplate header} 和{subtemplate footer}这两句算是discuz的语言,意思是将和文件包含进来,这样就构成了一个完整的主页面了。

discuzx2门户diy模板制作教程(两种方法)

discuzx2门户diy模板制作教程(两种方法)方法一:今天主要说的是整个模板上半部分中间是怎么设置的,具体效果如下红框部分。

一眼就可以看出中间的这部分分成了三块,第一块是加粗的两篇文章标题,第二和第三快都是调用论坛的论坛,整个部分用两条虚线给分成三小快的,这样说就很容易操作了。

首先我们先拉三个帖子模块和两个静态模块排列好静态模块如下图样式设置首先我们说第一小块是怎么做出来的,第一眼大家会看到蓝色的部分和左上角的HOT是怎么做的,其实是一张图片调用就可以了,把图片上传到你的空间。

然后选择框架编辑—样式,如下图设置,记住背景图片后面选择不平铺第一小快,我们选择帖子模块—编辑—属性,如下图设置在设置好模块属性之后,最主要的是模块模板,将如下代码复制进模块模板的代码框里即可<div class="module cl xld"style="padding-top:10px;">[loop]<dl class="cl"><dt><div align="center"><ahref="{url}"title="{title}"{target}style="font-size:15px;color:#1897d5">{title}</a></div></dt><dd>{summary}...<ahref="{url}" target="_blank"style="color:#1897d5"">[详细信息]</a> </dd></dl>[/loop]</div>到这里大家点击确定就可以看到效果了,第一小块就搞定了。

Dusizx模板开发流程及编程

DISCUZx模板开发流程第一步第二步:页面分析第三步css公共样式修改模块央视修改四:模板标签$_G 保留了Discuz! 中所有的预处置数据缓存能够专门好的提高程序的性能,一些配置数据没必要每次都查询数据库,只要在修改了的时候更新下缓存即可。

Discuz! 中所有的缓存保留在$_G[cache] 中百度体会:jingyan.baidu方式/步骤(1) 全局变量系统篇$_G['uid'] => 当前登录UID$_G['username'] => 当前登录用户名$_G['adminid'] => 当前登录ID治理组ID$_G['groupid'] => 当前登录ID用户组ID$_G['cookie'] => 客户端cookie$_G['formhash'] => 当前登录ID的【FORMHASH】要紧用于表单提交$_G['timestamp'] => 当前活动时刻$_G['starttime'] => 1317042440.3242$_G['clientip'] => 当前访问者IP地址$_G['referer'] => 当前请求的地址,要紧用户表单提交$_G['charset'] => 程序编码$_G['PHP_SELF'] => 当前访问页面的相对地址$_G['siteurl'] => 程序访问地址$_G['siteroot'] => 程序所在域名的相对目录$_G['fid'] => 当前版块id【主题列表页、帖子页】显现$_G['tid'] => 当前帖子ID【帖子页】显现$_G['basescript'] => 当前页面所在频道$_G['basefilename'] => 当前页面php文件名$_G['staticurl'] => 程序附件目录$_G['mod'] => 当前页面的MOD值【例如:forum.php?mod=xxx】$_G['inajax'] => 当前ajax请求的值【无-0 有-1】$_G['page'] => 当前分页ID$_G['tpp'] => 当前分页每页显示数量$_G['keywords'] => 当前页面关键词$_G['description'] => 当前页面介绍$_G['timenow'] => Array([time] => 2020-9-26 21:07 当前效劳器时刻[offset] => +8 当前效劳器时区)$_G['config'] => Array($_G['config'][db] => Array($_G['config'][db][1] => Array($_G['config'][db][1][dbhost] => localhost 数据库连接地址 $_G['config'][db][1][dbuser] => root 数据库用户名$_G['config'][db][1][dbpw] => 123456 数据库密码$_G['config'][db][1][dbcharset] => utf8 数据库编码$_G['config'][db][1][pconnect] => 0$_G['config'][db][1][dbname] => dxutf 数据库名$_G['config'][db][1][tablepre] => pre_ 数据表前缀)))(2) 全局后台各项设置篇$_G['setting'][sitename] => 全局-站点信息-网站名称$_G['setting'][siteurl] => 全局-站点信息-网站URL$_G['setting'][regname] => 全局-注册访问-注册-注册地址$_G['setting'][reglinkname] => 全局-注册访问-注册-注册链接文字$_G['setting'][regverify] => 全局-注册访问-注册-新用户注册验证$_G['setting'][icp] => 全局-站点信息-网站备案信息代码$_G['setting'][imagelib] => 全局-上传设置-大体设置-图片处置库类型$_G['setting'][extcredits] => 积分情形自行打印$_G['setting'][creditsformula] => 全局-积分设置-大体设置-总积分计算公式$_G['setting'][cacheindexlife] => 全局-性能优化-论坛页面缓存设置-缓存论坛首页有效期$_G['setting'][cachethreaddir] => 全局-性能优化-论坛页面缓存设置-缓存目录$_G['setting'][cachethreadlife] => 全局-性能优化-论坛页面缓存设置-缓存帖子有效期$_G['setting'][bbrulestxt] => 全局-注册访问-注册-网站效劳条款$_G['setting'][bbname] => 全局-站点信息-站点名称$_G['setting'][attachurl] => 全局-上传设置-大体设置-本地附件URL地址$_G['setting'][attachdir] => 全局-上传设置-大体设置-本地附件保留位置$_G['setting'][anonymoustext] => 界面-界面设置-全局-匿名用户的昵称$_G['setting'][threadsticky] => 界面-界面设置-主题列表-置顶主题的标识$_G['setting'][defaultindex] => 默许首页文件名forum.php$_G['setting'][verify] => 用户-认证设置$_G['setting'][rewriterule] => 后台伪静态规那么情形$_G['setting'][ucenterurl] => UCenter地址$_G['setting'][plugins] => 后台插件设置与启用情形$_G['setting'][navlogos] => 后台界面设置-导航设置-内置导航的logo组$_G['setting'][navmn] => 后台设置的导航情形,要紧用于导航判定$_G['setting'][navs] => 页头导航数组,可参考此数组进行页头导航重写$_G['setting'][footernavs] => 页尾导航$_G['setting'][spacenavs] => 家园模块左侧导航$_G['setting'][mynavs] => 页头导航右边快捷导航按钮内容$_G['setting'][topnavs] => 页头顶部导航内容$_G['setting'][forumpicstyle] => Array 版块主题封面($_G['setting'][forumpicstyle][thumbwidth] => 主题封面宽度$_G['setting'][forumpicstyle][thumbheight] => 主题封面高度)$_G['setting'][activityfield] => 全局-站点功能-活动主题-发起者必填信息$_G['setting'][activityextnum] => 全局-站点功能-活动主题-扩展资料项数量$_G['setting'][activitypp] => 全局-站点功能-活动主题-用户列表每页显示参与活动的人数$_G['setting'][activitycredit] => 全局-站点功能-活动主题-利用积分$_G['setting'][activitytype] => 全局-站点功能-活动主题-内置类型$_G['setting'][adminemail] => 全局-站点信息-治理员邮箱(3)全局当前登录者信息篇$_G['member'] => Array 当前登录用户个人信息($_G['member'][uid] => UID$_G['member'][email] => 邮箱地址$_G['member'][username] => 用户名$_G['member'][password] => 通过MD5后的密码(别乱输出!!!切记)$_G['member'][status] => 用户是不是已经删除$_G['member'][emailstatus] => 邮箱验证状态0未验证1验证通过$_G['member'][avatarstatus] => 头像上传状态0未上传1已上传$_G['member'][videophotostatus] => 视频认证0未认证1已认证$_G['member'][adminid] => 所在治理组ID$_G['member'][groupid] => 所在用户组ID$_G['member'][groupexpiry] => 所在用户组有效期$_G['member'][extgroupids] => 扩展用户组$_G['member'][regdate] => 注册时刻$_G['member'][credits] => 214 现有总积分$_G['member'][notifysound] => 短消息声音$_G['member'][timeoffset] => 所在时区$_G['member'][newpm] => 新短消息数量$_G['member'][newprompt] => 新提示数量$_G['member'][accessmasks] => 那个貌似访问权限,不确信$_G['member'][allowadmincp] => 是不是拥有治理面板权限0否1是$_G['member'][onlyacceptfriendpm] => 是不是只同意老友短消息0否1是$_G['member'][conisbind] => 是不是绑定QQ 0否1是$_G['member'][lastvisit] => 上次访问时刻);(4)风格变量篇$_G['style'] => Array($_G['style'][styleid] => 当前风格ID$_G['style'][name] => 当前风格名$_G['style'][templateid] => 当前模板体系$_G['style'][tpldir] => 当前模板目录$_G['style'][menuhoverbgcolor] => 导航菜单高亮背景颜色$_G['style'][lightlink] => 浅色链接颜色$_G['style'][floatbgcolor] => 弹出窗口背景属性$_G['style'][dropmenubgcolor] => 下拉菜单背景属性$_G['style'][floatmaskbgcolor] => 弹出窗口边框颜色属性$_G['style'][dropmenuborder] => 下拉菜单边框色$_G['style'][specialbg] => 彩色区域背景色(帖子用户信息栏、需强调的表头等)$_G['style'][specialborder] => 彩色区域边框$_G['style'][commonbg] => 通用显示区域背景颜色$_G['style'][commonborder] => 通用边框颜色$_G['style'][inputbg] => 输入框背景色$_G['style'][inputborderdarkcolor] => 输入框边框深色$_G['style'][headerbgcolor] => 页头背景$_G['style'][headerborder] => 页头分割线高度$_G['style'][sidebgcolor] => 家园侧边背景$_G['style'][msgfontsize] => 帖子内容字号$_G['style'][bgcolor] => 页面背景$_G['style'][noticetext] => 提示信息颜色$_G['style'][highlightlink] => 高亮链接颜色$_G['style'][link] => 链接文字颜色$_G['style'][lighttext] => 浅色文字$_G['style'][midtext] => 中等文本颜色$_G['style'][tabletext] => 一般文本颜色$_G['style'][smfontsize] => 小号字体大小$_G['style'][threadtitlefont] => 主题列表字体$_G['style'][threadtitlefontsize] => 主题列表字体大小$_G['style'][smfont] => 小号字体$_G['style'][titlebgcolor] => 版块列表题目字体颜色$_G['style'][fontsize] => 正常字体大小$_G['style'][font] => 正常字体$_G['style'][styleimgdir] => 扩展图片目录$_G['style'][imgdir] => 界面基础图片目录$_G['style'][boardimg] => logo所在途径$_G['style'][headertext] => 页头文字颜色$_G['style'][footertext] => 页脚文字颜色$_G['style'][menubgcolor] => 导航菜单背景颜色$_G['style'][menutext] => 导航菜单文字颜色$_G['style'][menuhovertext] => 导航菜单高亮文字颜色$_G['style'][wrapbg] => 主体表格背景色$_G['style'][wrapbordercolor] => 主体表格边框色$_G['style'][contentwidth] => 阅读区域宽度$_G['style'][contentseparate] => 帖子距离颜色$_G['style'][inputborder] => 输入框边框浅色$_G['style'][menuhoverbgcode] => 导航菜单高亮背景$_G['style'][floatbgcode] => 弹出窗口背景色$_G['style'][dropmenubgcode] => 下拉菜单背景色$_G['style'][floatmaskbgcode] => 弹出窗口边框颜色$_G['style'][headerbgcode] => 页头背景$_G['style'][sidebgcode] => 家园侧边栏背景属性$_G['style'][bgcode] => 全局背景属性属性$_G['style'][titlebgcode] => 版块列表题目背景$_G['style'][menubgcode] => 导航菜单背景属性$_G['style'][boardlogo] => LOGO img代码。

Discuz!X模版开发


2013-3-12
Discuz! X 模板运行机制
include template('diy:forum/discuz:'.$gid); forum.php
模板解析
静态页面
入口脚本
流程介绍
展示
ห้องสมุดไป่ตู้
Source/module/forum_ind ex.php
模块执行 流程介绍
Data/template/id_diy_forum_discuz.tpl.php
配置 xml 文件
新建模板页面
新建模套系模 板文件夹
后台安装
查看效果完成 扩展
1. <item id="name"><![CDATA[默认风格]]></item>指定扩展风格的名称 例如:默认风格。 2. <item id="templateid"><![CDATA[1]]></item>指定初始化 templateid, 注意丌要和现有安装风格的id相同。 3. <item id="tplname"><![CDATA[默认模板套系]]></item>指定扩展风格套系名称 4. <item id="directory"><![CDATA[./template/yourstyle]]></item>指定扩展风格所在文件夹
CSS 多IE下兼 容 HACK写法
• • • • • •
左浮劢、右浮劢 .z { float: left; } .y { float: right; } 因为左右浮劢造成的父级浮劢溢出,及使用方法 .cl:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } .cl { zoom: 1; } 去除背景 .bg0_c { background-color: transparent !important; } 外边距样式 .mtm { margin-top: 10px !important; } .mbm { margin-bottom: 10px !important; } 内边距样式 .ptm { padding-top: 10px !important; } .pbm { padding-bottom: 10px !important; }

DiscuzX模板:【模板制作】-【CSS扩展】详解

DiscuzX模板:【模板制作】-【CSS扩展】详解在默认模板基础上简单的修改、附加扩展 CSS 时只需在对应的模板套系下添加一个对应的扩展 CSS 文件即可, 例如修改或扩展 common.css 中的代码, 只需在创建的模板套系目录对应位置:common/ 文件夹下新建一个 extend_common.css 文件, 然后追加需要修改或者扩展的 CSS 代码。

在生成缓存 CSS 时, 扩展代码会追加到默认模板的 CSS 文件tmplate/default/common/common.css 解析成当前的模板 id 缓存样式文件。

CSS 继承规范:1.Discuz! X系列产品中 CSS 文件会在缓存时按照以下顺序进行合并:1.template/default/*.css 文件。

2.当前模板是非默认模板时, template/当前模板目录/extend_*.css 文件或 template/当前模板目录/*.css。

3.当某插件启用时, source/plugin/插件目录/template/extend_*.css文件。

2.因此非默认模板目录中的 CSS 属性将继承默认模板中的 CSS 属性, 插件目录中的 CSS 文件将继承前二者的 CSS 属性。

3.CSS 自身的集成顺序为:当 CSS 属性名称相同时, CSS 文件中, 写在后面的替换前面的代码。

CSS书写规范:1.属性写在一行内, 属性之间、属性名和值之间以及属性与“{}”之间须有空格, 例如:.class { width: 400px; height: 300px; } 。

2.属性的书写顺序:1.针对特殊浏览器的属性, 应写在标准属性之前, 例如:-webkit-box-shadow:; -moz-box-shadow:; box-shaow:;2.按照元素模型由外及内, 由整体到细节书写, 大致分为五组:1.位置:position, left, right, float2.盒模型属性:display, margin, padding, width, height3.边框与背景:border, background4.段落与文本:line-height, text-indent, font,color,text-decoration,...5.其他属性:overflow, cursor, visibility,...3.谨慎添加新的选择符规则, 尤其不可滥用 id, 尽可能继承和复用已有样式4.选择符、属性、值均用小写(格式的颜色值除外), 缩写的选择符名称须说明缩写前的全称, 例如 .cl -> Clearfix5.勿使用冗余低效的 CSS 写法, 例如:ul li a span { ... }6.慎用 !important7.建议使用在 class/id 名称中的词语1.表示状态:a->active2.表示结构:h->header,c->content,f->footer3.表示区域:mn->main,sd->side,nv-navigation,mu->menu4.表示样式:l-list,tab,p_pop常用css实例:1.兼容IE浏览器 css hack所有 IE浏览器适用:.ie_all .foo { ... }IE6 专用:.ie6 .foo { ... }IE7 专用:.ie7 .foo { ... }IE8 专用:.ie8 .foo { ... }2.3.浮动样式及浮动元素父元素高度自适应样式代码:.z/.y 浮动 left/right .z { float: left; } .y { float: right; }.cl:after { content: "."; display: block; height: 0; clear: both;visibility: hidden; } .cl { zoom: 1; }4.大标题字体:.wx, .ph { font-family: "Microsoft YaHei", "Hiragino Sans GB", STHeiti, Tahoma, SimHei, sans-serif; font-weight: 100; }5.外边距样式:.mtn { margin-top: 5px !important; }.mbn { margin-bottom: 5px !important; }.mtm { margin-top: 10px !important; }.mbm { margin-bottom: 10px !important; }.mtw { margin-top: 20px !important; }.mbw { margin-bottom: 20px !important; }6.文字字体大小:.xs0 { font-family: {SMFONT}; font-size: {SMFONTSIZE};-webkit-text-size-adjust: none; }.xs1 { font-size: 12px !important; }.xs2 { font-size: 14px !important; }.xs3 { font-size: 16px !important; }7.内边距样式:.ptn { padding-top: 5px !important; }.pbn { padding-bottom: 5px !important; }.ptm { padding-top: 10px !important; }.pbm { padding-bottom: 10px !important; }.ptw { padding-top: 20px !important; }.pbw { padding-bottom: 20px !important; }8.module.css 文件架构解析(此文件必须按照格式编写):/** group::index **//* 群组 index 模块使用的CSS *//** end **//** group::index,forum::index **//* 群组 index 和论坛 index 模块使用的CSS *//** end **//** forum **//* 论坛所有模块使用的CSS *//** end **/实现模块化css分部加载!格式固定多个模块用”, “隔开例如:/** misc::invite,group,forum::viewthread,portal::view,home::space **/ 这个文件的分部加载是对应程序地址例如:forum.php?mod=forumdisplay, 应当按照 CURSCRIPT::$mod 格式写即:forum::forumdisplay。

  1. 1、下载文档前请自行甄别文档内容的完整性,平台不提供额外的编辑、内容补充、找答案等附加服务。
  2. 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
  3. 3、如文档侵犯您的权益,请联系客服反馈,我们会尽快为您处理(人工客服工作时间:9:00-18:30)。
相关文档
最新文档