Discuz!官方免费开源建站系统

 找回密码
 立即注册

QQ登录

只需一步,快速开始

搜索

论坛界面设计之后的那些事事!

[复制链接]
elevensky 发表于 2011-9-27 12:31:25 | 显示全部楼层 |阅读模式
很多人都想按照自己的意愿来美化论坛,从直观的角度来说,我们做一套模板的流程可能就是先找一个美工设计出效果图来,一旦效果图出来了,剩下的就是套模板了,很多人对接下来的工作就不是很清楚了!
其实我不太建议这么做(先让设计出效果图!),首先一般的设计师在设计模板的时候都是和实际的程序脱节的比较严重,有的时候设计的东西并不具有很好的实用性,建议在设计论坛模板的时候尽量熟悉discuz的模板,可能对你的设计思路有点限制,但这有时候会为你后来的套模板省去不少不必要的麻烦~
在这里,设计出来的模板大多有两种类型:
1是你自己设计的不是基于原有discuz论坛现有数据的模板,比如diy模块。频道,专题等模块,这个独立性强,相对于论坛的设计思路,这种模板往往扩展伸缩性较强,你只要做好你的diy框架,引用好你做好的html模板的各种图片,css路径完整的显示出模板就可以了,然后再填充diy标签,调用diy数据填充!
详细内容我在这里就不具体建议了治愈如何制作专题,频道等模块的教程,请参照我之前写过的一些地址:


2.就是基于论坛的模板设计,比如论坛首页的原有模板美化,这种模板一般对数据的操纵性不强,主要是美化论坛原有的视觉效果,如图片背景,分区title的按钮图片,背景图片,大多主要集中于csshtml结构,视觉图片的表面非数据改动!这种模板一般要求套模板的人员对discuz的模板代码语法比较熟悉,能够熟练的掌握各种discuz的模板代码语法规则。
在这里我不讲具体的模板代码的语法规则,我只说明下比较重点的几个注意事项!
1.      首先你要明白,一个成熟的页面是有展示结构和数据组成的。
1)展示结构就是你设计的模板,切成html后包括的css,所用到的图片
2)数据就是你通过php程序处理好的用来展示的内容数据!
你要明确,数据你在页面上删了就不会再显示,这个东西不是你加上去的,是discuz通过程序流程处理完,通过他自己的模板语法写到模板并通过模板解析流程解析出来的!你可以移动他的位置,删除它!通过css控制他的展示样式!但你不能凭空制造他。
其次界面上的东西你可以随便动,css+html这个不会影响discuz模板解析的流程,他只是扶着展示你在程序里构建的数据!
但是这里需要注意的是discuz模板语法规则中有些特定标签限定了你随意改动html的动作,下面我以template/default/forum/discuz.htm文件中的例子:
1discuz中的标签都是以<!—{}-->这种注释的形式写到模板里面的,程序会自动读取这种标签,按指定规则正则匹配成php认识的程序代码!
我在这里让大家注意就是标签闭合
  1. <!--{if empty($gid) && $announcements}-->
  2.         <div class="y">
  3.                 <div id="an">
  4.                         <dl class="cl">
  5.                                 <dt class="z xw1">{lang announcements}: </dt>
  6.                                 <dd>
  7.                                         <div id="anc"><ul id="ancl">$announcements</ul></div>
  8.                                 </dd>
  9.                         </dl>
  10.                 </div>
  11.                 <script type="text/javascript">announcement();</script>
  12.         </div>
  13. <!--{/if}-->
复制代码
这里的if对应了php中的if判断语句
然后是loop标签,这是循环数据的标签,如果你不懂php这里就让程序员研究下吧,相当于php中的foreach循环。这里注意,一般的标签都是要闭合的,如果不闭合就会影响正常的discuz模板解析流程,出现前台白屏的效果!
<!--{loop $catlist $key $cat}-->
<!--{/loop}-->
这是两个最常用的例子我这里说明下!你改动模板的时候也是这样,注意不要乱删,破坏了discuz中原有的配对模板标签就行了,剩下的模板结构随便改,数据随便删!



楚一 发表于 2011-9-27 12:44:28 | 显示全部楼层
回复

使用道具 举报

popuppp 发表于 2011-9-27 15:24:23 | 显示全部楼层
  配合实际例子讲解更好
回复

使用道具 举报

wyq8848 发表于 2011-9-27 18:42:24 | 显示全部楼层
这些贴子对于象我这样的初学者很有帮助,三篇我都看过了很有收获,顶起来
回复

使用道具 举报

ARCHY` 发表于 2011-9-27 19:21:45 | 显示全部楼层
前排支持下了
回复

使用道具 举报

st.king 发表于 2011-12-10 23:39:16 | 显示全部楼层
貌似很强大
回复

使用道具 举报

zasq 发表于 2011-12-12 20:29:38 | 显示全部楼层
很好的文章,经验之谈
回复

使用道具 举报

huang2012 发表于 2011-12-14 21:27:51 | 显示全部楼层
学习,对我有用
回复

使用道具 举报

xiaomu 发表于 2011-12-17 15:52:02 | 显示全部楼层
提示: 作者被禁止或删除 内容自动屏蔽
回复

使用道具 举报

dxzhujob 发表于 2012-2-12 19:04:38 | 显示全部楼层
不错,学习一下
回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

手机版|小黑屋|Discuz! 官方站 ( 皖ICP备16010102号 )star

GMT+8, 2024-11-22 20:46 , Processed in 0.027227 second(s), 4 queries , Gzip On, Redis On.

Powered by Discuz! X3.4

Copyright © 2001-2023, Tencent Cloud.

快速回复 返回顶部 返回列表