discuzx2门户diy模板制作教程(两种方法)
方法一:
今天主要说的是整个模板上半部分中间是怎么设置的，具体效果如下红框部分。
一眼就可以看出中间的这部分分成了三块，第一块是加粗的两篇文章标题，第二和第三快都是调用论坛的论坛，整个部分用两条虚线给分成三小快的，这样说就很容易操作了。
首先我们先拉三个帖子模块和两个静态模块排列好
静态模块如下图样式设置
首先我们说第一小块是怎么做出来的，第一眼大家会看到蓝的部分和左上角的HOT是怎么做的，其实是一张图片调用就可以了，把图片上传到你的空间。
第一小快，我们选择帖子模块—编辑—属性，如下图设置
在设置好模块属性之后，最主要的是模块模板，将如下代码复制进模块模板的代码框里即可
<div class="module cl xld">[loop]<dl class="cl">
<dt>
<div align="center"><ahref="{url}" title="{title}"{target}>{title}</a></div>
</dt>
<dd>{summary}...<ahref="{url}" target="_blank"">[详细信息]</a>
</dd></dl>[/loop]</div>
<dt>
<div align="center"><ahref="{url}" title="{title}"{target}>{title}</a></div>
</dt>
<dd>{summary}...<ahref="{url}" target="_blank"">[详细信息]</a>
</dd></dl>[/loop]</div>
到这里大家点击确定就可以看到效果了，第一小块就搞定了。
下面的第二小块和第三小块是相同的我们设置好一部分就可以了
文章是调用论坛的内容，大家可以根据模块属性里的主题排序方式选择你想要的排序方式
在设置好模块属性之后，将如下代码复制进模块模板的代码框里即可
<div class="module cl xlxl1"><ul>[loop]<li><em>{dateline}</em>
<label><ahref="{forumurl}"{target}>[{forumname}]</a></label> <ahref="{url}" title="{title}"{target}>{title}</a></li>[/loop]</ul>
</div>
</div>
这样就会有左边是调用论坛的版块名右边是调用的文章名，
第三小块设置方法和这一小块设置相同。
这样就做出了最终的效果图样式。
上次说到门户模板中间的部分，今天说说两天的部分是如何制作的，最终效果如下图
基本上分为两部分，左边的和右边的，左下部分和右边的又有点大同小异
有过制作经验或者看过首页N格教程的应该都知道左上的图片幻灯是怎么回事，所以这里就不再说明了。
首先我们看标题框架，蓝底加黑标题，如下图的三个蓝框
这里也只是调用了图片，你也可以做成其他的图片上传到空间在这里调用即可
调用方法是。DIY模式下--框架编辑—背景图片，填上你上传到空间的图片地址，选择不平铺。
其实左下部分就是简单的论坛文章调用，选择帖子模块编辑—属性
根据你的需要设置各种属性即可。
右边的部分上下两块是一样的，两个帖子模块被静态模块隔开
静态模块同上一期教程的静态模块是一样的，如下图
然后是调用的图片文章，属性根据你论坛的内容来调用不同版块带图片的文章
设置好以后在模块模块里粘贴上下面的代码就可以得到如图所示效果
<div class="module cl ml">
<ul>
<ul>
[loop]
<li rtcscls-2-s_r_0 rtcscls-2-r_5">{picwidth}px;">
<a
href="{url}"><img src="{pic}"
width="{picwidth}" height="{picheight}"
alt="{title}" /></a>
<p><a
href="{url}"
title="{title}"{target}>{title}</a></p>
</li>
[/loop]
</ul>
</div>
<li rtcscls-2-s_r_0 rtcscls-2-r_5">{picwidth}px;">
<a
href="{url}"><img src="{pic}"
width="{picwidth}" height="{picheight}"
alt="{title}" /></a>
<p><a
href="{url}"
title="{title}"{target}>{title}</a></p>
</li>
[/loop]
</ul>
</div>
下面的文章是调用论坛的内容，可以根据模块属性里的主题排序方式选择你想要的排序方式。
这样就完成了效果图左右两部分的设计
怎么制作空间方法二:
1.选择100%的框架致页面，作占位符
效果图
2去掉框架背景及边框属性
3.拖相关模块到刚才的占位符上，设计模块信息
4.编辑模块样式
5.编辑模块属性或数据->模块模板
在编辑区内编写相应模板代码
6.最后记得点保存
推存本人的第二个方法，简单直观
更多内容，请访问fenfenglee博客
发布评论