Discuz论坛系统DIY模块模板使用教程.docx

上传人:b****8 文档编号:9674291 上传时间:2023-05-20 格式:DOCX 页数:77 大小:5.25MB
下载 相关 举报
Discuz论坛系统DIY模块模板使用教程.docx_第1页
第1页 / 共77页
Discuz论坛系统DIY模块模板使用教程.docx_第2页
第2页 / 共77页
Discuz论坛系统DIY模块模板使用教程.docx_第3页
第3页 / 共77页
Discuz论坛系统DIY模块模板使用教程.docx_第4页
第4页 / 共77页
Discuz论坛系统DIY模块模板使用教程.docx_第5页
第5页 / 共77页
Discuz论坛系统DIY模块模板使用教程.docx_第6页
第6页 / 共77页
Discuz论坛系统DIY模块模板使用教程.docx_第7页
第7页 / 共77页
Discuz论坛系统DIY模块模板使用教程.docx_第8页
第8页 / 共77页
Discuz论坛系统DIY模块模板使用教程.docx_第9页
第9页 / 共77页
Discuz论坛系统DIY模块模板使用教程.docx_第10页
第10页 / 共77页
Discuz论坛系统DIY模块模板使用教程.docx_第11页
第11页 / 共77页
Discuz论坛系统DIY模块模板使用教程.docx_第12页
第12页 / 共77页
Discuz论坛系统DIY模块模板使用教程.docx_第13页
第13页 / 共77页
Discuz论坛系统DIY模块模板使用教程.docx_第14页
第14页 / 共77页
Discuz论坛系统DIY模块模板使用教程.docx_第15页
第15页 / 共77页
Discuz论坛系统DIY模块模板使用教程.docx_第16页
第16页 / 共77页
Discuz论坛系统DIY模块模板使用教程.docx_第17页
第17页 / 共77页
Discuz论坛系统DIY模块模板使用教程.docx_第18页
第18页 / 共77页
Discuz论坛系统DIY模块模板使用教程.docx_第19页
第19页 / 共77页
Discuz论坛系统DIY模块模板使用教程.docx_第20页
第20页 / 共77页
亲,该文档总共77页,到这儿已超出免费预览范围,如果喜欢就下载吧!
下载资源
资源描述

Discuz论坛系统DIY模块模板使用教程.docx

《Discuz论坛系统DIY模块模板使用教程.docx》由会员分享,可在线阅读,更多相关《Discuz论坛系统DIY模块模板使用教程.docx(77页珍藏版)》请在冰点文库上搜索。

Discuz论坛系统DIY模块模板使用教程.docx

Discuz论坛系统DIY模块模板使用教程

Discuz!

论坛系统DIY模块模板使用教程

今天为大家讲解一下在使用DIY过程中的一些技巧与方法

仔细阅读,受益匪浅

一、如何在模块中增加“标题”及“更多”的链接如下图样式

2010-9-2710:

02上传

下载附件(21.58KB)

方法:

通过框架或模块都可以实现上述样式  ,我们以框架为例,我们在DIY的时候  选中要编辑的框架点击编辑如下图所示

2010-9-2709:

50上传

下载附件(22.02KB)

之后点击标题

2010-9-2709:

59上传

下载附件(2.28KB)

在弹出的层中可以添加标题及链接,位置选择居左  如下图所示  同时可以设置标题的颜色及大小

2010-9-2710:

08上传

下载附件(9.69KB)

接下来增加“更多”的链接  点击弹出层的添加新标题按扭如下图所示  ,会“复制”出一份新的标题  你只需修改就可以了

把其中的“精彩教程”改成“更多”,链接以及字体、颜色都进行修改就可以了,这里的位置一定要选择“居右”

2010-9-2710:

15上传

下载附件(13.22KB)

完成,这样框架就有了标题及更多    ,模块的方法同上

二、DIY的模块中如何调整链接的颜色如下图样式

2010-9-2710:

26上传

下载附件(28.05KB)

方法:

选中要修改的模块,点击编辑,选择数据  如下图所示

2010-9-2710:

42上传

下载附件(20.86KB)

在弹出层中选择编辑  如下图所示

2010-9-2710:

45上传

下载附件(20.49KB)

在弹出的层中可以对标题进行加粗、斜体、加下划线、修改颜色等操作

2010-9-2712:

17上传

下载附件(15KB)

完成

三、如何在现有的模块中添加新的数据  

选中要添加数据的模块点击编辑--数据  如下图所示

在弹出的层中选择任意一条数据  点击编辑  如下图所示

点击编辑后在弹出的层中选择从数据源获取此处可以添写帖子ID、文章ID、日志ID、图片ID来获取数据如下图所示

2010-9-2712:

58上传

下载附件(15.02KB)

点击获取会填充模块内相应的数据字段(此处的数据字段会根据模块样式的不同有所变化,请注意)

完成

四、DIY时如何调用外部程序的数据  

当我们与第三方程序整合后如何在门户、频道、论坛、或可以DIY的区域调用这些第三方程序的数据

首先我们可以在需要调用的地方拖一个展示类中的静态模块如下图所示

2010-9-2713:

15上传

下载附件(31.44KB)

如上图所示选择数据来源为“自定义HTML”  

一般第三方系统的数据调用都会有输出JS格式的我们把第三方程序提供的JS代码粘贴进HTML代码框就可以了

如下图所示  

2010-9-2713:

21上传

下载附件(10.65KB)

完成

五、首页多格或首页四格如何DIY出来

我们以论坛首页为例(在任何页面都可以)来制作一个首页四格

首先在论坛首页拖一个1:

1的框架  如下图所示

2010-9-2713:

36上传

下载附件(47.78KB)

接下来向已拖好的1-1框架的框架里左侧的1里面拖入一个1:

1的框架如下图所示

2010-9-2713:

41上传

下载附件(48.89KB)

接下来向右侧的1里面也拖入一个1:

1的框架  如下图所示

2010-9-2713:

52上传

下载附件(41.48KB)

接下来我们就可以通过拖拽模块到框架中去了

2010-9-2714:

44上传

下载附件(28.15KB)

此时我们可以去掉框架的标题,同时为每一个模块增加一个标题  如下图所示

2010-9-2714:

48上传

下载附件(16.51KB)

你可以通过不同的模块样式或者CSS来美化这里  

完成

六、如何修改整个模块的链接样式  比如下图

2010-9-2715:

04上传

下载附件(10.25KB)

方法:

选中要编辑的模块  ,点击编辑--样式  进行修改如下图所示

2010-9-2715:

09上传

下载附件(13.95KB)

以上修改针对整个模块

完成

七、如何修改两个模块或两个框架之间的距离  如下图样式

2010-9-2715:

45上传

下载附件(5.19KB)

选择要编辑的框架或者模块  ,点击编辑--样式选择外边距,勾选分别设置,在右边距中写入合适的数字就可以了例如10

如下图所示

2010-9-2715:

51上传

下载附件(9.93KB)

完成后的效果  如下图样式

2010-9-2715:

53上传

下载附件(4.74KB)

全方位立体式讲解DIY技巧集锦第二弹

一、DIY中TAB框架如果切换点击方式(鼠标点击与鼠标滑过)

    

    如下图中的效果如何实现

2010-10-1109:

53上传

下载附件(5.3KB)

    实现方法:

拖一个TAB框架到页面中,点编辑,选择标题如下图所示

2010-10-1109:

53上传

下载附件(4.01KB)

在弹出的窗口中选择切换类型如下图所示。

2010-10-1109:

53上传

下载附件(9.4KB)

你可以根据你的需要选择是点击还是滑过

完成

二、在DIY模块中的模块数据中固定是什么意思,如下图

2010-10-1110:

50上传

下载附件(18.17KB)

解答:

当勾选固定后此条数据将不会随着模块属性当中的条件进行更新,也就是说,此条数据将永久不变,除非把勾选去掉

三、如何实现两个模块中间一条竖线的效果,如下图效果

2010-10-1115:

13上传

下载附件(19.99KB)

实现方法

    选中要操作的DIY模块选择样式  如下图所示

2010-10-1115:

41上传

下载附件(23.98KB)

    在弹出的层中,选择边框的分别设置,在边框的“左”大小设置为1px,“样式”选择实线,“颜色”选择灰色,如下图所示

2010-10-1115:

37上传

下载附件(12.51KB)

这样设置后我们就能看到一个边线了  这时你会看到内容与边线挤在了一起  如下图所示

2010-10-1115:

47上传

下载附件(14.77KB)

接下来我们进行调整内边距改变上图中的样式  同理,打开样式编辑层选择“内边距”点分别设置在“左”中添加10px

2010-10-1116:

17上传

下载附件(13.06KB)

  调整后如下图所示  

2010-10-1116:

20上传

下载附件(14.98KB)

大家可以根据实际情况调整内、外边距的大小与边框的设置,灵活使用

四、如何将一个文章模块转换为一个帖子模块  

    比如官方提供的门户及频道都是文章类模块,我们如何转换为帖子类  

    编辑模块的属性  把其中的模块分类进行切换  如下图所示

2010-10-1116:

37上传

下载附件(12.89KB)

选择帖子模块就可以变换  这里要注意  切换之后,原来的模块样式将变成私有的(自定义样式)修改显示样式只能通过模块模板进行修改

五、如何在模板(官方发布的频道及门户)里面插入DIY区域  ,如下图所示

2010-10-1117:

39上传

下载附件(454.37KB)

首先打开模板文件例如亲子模板,打开template\default\portal\list_baby.htm  文件  

找到这两段代码的之间插入一行代码

1.

--[diy=guanggao]-->

--[/diy]-->

复制代码

其中“guanggao”可以任意取名,注意不可与本模板中其它重名,必须保证唯一性如下图所示

2010-10-1117:

53上传

下载附件(7.55KB)

[功能介绍]教你如何把切割好的html页面转换成可供DIY的页面(高级教程)

今天给大家讲讲如何把已经切割好的html页面或者模仿的页面转换成可供DIY的页面

请跟随教程一步一步操作  如有疑问请提出

以下以家居频道为例为大家讲解

我们常见的切割好的html页面包含这么几个元素

如下图  图片文件夹、CSS文件夹、其它文件或图片文件夹、一个html页面  

2010-9-2610:

14上传

下载附件(2.65KB)

大家看下页面效果

2010-9-2610:

32上传

下载附件(1.61MB)

接下来,我们就把这个页面转换成DIY页面  

首页我们用编辑工具打开index.html页面

我们为了能够使用统一的头部样式,这里面我们引入系统内置的头部文件(header)把页面中的关于头部的信息删除

如下图所示

2010-9-2610:

50上传

下载附件(79.28KB)

把系统头部(header)引入进来

引用代码

1.

--{subtemplatecommon/header}-->

复制代码

如下图所示

2010-9-2610:

53上传

下载附件(14.82KB)

给新的模板起个名字

如下代码

1.

--[name]家居频道模板[/name]-->

复制代码

如下图所示

2010-9-2611:

22上传

下载附件(15.25KB)

接下来增加可供DIY的CSS样式表

如下代码

1.

复制代码

如下图所示

2010-9-2611:

27上传

下载附件(16.22KB)

头部

接下来更换底部代码  

找到底部代码删除掉换成系统内置的通用底部代码  

如下图所示

2010-9-2611:

44上传

下载附件(22.92KB)

增加如下代码

1.

--{subtemplatecommon/footer}-->

复制代码

如下图所示

2010-9-2611:

47上传

下载附件(5.03KB)

到此基本改造完成接下来我们把改造好的文件放在系统目录中去

首先我们把index.html文件改名

把index.html改成list_home.htm  此处一定要注意  频道模板必须以list_开头,后缀名为.htm  

把改好名的list_home.htm文件拷贝到template\default\portal目录下  

同时在template\default\portal目录新建一个home文件夹用来放家居频道的图片及样式表

此时复制原来的文件夹

2010-9-2611:

58上传

下载附件(4.5KB)

到template\default\portal目录的home文件夹如下图所示

2010-9-2613:

11上传

下载附件(7.52KB)

接下来用编辑器打开list_home.htm文件引入样式表文件

代码如下

1.

复制代码

如下图所示

2010-9-2613:

20上传

下载附件(12.99KB)

同进查找

2.              

10.          

复制代码

把其中的

1.

复制代码

换成

1.

--[diy=diy1]-->

--[/diy]-->

复制代码

完成后是这个样子

1.

2.              

--[diy=diy1]-->

--[/diy]-->

3.          

复制代码

其中的[diy=diy1]和divid="diy1"  要匹配且在一个页面中不能重复  如果要在第二个区域里面使用的话就应该是

[diy=diy2]和divid="diy2"  或者  [diy=home]和divid="home"  或者  [diy=discuz]和divid="discuz"  只要在一个页面内不重复随你怎么写都可以

如下图所示

2010-9-2614:

15上传

下载附件(13.47KB)

此时就完成了占位数据转换成DIY区域的过程  在上面的过程中这样的替换并不是最优化的,我们接下来进行改进,让DIY更加灵活

此处的结构是这样子的  如下图

2010-9-2614:

21上传

下载附件(17.3KB)

实现它的代码是这样子的

1.

2.          

玩转极简主义构造冷色系居室空间

3.          

今夏最流行的设计当属极简主义,色彩也从华丽深沉转变为了优雅素净。

玻璃、金属、木质等较能体现简单特性的材质..[详细]

4.          

5.              

13.          

14.        

复制代码

我们可以把整个区域做为一个DIY区域  

接下来我们进入后台--》门户--》模块模板--》  

点击添加,这里我们以文章为例  ,选择文章类进行提交

为模板起个名称  比如  “首页中间列表”

删除代码框里面的内容拷贝上面的代码进来

1.  

2.          

玩转极简主义构造冷色系居室空间

3.          

今夏最流行的设计当属极简主义,色彩也从华丽深沉转变为了优雅素净。

玻璃、金属、木质等较能体现简单特性的材质..[详细]

4.          

5.              

13.          

14.        

复制代码

如下图所示

2010-9-2614:

31上传

下载附件(39.54KB)

接下来把代码框中的代码进行转换  

把  以下代码

1.  

2.          

玩转极简主义构造冷色系居室空间

3

展开阅读全文
相关资源
猜你喜欢
相关搜索
资源标签

当前位置:首页 > 法律文书

copyright@ 2008-2023 冰点文库 网站版权所有

经营许可证编号:鄂ICP备19020893号-2