帮助中心
帮助中心 > 可视化组件 > 产品列表组件
产品列表组件

功能介绍

  • 在你的网站上更好的展示你的产品。

内容

1.来源:选择要展示的产品。

2.排序:选择想要优先展示的产品。

3.风格:设置产品列表的展示布局。

4.图片位置:调整图片和文字的搭配组合,以满足各种排版需求。

5.图片比例:设置产品图片的展示比例,以适应不同的列表布局。

6.分页:给产品列表添加分页、设置每页显示个数以及是否显示分页提示。需要注意的是,当不开启分页时,设置每页显示产品个数的位置在布局里。

7.查看更多:设置是否开启查看更多按钮,以更好的给予用户点击暗示。

8.移动端布局:调整图片的位置,以适应移动端布局。注意,此处的调整只影响移动端。


样式

1.产品栏:产品栏是一个抽象的概念,可以简单的把它认为下图包裹着产品图、标题和描述的红框。

2.背景颜色、边框、圆角:统一调整产品栏的背景颜色,给产品栏添加不同样式的边框以及改变圆角。

3.阴影:点击阴影编辑按钮调出阴影参数设置面板,通过设置参数来调整产品栏的阴影。

4.内边距、栏间距、行间距:调整内边距参数,来设置产品图、标题和描述到产品栏边缘的距离;通过拖动滑标或者输入数值来迅速的调整栏/行间距。

5.对齐方式:统一设置产品栏的对齐方式

6.产品栏悬停:产品栏悬停状态支持整体的背景、边框、阴影以及图片和文本的变化,还支持丰富的悬停动画。需要注意的是,在产品栏里设置图片和文本的悬停状态是整体联动的,在图文和文本里单独设置悬停状态则是独立的(鼠标要放到图片/文本上才会有悬停效果)。

7.图片:统一设置图片的各项参数

8.文本:统一设置文本的各项参数

9.标题&描述:分别调整标题和描述的各项参数,并且可以单独设置标题/描述的显示行数以及向下的间距。


注意

  • 当产品列表中布局的风格设置为轮播的时候,轮播的各项配置才会出现。
上一篇:文章列表组件 下一篇:分类组件