discuz模板制作问题,第1张

Discuz!X3是Discuz!建站程序系列的最新版本,提供了易于DIY的环境,很多新人喜欢问:我看见了那么多好看的模版,但是不符合我当前网站的需求,如何自己去DIY?

当然他们肯定去过官方论坛找教程,去看了那么多文字以后依旧不知道如何去编辑。其实最快开始DIY模版的道路是下载一个符合你心目中要求的框架的模版。例如我喜欢PHPWIND那种导航条置顶的风格,我就去下载了一个导航条置顶的模版,在这基础之上去DIY会相对容易一点。

首先我们需要了解的不是怎样开始DIY,而是需要知道,这页面是属于HTML代码制作的,HTML是一种标记语言,这就意味着你想加入什么功能的时候就要去搜索相关的功能标记。要了解HTML是如何运作的,是如何展现样式的,我们这里可以提供一个最基本的DIV代码。

<div id="headerp" class="cssheader" style="background:#ccc">headerpic</div>

这个div会显示headerpic这几个字,这个div的标识符是headerp,其他代码和程序可以通过这个表示符来访问这个div;这个div引用了cssheader这个css样式,并且除非cssheader里面相关样式(当前相关样式:background)后面加上了!important重要标记,headerp这个div都会显示background(背景)为色板十六进制代码ccc的颜色(灰色)。

这里强调一下!important重要标记,在Discuz!里面,有很多运用到!important标记的地方。其中最常用的地方就是DIY模块,在DIY模块里面设定的边距等等数据会被加上!important标记,出现这样标记的时候除非有比这个!important更高级的!important声明,否则你设定的其他同样的样式都会被这!important前面的语句盖住。例:

<div id="headerp" class="cssheader" style="background:#ccc">headerpic</div>cssheader{ background:#aaa !important;}

#headerp{ background:#bbb;}

在这个案例中,由于css样式cssheader被添加了!important标记,所以即使elementstyle(background:#ccc)比cssheader在样式优先顺序里面更高级,background属性也会使用cssheader里面加了!important的数据。

记住了这些以后让我们来真正去DIY属于自己的模版吧。

Discuz!X的模版位于 根目录/template 文件夹里面,在这里面每一个文件夹都会被识别成一个新模版。如果你有想要安装的模版,只需要把模版的整个文件夹复制到这个目录然后进入后台-界面-风格设置里面找到对应的模版然后安装。安装好以后勾选为默认模版以后提交即可。创建模版的时候我们需要把default(默认模版)文件夹里面的discuz_style_defaultxml复制到你的模版目录/discuz_style_你的模版名xml。然后安装官方的模版xml去修改里面的内容。

<xml version="10" encoding="ISO-8859-1">

<root>

 <item id="Title"><![CDATA[Discuz! Style]]></item>

 <item id="Data">

  <item id="name"><![CDATA[默认风格]]></item>

  <item id="templateid"><![CDATA[1]]></item>

  <item id="tplname"><![CDATA[默认模板套系]]></item>

  <item id="directory"><![CDATA[/template/default]]></item>

  <item id="copyright"><![CDATA[康盛创想(北京)科技有限公司]]></item>

  <item id="style">

   <item id="smfont"><![CDATA[Arial]]></item>

   <item id="threadtitlefontsize"><![CDATA[14px]]></item>

   <item id="threadtitlefont"><![CDATA[Tahoma,'Microsoft Yahei','Simsun']]></item>

   <item id="smfontsize"><![CDATA[083em]]></item>

   <item id="tabletext"><![CDATA[#444]]></item>

   <item id="midtext"><![CDATA[#666]]></item>

   <item id="lighttext"><![CDATA[#999]]></item>

   <item id="link"><![CDATA[#333]]></item>

   <item id="highlightlink"><![CDATA[#369]]></item>

   <item id="noticetext"><![CDATA[#F26C4F]]></item>

   <item id="bgcolor"><![CDATA[#FFF backgroundpng repeat-x 0 0]]></item>

   <item id="msgfontsize"><![CDATA[14px]]></item>

   <item id="sidebgcolor"><![CDATA[ vlinebpng repeat-y 0 0]]></item>

   <item id="headerborder"><![CDATA[0]]></item>

   <item id="headerbgcolor"><![CDATA[]]></item>

   <item id="inputborderdarkcolor"><![CDATA[#848484]]></item>

   <item id="stypeid"><![CDATA[1]]></item>

   <item id="inputbg"><![CDATA[#FFF]]></item>

   <item id="commonborder"><![CDATA[#CDCDCD]]></item>

   <item id="commonbg"><![CDATA[#F2F2F2]]></item>

   <item id="specialborder"><![CDATA[#C2D5E3]]></item>

   <item id="specialbg"><![CDATA[#E5EDF2]]></item>

   <item id="dropmenuborder"><![CDATA[#DDD]]></item>

   <item id="floatmaskbgcolor"><![CDATA[#000]]></item>

   <item id="dropmenubgcolor"><![CDATA[#FEFEFE]]></item>

   <item id="floatbgcolor"><![CDATA[#FFF]]></item>

   <item id="lightlink"><![CDATA[#FFF]]></item>

   <item id="menuhoverbgcolor"><![CDATA[#005AB4 nv_apng no-repeat 50% -33px]]></item>

   <item id="titlebgcolor"><![CDATA[#E5EDF2 titlebgpng repeat-x 0 0]]></item>

   <item id="fontsize"><![CDATA[12px/15]]></item>

   <item id="font"><![CDATA[Tahoma,'Microsoft Yahei','Simsun']]></item>

   <item id="styleimgdir"><![CDATA[]]></item>

   <item id="imgdir"><![CDATA[]]></item>

   <item id="boardimg"><![CDATA[logopng]]></item>

   <item id="available"><![CDATA[]]></item>

   <item id="headertext"><![CDATA[#444]]></item>

   <item id="footertext"><![CDATA[#666]]></item>

   <item id="menubgcolor"><![CDATA[#2B7ACD n***g no-repeat 0 0]]></item>

   <item id="menutext"><![CDATA[#FFF]]></item>

   <item id="menuhovertext"><![CDATA[#FFF]]></item>

   <item id="wrapbg"><![CDATA[#FFF]]></item>

   <item id="wrapbordercolor"><![CDATA[#CCC]]></item>

   <item id="contentwidth"><![CDATA[630px]]></item>

   <item id="contentseparate"><![CDATA[#C2D5E3]]></item>

   <item id="inputborder"><![CDATA[#E0E0E0]]></item>

  </item>

  <item id="version"><![CDATA[X31]]></item>

 </item>

</root>

需要注意的是这里的Title值不能改,必须保持原样才能够被安装和运行。version代表你这个模版能适用的Discuz!版本。可以用逗号分隔,例:

<item id="version"><![CDATA[X25,X30,X31,X35]]></item>

templateid是模版的标识符,这个如果是本地模版的话直接删掉这行即可。不然会识别错误。如果想自定义参数必须在style下面添加行。例如:

<item id="diyxml"><![CDATA[diydiydiytext]]></item>

Discuz!的这个自定义的参数非常好用,在之后的内容里面会被提及。

需要导入自定义模版的时候只需要在后台的界面-风格选项里面上面有个导入标签,点入以后会提示你一步一步导入你已经上传的模版。你也可以直接在对应的模版设置里面修改好参数然后到模版列表页导出你自定义好的模版XML文件。

所谓制作模版就是复制官方文件到自己的模版文件夹里面然后加以修改。

Discuz!额外提供了一些便利设置方便我们设置CSS样式,那就是extend_。我们可以用添加这个

前缀的CSS来达到不替换原有CSS文件的情况下追加或者覆盖原CSS内容。添加的位置就是根目录/template/你的模版文件夹/common/extend_commoncss。

要注意的是modulecss里面的注释能起到划分区域的效果,优先级比extend_commoncss还要高,但是commoncss里面的!important依旧优先级比没有!important的modulecss的对应内容要高。例:

/ forum::viewthread,group::viewthread,forum::trade,forum::misc /

pls {background:rgba(0,0,0,003);border-right:none;width:200px;}

ad pls {background: #ffffff;}

ad plc {background: #ffffff;}

pls avatar img {width: 145px;padding:8px;background: #FFF;box-shadow:0px 0px 10px rgba(0,0,0,02);}

pls avatar {text-align:center;}

pls p, pls pil, pls o {margin: 10px 20px;text-align: center;}

dvbg {background: #fff;}

/ end /

这些代码只在区域是forum::viewthread,group::viewthread,forum::trade和forum::misc生效。

<!--{template common/header}-->

你在模版文件会看见这样的注释代码,这代码实际上能调用模版文件夹里面的网页文件,要求后缀是htm,例如我在forum文件夹里面添加了一个timelinehtm,那么就可以添加如下代码在响应位置调用timeline这个页面

<!--{template forum/timeline}-->

我们现在掌握了这些知识以后可以考虑开始初步为网站添加点料了。

我们都很喜欢在网站上面添加一个大大的横幅,当然不一定是广告,也会喜欢添加一些美图。这个时候我们需要自己定义一个div,而不是用导航条上面那片区域的背景来解决。因为那会导致一些背景和插件色块重叠,看起来不美观。而且本例还要达成让用户来自定义这个背景的效果。

这里我们就得说一下Discuz!一个很有意思的地方。在模版里面,注释的内容并不是没用的,相反,注释的内容是可以被当作是PHP代码运行的。让用户自定义,我们就需要调用cookie在Discuz!里面提供了一个调用COOKIE的一个标准方法:$_G['cookie']['cookiename'],这样我们就能调用名为cookiename的cookie了。具体实现代码如下(需要你有基本编程基础):

在discuzhtm中第一段注释下面添加:

<!--{if isset($_G['cookie']['sttbg'])}-->

<div id="headerpic" class="headerpic" style="background:url($_G['cookie']['sttbg'])"></div>

<!--{else}-->

<div id="headerpic" class="headerpic"></div>

<!--{/if}-->

然后去DIY添加静态模块,选择自定义HTML模版。添加如下代码:

<ul>

<li>

<span style="float:left">顶部链接</span>

<form name="setdiyoptbg" onsubmit="setcookie('sttbg',setdiyoptbgsttbgvalue,6060243012);">

 <input type="text" name="sttbg" />

 <input type="submit" value="设置" />

</form>

</li>

</ul>

然后在common文件夹内新建extend_commoncss,添加如下代码:

headerpic {background:url({STYLEIMGDIR}/{HEADERBG}) no-repeat right 0 transparent;background-size:cover;background-position:0% 10%;height:220px;box-shadow:0 0 15px #8f8f8f;}

最后在模版设置里面的最下方添加自定义参数HEADERBG,内容指向想添加为默认头部的文件地址。文件前面添加了STYLEIMGDIR,这样就可以直接把放在模版文件夹里面的扩展文件夹里,不会搞乱格式。

至此,添加自定义内容的教程结束。

这个教学旨在去学会如何学习制作,而并不是学习制作方法,就是授人以鱼不如授人以渔的意思。概念会比较泛,必须要自己去动手做才能理解。

我们很多时候不止要添加元素,还需要修改已有的元素。这个时候我们就需要开发者模式了,不然很多时候你会一头雾水。这里推荐chrome和ie10以上的开发者模式,都支持页面编辑,即时让代码生效。满意了以后直接去修改对应文件即可,不过你要熟悉那部分的代码,就如同上一步添加模块一样你需要知道所有代码的意思,不然很可能导致失败效果。

这里特殊说一下plugin接口,当你在修改元素的时候,可能会导致一些插件无法被正常使用,这个时候你就需要尝试修改一下插件接口的位置。例如我把viewthread_nodehtm里面的用户名移动到了头像下方,这个时候某插件的橙名功能失效了,联系插件作者无果以后决定自己亲手来修改模版以达到适应插件的效果。

网页跟我们平时所知道的顺序阅读载入方式有点不一样,网页的代码只会读取已经载入好的地方,所以接口不能放在程序代码前面,经过分析插件源文件 ,我把那个接口放在了修改了以后的用户名那段代码的后面,成功修复了橙名不显示的问题。代码如下

    <!--{if $_G['setting']['authoronleft']}-->

     <div class="anc">

      <div class="authi"><a href="homephpmod=space&uid=$post['authorid']" target="_blank" class="xw1"{if $post[groupcolor]} style="color: $post[groupcolor]"{/if}>$post[author]</a>$authorverifys</div>

     </div>

    <!--{/if}-->

    <!--{hook/viewthread_profileside $postcount}-->

注意这里面最后的hook注释句,这就是Discuz插件的入口。通过移动它来调整插件载入的位置。

至此,我独家的Discuz自定义模版教程编写完毕。以上内容均为原创,曾经在类似的问题里面发过,但是作者迟迟没能回来采纳,深感遗憾。

回第二个问题:在界面导航里面去掉论坛的顶部导航,就是设置成不可用。然后在界面里面把门户选作主页即可。虽然用户仍旧能通过forumphp访问论坛,但是这也是最简单最可行的办法

先找到你要设置为签名的地址。(一般选种,鼠标右键点击属性。就可以看到地址URL)

然后在论坛的签名内输入

[img]的地址[/img]

然后提交就OK了

Discuz! 论坛软件系统简介  论坛软件系统亦称电子公告板(BBS)系统,它伴随社区BBS的流行而成为互联网最重要的应用之一,也逐渐成为网站核心竞争力的标志性体现。2006年7月 CNNIC 发布的最新统计表明,432% 的中国网民经常使用论坛/BBS/讨论组,论坛社区应用首次超过即时通讯 IM ,成为仅次于收发Email的互联网基本应用。

  Crossday Discuz! Board(以下简称 Discuz!,中国国家版权局著作权登记号 2006SR11895)是康盛创想(北京)科技有限公司(英文简称Comsenz)推出的一套通用的社区论坛软件系统,用户可以在不需要任何编程的基础上,通过简单的设置和安装,在互联网上搭建起具备完善功能、很强负载能力和可高度定制的论坛服务。Discuz! 的基础架构采用世界上最流行的 web 编程组合 PHP+MySQL 实现,是一个经过完善设计,适用于各种服务器环境的高效论坛系统解决方案。

  作为国内最大的社区软件及服务提供商,Comsenz旗下的 Discuz! 开发组具有丰富的 web 应用程序设计经验,尤其在论坛产品及相关领域,经过长期创新性开发,掌握了一整套从算法,数据结构到产品安全性方面的领先技术。使得 Discuz! 无论在稳定性,负载能力,安全保障等方面都居于国内外同类产品领先地位。

  自2001年6月面世以来,Discuz!已拥有五年以上的应用历史和三十多万网站用户案例,是全球成熟度最高、覆盖率最大的论坛软件系统之一。 Discuz! 适用的应用领域  Discuz! 适用于以下的应用领域:

  对稳定性和负载能力要求较高的门户网站

  大中型企业的客户在线调查、技术与产品服务

  企事业单位内部交流与沟通,办公协作与自动化(OA)

  大中专院校的学生、教工与校友讨论区

  已经发展到一定规模,具有相当访问量的个人网站

  商业、交友、科技、影音、下载等等方面的专门网站

  地方政府、电信公司或爱好者建立的地域性讨论区

  以上仅是一些常见应用领域的举例,事实上,Discuz! 因其全面的功能设计和可圈点的安全防范,几乎适用于所有需要互动和交流功能的网站,尤其是已经具备相当规模,且经常因为服务器资源耗尽、安全问题或其他原因而损失人气的中大型应用案例。同时我们也不断吸取用户的意见和建议,在现有系统的基础上,降低应用门槛、简化和人性化使用操作,有的放矢的进行功能扩充,使 Discuz! 适用于更多的应用领域。

   discuzDiscuz! 产品特色

  卓越的访问速度和负载能力

  Discuz! 从创立之初即以提高产品效率为突破口,随着编译模板、语法生成内核、数据缓存和自动更新机制等独创或独有技术的应用,以及坚固的数据结构与最少化数据库查询设计,使得 Discuz! 可以在极为繁忙的服务器环境下快速稳定运行,切实节约企业成本,提升企业形象。依据实际应用案例,在 P4 24G,1G RAM,IDE 硬盘的入门级服务器上,Discuz! 可以容纳 150 万篇帖子并稳定负载 2500 人/30 分钟在线的流量,最高可达 5000 人/30 分钟在线。在硬件配置稍好的环境中,如双 Xeon 24G,2G RAM,万转 SCSI 硬盘的服务器上,以上数字均实现了翻番,即容纳 300 万篇以上帖子,稳定负载 5000~8000 人/30 分钟在线,最高可超过 10000 人/30 分钟。如果采用 Web 和数据库分离的方式负载,并采用 RAID-5,各项指标可达到上述的二至三倍,即实现约 30000人/30 分钟在线。这样的负载能力完全可以满足中大型网站乃至门户网站的应用需求。

  强大而完善的功能

  除了一般论坛所具有的功能外,Discuz! 还提供了很大限度的个性化设定,力求做到功能设置的系统性、丰富性,功能使用的人性化、傻瓜化,需求定制的最大化、智能化。绝大多数功能均在后台预留开关,可按用户需要启用。前后台全部采用语言文件等国际化设计,前台采用 Discuz! 开发组自主开发的编译模板等先进技术,更换界面易如反掌。完善的权限设定,使管理员可控制到每个用户,每个组及所在每个分论坛的各种权限,满足应用于各种领域的论坛管理者。

  国际化和标准化的产品架构

  目前发布的版本分为简体中文、繁体中文和英文三个版本。自 Discuz! 20 以来,因其高效国际化内核的应用,使其成功走出国门,步入海外市场。我们十分重视在产品开发与推广的全过程中与国际接轨,时刻不忘中国软件走向世界的奋斗目标,专注于开发符合国际标准、具有国际影响力的中国软件产品,Discuz! 400 以后,Discuz! 开发组更加大了国际化的研发力度,通过良好的设计和有效的宣传,努力提高海外用户数量,提升 Discuz! 品牌的国际竞争力。

  周密的安全部署和攻击防护,更一步的为您服务!!!!

  经过近三年的经验和技术积累,Discuz! 在安全部署上已逐步走向成熟,全部商业客户论坛的稳定安全运行就是最好的例证。Discuz! 能有效处理页面格式,保证页面及表格的完整性。安全检查应用于每一个 Discuz! 代码中,可自动屏蔽贴子及签名等中的恶意代码和跨站脚本攻击。独有的全程操作记录,使论坛运行情况随时有据可查。

  持久的创新和广阔的前景

  Discuz! 拥有一支富于创新的开发队伍,持续性的技术优势和不断增长的市场经验,除了强化已有的市场竞争力以外,更增强了已有和潜在客户的信心。我们不满足于现有成果,追求产品设计的趋于完美。我们时刻关注国内外相关领域内的最新进展和动态,不断的进步和创新,已使越来越多的人相信 Discuz! 更加美好的明天。

  如果您正在寻找一个出色的论坛解决方案,如果原有产品无法适应您企业的不断增长,如果您为不断提升的硬件需求而苦恼,如果您的网站因为服务器的不堪重负而停滞不前,Discuz! 将为您提供一个崭新的机遇和选择。

  最新版本:Discuz! 700

一、在论坛所有页面顶部banner位(Logo右侧)添加广告代码

1、系统设置---基本设置---基本设置---网站备案信息代码

添加代码

<script type="text/javascript">if(documentallitem("ad_headerbanner") != null){ad_headerbannerinnerHTML=ggad_headerbannerinnerHTML;}</script>

2、系统设置---基本设置--搜索引擎优化---其它头部信息

添加代码

<div id="ggad_headerbanner" style="display:none;">你要添加的广告代码(如Google AdSens代码)</div>

二、在论坛所有页面底部添加广告代码

1、系统设置---基本设置---基本设置---网站备案信息代码

添加代码

<script type="text/javascript">if(documentallitem("ad_footerbanner1") != null){ad_footerbanner1innerHTML=ggad_footerbanner1innerHTML;}</script>

2、系统设置---基本设置--搜索引擎优化---其它头部信息

添加代码

<div id="ggad_footerbanner1" style="display:none;">你要添加的广告代码(如Google AdSen代码)</div>

三、在论坛帖子页面一楼正文的上方添加广告代码

1、系统设置---基本设置---基本设置---网站备案信息代码

添加代码

<script type="text/javascript">if(documentallitem("ad_thread3_0") != null){ad_thread3_0innerHTML=ggad_thread3_0innerHTML;}</script>

2、系统设置---基本设置--搜索引擎优化---其它头部信息

添加代码

<div id="ggad_thread3_0" style="display:none;">你要添加的广告代码(如Google AdSee代码)</div>

以上修改中的3_0改成3_1(共四处)既是添加到2楼的相同位置,改成3_2既是添加到3楼的相同位置,依此类推

四、在论坛帖子页面一楼正文的右侧添加广告代码

1、系统设置---基本设置---基本设置---网站备案信息代码

添加代码

<script type="text/javascript">if(documentallitem("ad_thread4_0") != null){ad_thread4_0outerHTML=ggad_thread4_0innerHTML;}</script>

2、系统设置---基本设置--搜索引擎优化---其它头部信息

添加代码

<div id="ggad_thread4_0" style="display:none;"><div style="float:right;">你要添加的广告代码(如Google AdSense代码)</div></div>

注意:以上修改中的4_0改成4_1既是添加到2楼的相同位置,改成4_2既是添加到3楼的相同位置,依此类推

将right改为left,即是让广告向左漂浮

五、在论坛帖子页面一楼正文的下方添加广告代码

1、系统设置---基本设置---基本设置---网站备案信息代码

添加代码

<script type="text/javascript">if(documentallitem("ad_thread1_0") != null){ad_thread1_0outerHTML=ggad_thread1_0innerHTML;}</script>

2、系统设置---基本设置--搜索引擎优化---其它头部信息

添加代码

<div id="ggad_thread1_0" style="display:none;"><div style="float:right;">你要添加的广告代码(如Google AdSens代码)</div></div>

注意:以上修改中的1_0改成1_1既是添加到2楼的相同位置,改成1_2既是添加到3楼的相同位置,依此类推,改成1_3即是添加到4楼的相同位置

六、在论坛帖子页面1楼和2楼之间添加广告代码

1、系统设置---基本设置---基本设置---网站备案信息代码

添加代码

<script type="text/javascript">if(documentallitem("ad_interthread") != null){ad_interthreadinnerHTML=ggad_interthreadinnerHTML;}</script>

2、系统设置---基本设置--搜索引擎优化---其它头部信息

添加代码

<div id="ggad_interthread" style="display:none;">你要添加的广告代码(如Google AdSense代码)</div>

七、在论坛导航栏下方添加广告代码

1、系统设置---基本设置---基本设置---网站备案信息代码

添加代码

<script type="text/javascript">if(documentallitem("ad_text") != null){ad_textinnerHTML=ggad_textinnerHTML;}</script>

2、系统设置---基本设置--搜索引擎优化---其它头部信息

添加代码

<div id="ggad_text" style="display:none;">你要添加的广告代码(如Google AdSense代码)</div>

八、在论坛首页版块分区的下方添加广告代码

这里,我们假设要在gid=8的分区下方添加广告

1、系统设置---基本设置---基本设置---网站备案信息代码

添加代码

<script type="text/javascript">if(documentallitem("ad_intercat_8") != null){ad_intercat_8innerHTML=ggad_intercat_8innerHTML;}</script>

2、系统设置---基本设置--搜索引擎优化---其它头部信息

添加代码

<div id="ggad_intercat_8" style="display:none;">你要添加的广告代码(如Google AdSense代码)</div>

注意:如果要在其它分区下方添加广告,则修改intercat_8为intercat_gid的数值,共有四处

最后提醒大家,如果是添加Google AdSense内容单元广告代码,则以上的添加方式,最多只能使用三种。因为Google AdSense的计划政策规定一个页面最多放置三个内容单元。虽然按照上面的修改方法,有的时候广告在有些页面没有显示,但是也算做一次。

九:在论坛首页标签栏内添加广告代码

  

1、系统设置---基本设置---基本设置---网站备案信息代码

  添加代码

  <script type="text/javascript">if(documentgetElementById("hottags") != null){documentgetElementById   <br><br>  ("hottags")innerHTML+=documentgetElementById("ad_hottags")innerHTML;}</script>

  2、系统设置---基本设置--搜索引擎优化---其它头部信息

  添加代码

  <div id="ad_hottags" style="display:none;">你要添加的广告代码(如Google AdSense代码)</div>

  想要居中显示,这样加

  <div id="ad_hottags" style="display:none;"><div style="text-align:center;">你要添加的广告代码(如Google AdSense代码)  

  </div></div>

DABAN RP主题是一个优秀的主题,极致后台体验,无插件,集成会员系统
网站模板库 » discuz模板制作问题

0条评论

发表评论

提供最优质的资源集合

立即查看 了解详情