如何使用文章分类组件?

浏览数量: 4     作者: 小七     发布时间: 2015-04-24      来源: 本站

文章分类组件
 
【组件简介】 文章分类组件实现文章分类的多层级展示,通过文章分类组件可以快速查找对应分类下的所有文章。文章分类的展示方式有树状分类展示、弹出式分类展示、折叠树状分类展示等多种风格。
 
【应用场景】 文章分类组件一般应用在系统页面的文章列表的左侧栏,只要文章需要按照不同的分类进行筛选,都需要文章分类组件。在文章系统中,将文章按不同的分类进行过滤筛选是一个非常实用的方式,比如文章系统一般用来展示公司新闻动态、资质证书、新品发布、员工动态、行业资讯等很多方面的新闻,也可以按照这样的分类来划分文章。

如何使用文章分类组件? 文章分类组件通常被应用到文章总列表页面、文章详情页面,有的首页也会用文章分类组件,或其它有需要的页面。如何在页面上添加文章分类组件呢?以在文章总列表页面添加文章分类组件为例来做介绍,具体操作如下:

1、把文章总列表页面切换为当前页面。把鼠标放到“当前页面”四个字眼的右侧区域,弹出下拉菜单,在系统页面中找到文章总列表页面News,单击此页面,即可切换为当前页面;

如何使用文章分类组件?

2、在当前页面添加文章分类组件。把鼠标放到需要添加文章分类内容的位置,出现小水滴,鼠标移到小水滴(即“添加组件”按钮)上,出现“添加组件”四个字,单击下水滴,弹出”添加组件“弹出框;

找到添加组件按钮

3、在文章组件中找到”文章分类“组件,单击此组件,弹出“设置文章分类”窗口;

单击文章分类组件

4、在弹出的设置文章分类窗口,可以设置此组件的内容和风格。

文章分类组件--内容:在这里可以输入组件标题,若不显示标题则不输入。若需要对文章分类进行排序,请选择“选择部分文章分类”选项,在这里可以选择某个分类按住鼠标左键拖拽到要放置的位置,这个选项里也可以选择所有的文章分类,选中“全选”即可。

设置文章分类组件

文章分类组件--风格:单击“风格”切换到风格标签,在这里可以选择某个展示样式,其中第2个样式还可以设置菜单默认收起、展开全部或默认展开二级菜单。

设置文章分类--风格

5、内容和风格选择好以后,您可以通过对文章分类组件进行样式编辑。把鼠标放到这个文章分类组件上,左上角出现“文章分类”四个字,把鼠标放上去,出现一排小按钮,单击第2个即“编辑样式”按钮,单击此按钮,弹出“样式编辑器”窗口;

找到编辑样式按钮

6、在样式编辑器中,可以对这个组件的全局、标题栏、内容区分别进行设置,如下图所示:

编辑文章分类组件样式

组件全局--组件尺寸:可以设置组件的高度,一般清情况下都使用自适应的高度,若固定高度可能会导致不同终端下出现模块被遮挡、留白等情况,此功能请谨慎使用(手机端或PAD端出现模块被遮挡或留白情况,请首先检查是否是设置了高度所致);
组件全局--组件尺寸

组件全局--组件背景:可以这个这个组件添加颜色背景或图片背景,也可以选择背景图片的平铺模式、平铺位置、背景尺寸,不同的选择可以有不同的展示效果,可以分别点一下试一下哦。

组件全局--组件背景

组件全局--组件边框:在这里可以设置组件边框的颜色、样式(实线、虚线、双实线、点)、边框的粗细、边框的圆角。

组件全局--组件边框

组件全局--组件边距:在这里可以设置组件的内边距和外边距,内边距和外边距是如何定义的,请看下图:

设置边距后的效果图



组件--标题栏设置:可以单独对标题栏进行设置,可以选择显示或隐藏标题栏、可以设置标题栏的高度、背景、文字、边框、边距。如下图所示:

文章分类组件--标题栏设置

组件--内容区设置:可以给组件内容区添加颜色背景或图片背景、可以设置内容区非链接文字或带链接文字的字体/大小/间距/行高/对齐方式/字体样式等、可以设置内容区的边框和内容区的边距。

文章分类组件--内容区设置

7、若需要,可以复制这个组件到此页面或其他页面,单击复制组件按钮,弹出复制组件对话框,然后选择要复制到的页面。若复制到当前页面,通常会出现在原组件的下面,若复制到其它页面,通常会出现在这个页面的底端,把这个组件拖拽至指定的位置即可。复制过来的组件与原组件是两个独立的个体,修改其中一个,另外一个不受影响;

复制组件                 复制组件到某个页面

8、也可以把这个组件应用到其它页面,单击应用组件按钮,弹出“应用组件”按钮,在这里可以选择要被应用的某个页面或所有页面。通常被应用到的页面,此组件会出现在页面的底端,直接拖拽至相应位置即可。请注意:一个组件应用到其他页面后,只要在任意一处更改,被应用到的页面都会同步被修改。

应用组件         选择要应用的页面



9、可以删除此组件。单击下面的按钮,可以删除此组件。

删除组件

          微信公众号

阿里巴巴国际站

网站建设

知识圈

联系我们
  客服QQ:693557443
   服务顾问:18988788608  ( 微信 )
  邮箱:info@7datong.com
  地址 : 深圳市龙华区恒和国际大厦903室
Copyright © 深圳市七达通科技有限公司 All Rights Reserved 版权      互联网服务粤ICP备16005814号
   - 网站地图