【技术教程/转载】Discuz！X5.0 X3.5的论坛分类信息个性化DIY样式设计详细教程
2024/08/15 20:27:24
#1.了解Discuz！分类信息的作用
Discuz！分类信息可以帮助论坛用户，在使用论坛的时候可以高效搜索，可以美化主题列表帖子列表等页面，顾名思义当然还是分类用户的帖子等资源，观看本教程，您将掌握Discuz！分类信息的所有使用方法。
#2. 进入分类信息的页面
首先最重要的是进入管理中心-->进入方法可以登录管理员账号，1.在主站页面找到“管理中心”字样，然后点击进入；2.在域名后输入 admin.php 进入管理中心；
点击上方导航栏处的“论坛”，再点击左侧菜单栏处的“分类信息”。
#3.讲解分类信息导航栏的功能
导航栏一共有3个内容
1.分类管理
2.内容管理
3.字段管理
1.分类管理 的详解
分类管理下可以导入和新建分类，这里显示的是你创建和导入的每个分类的基本信息；
可用操作是：新建分类、导入分类、导出分类、删除分类、查看分类的详细信息、编写分类在页面的模板。
2.内容管理 的详解
内容管理，顾名思义，就是管理分类下的内容，可以检索到分类绑定的板块下的内容，在分类设置中，如果开启了某一字段的分类的表单搜索或文字检索功能，就可以在这里搜索相应的板块下的帖子详细信息（eg：发布板块、作者信息、发布时间、浏览量、回复量）；注：通常用于信息的统计
可用操作：查询分类信息下每个版块设置了可查条件的信息
3.字段管理 的详解
在这里可以查询每个分类信息相应字段下的变量，并进行统一查看
可用操作：统一查询字段变量，新建字段分类
#4.新建一个分类信息
新建后在“新建顺序”上自己填写，名称上自己填写，描述也自己填写；这里我创建一个实例供大家参考
注：名称上面的“支持[color]”意思是支持UBB代码<--点击查看
新建完成后提交，点击导航栏的“字段管理”，这里我们在分类B处给大家教程用什么字段自定，不强求B分类
点击“添加分类信息字段”，顺序自己决定，名称自己决定，看我实例
首先在名称上输入“服务器名称”，在“变量名”处输入“server_name”这里建议参考一下Web前端企业开发命名规范，尽量使用中英翻译，使用下划线
在后面的类型中选填“变量类型”，规定这个用户要填什么，如果填写文字等信息尽量使用“文本（text）类型”，我们再添加几个
服务器地址，服务器类型，服务器基础人数，如图
这是对照表
点击上方导航的“分类管理”，点击我们新建的分类右侧的“详情”，进入后点击“服务器的分类 - 添加分类信息字段”下的“分类B”，全选我们设置的变量，然后将必填的选上，将“表单搜索”、“文字检索”、“主题展示”有需要的选择，然后点击提交；这里建议将名称、作者等信息的表单搜索、文字检索打开，名称的主题展示打开
再转到菜单栏的“版块管理”，在需要这个分类的板块下点击“编辑”，在上方导航栏处选择“其他--分类信息”，进入后点击启用，并启用我们新建的分类，再根据需要选择一些类别前置等的选项，因为有灰字介绍，这里就不多解释
我们前去发帖看看效果
效果还是很不错啊
提问环节：
Q：其他论坛的分类信息做粗来，很漂亮呐，我的怎么不行？
A:还没有设置模板呀，继续看教程
#5.分类信息模板设计
如图，高端的分类信息都很好看，我们应该怎么做出来呢？
首先我们要了解Discuz！的模板目录结构，首先Discuz！会在网站创建template模板目录，这里存放你的模板信息，如果你要给你的模板写css信息，就要到对应模板下的common目录的common.css文件中写，写在最底部，但根据企业开发规范你要在写之前加上注释（/**分类信息**/），方便知道这底下的代码是写分类信息的样式。
了解结构后点击导航栏“分类信息”，点击我们新建的分类右边的模板，我们这里只讲解帖子页模板，其他的可以自行探索，去下载别人的研究
这里写的就是HTML代码，其中代码的内容可以使用变量代替，给你们演示一下
注意：如果你要外联css，请在/template/当前使用模板/common/common.css后面自己添加，js就不要外联了，直接<script></script>跟在下面写就行了
看一下效果，刷新我们刚刚的发帖
是不是有变化了，（虽然很丑）这里不会的同学可以去学习一下基础的HTML+css
#6.结束语
声明：本帖由：吾爱破解论坛---一只小凡凡原创内容，未经允许严禁转载
感谢支持，发帖不易，免费的评分记得get√一下哦！
Discuz！分类信息可以帮助论坛用户，在使用论坛的时候可以高效搜索，可以美化主题列表帖子列表等页面，顾名思义当然还是分类用户的帖子等资源，观看本教程，您将掌握Discuz！分类信息的所有使用方法。
#2. 进入分类信息的页面
首先最重要的是进入管理中心-->进入方法可以登录管理员账号，1.在主站页面找到“管理中心”字样，然后点击进入；2.在域名后输入 admin.php 进入管理中心；
点击上方导航栏处的“论坛”，再点击左侧菜单栏处的“分类信息”。
#3.讲解分类信息导航栏的功能
导航栏一共有3个内容
1.分类管理
2.内容管理
3.字段管理
1.分类管理 的详解
分类管理下可以导入和新建分类，这里显示的是你创建和导入的每个分类的基本信息；
可用操作是：新建分类、导入分类、导出分类、删除分类、查看分类的详细信息、编写分类在页面的模板。
2.内容管理 的详解
内容管理，顾名思义，就是管理分类下的内容，可以检索到分类绑定的板块下的内容，在分类设置中，如果开启了某一字段的分类的表单搜索或文字检索功能，就可以在这里搜索相应的板块下的帖子详细信息（eg：发布板块、作者信息、发布时间、浏览量、回复量）；注：通常用于信息的统计
可用操作：查询分类信息下每个版块设置了可查条件的信息
3.字段管理 的详解
在这里可以查询每个分类信息相应字段下的变量，并进行统一查看
可用操作：统一查询字段变量，新建字段分类
#4.新建一个分类信息
新建后在“新建顺序”上自己填写，名称上自己填写，描述也自己填写；这里我创建一个实例供大家参考
注：名称上面的“支持[color]”意思是支持UBB代码<--点击查看
新建完成后提交，点击导航栏的“字段管理”，这里我们在分类B处给大家教程用什么字段自定，不强求B分类
点击“添加分类信息字段”，顺序自己决定，名称自己决定，看我实例
首先在名称上输入“服务器名称”，在“变量名”处输入“server_name”这里建议参考一下Web前端企业开发命名规范，尽量使用中英翻译，使用下划线
在后面的类型中选填“变量类型”，规定这个用户要填什么，如果填写文字等信息尽量使用“文本（text）类型”，我们再添加几个
服务器地址，服务器类型，服务器基础人数，如图
这是对照表
| Discuz！可选变量类型 | 对应解释 |
| 数字(number) | 表示数字的文本类型，只允许输入数字 |
| 字串(text) | 表示文本的数据类型，详解请点击这里 |
| 文本(textarea) | 表示文本的文本类型，允许输入任何文本 |
| 单选(radio) | 单项选择，在多组数据中只允许选择一个 |
| 多选(checkbox) | 多项选择，在多组数据中允许选择多个数据 |
| 选择(select) | 有类别的选择，看下方详例 |
| 日历(calendar) | 填写日期 |
| 电子邮件( emai) | 填写电子邮件地址 |
| 上传图片(image) | 可以上传图片 |
| 超级链接(url) | 填写网址，自动超链 如果模板自己写按钮请不要选这项，请选择文本类型 |
| 范围(range) | 在给定的值内选择 |
详例：我们去开启这个分类
选择--------------->>>>>>>>>
1 = 光电鼠标
2 = 机械鼠标
3 = 没有鼠标
1.1 = 黑色光电鼠标
1.2 = 红色光电鼠标
1.2.1 = 蓝牙红色光电鼠标
注意:
1、 "1.2.1 = 蓝牙红色光电鼠标"必须有"1.2 = 红色光电鼠标"和"1 = 光电鼠标"这两项
2、 "1.2.1"之间不能有空格
3、 字段确定后请勿修改索引和内容的对应关系，但仍可以新增字段。如需调换显示顺序，可以通过移动整行的上下位置来实现
点击上方导航的“分类管理”，点击我们新建的分类右侧的“详情”，进入后点击“服务器的分类 - 添加分类信息字段”下的“分类B”，全选我们设置的变量，然后将必填的选上，将“表单搜索”、“文字检索”、“主题展示”有需要的选择，然后点击提交；这里建议将名称、作者等信息的表单搜索、文字检索打开，名称的主题展示打开
再转到菜单栏的“版块管理”，在需要这个分类的板块下点击“编辑”，在上方导航栏处选择“其他--分类信息”，进入后点击启用，并启用我们新建的分类，再根据需要选择一些类别前置等的选项，因为有灰字介绍，这里就不多解释
我们前去发帖看看效果
效果还是很不错啊
提问环节：
Q：其他论坛的分类信息做粗来，很漂亮呐，我的怎么不行？
A:还没有设置模板呀，继续看教程
#5.分类信息模板设计
如图，高端的分类信息都很好看，我们应该怎么做出来呢？
首先我们要了解Discuz！的模板目录结构，首先Discuz！会在网站创建template模板目录，这里存放你的模板信息，如果你要给你的模板写css信息，就要到对应模板下的common目录的common.css文件中写，写在最底部，但根据企业开发规范你要在写之前加上注释（/**分类信息**/），方便知道这底下的代码是写分类信息的样式。
了解结构后点击导航栏“分类信息”，点击我们新建的分类右边的模板，我们这里只讲解帖子页模板，其他的可以自行探索，去下载别人的研究
这里写的就是HTML代码，其中代码的内容可以使用变量代替，给你们演示一下
- <div>{server_name}:<h3>{server_name_value}</h3></div><br><hr>
- <div>{server_type}:<p>{server_type_value}</p></div><br><hr>
- <div>{server_url}:<p>{server_url_value}</p></div><br><hr>
- <div>{server_num}:<p>{server_num_value}人</p></div><br>
看一下效果，刷新我们刚刚的发帖
是不是有变化了，（虽然很丑）这里不会的同学可以去学习一下基础的HTML+css
#6.结束语
声明：本帖由：吾爱破解论坛---一只小凡凡原创内容，未经允许严禁转载
感谢支持，发帖不易，免费的评分记得get√一下哦！