定制购物车按钮和购物车包装——Webflow电子商务中的购物车组件概述。
购物车组件允许您向项目中添加购物车。您可以自定义购物车按钮的外观和感觉,这不仅允许在线购物者打开购物车,还可以为他们提供购物车中商品数量和小计的快速概述。
您还可以自定义和样式购物车本身。在这里,在线购物者可以编辑他们的购物车内容,并在他们准备完成购买时结账。
您可以从添加面板或使用快速查找(CMD/CTRL+E)添加一个购物车组件。
cart组件由两个包装器组成:
默认情况下,购物车按钮有一个图标、一个文本块和车的数量元素。您可以添加其他元素,例如不同的图像或文本块,并按您的意愿设置购物车按钮的样式。
对象中的任何文本元素都可以连接购物车按钮总数量购物车欧宝体育在线首页里的产品小计购物车项目的数量。
购物车数量元素显示购物车中物品的总数。控件中关闭该元素可以隐藏该元素购物车按钮设置在元素设置面板。设置时可用购物车按钮在画布上选择包装器。
隐藏车的数量元素设置→推车按钮设置。
你也可以选择只当购物车为空时隐藏购物车数量.要访问购物车数量设置,请双击车的数量元素在画布上。
当购物车为空时隐藏购物车数量在元素设置下>购物车数量设置。
了解更多:定制购物车按钮
购物车包装器是包含购物车容器的div块。推车容器是许多较小组件的一个组件。它有一个标题和一个表单包装器。表单包装器包含购物车列表,马车行项目,付款操作.您可以自定义和样式化大多数这些包装器及其子元素。推车也有空的状态而且错误状态您可以自定义的消息。
必须知道:有些物品不能从购物车中移除,以保留购物车的功能。
这是一个连接到产品集合的集合列表,显示添加到购物车中的项目(或项目的示例)。欧宝体育在线首页除了一些限制之外,您可以更新购物车列表项的结构和设计。
这显示了购物车的小计。您可以复制这个包装器并自定义它以显示项目的总数。
很高兴知道:购物车行项目中的任何文本链接都可以从元素设置面板连接到购物车的小计或数量。
的付款操作包装器允许用户最终完成购买。默认情况下,它包含结帐按钮而且网络支付按钮,您可以从元素设置面板.你也可以添加一个贝宝按钮从添加面板.
注意:如果您的商店只使用贝宝,结帐按钮在购物车中会自动隐藏在发布的站点上,因为贝宝付款使用不同的页面。
要编辑和自定义购物车,请在画布上选择购物车,然后打开车从车包装器设置在元素设置面板(D).在这里,你可以选择车类型,宽松而且持续时间的打开和关闭动画,以及要在购物车中显示的项目数量预览.如果您愿意,也可以指定在添加产品时打开购物车欧宝体育在线首页到它。并访问购物车的各种状态,分别设置它们的样式。
打开或关闭购物车以查看和编辑购物车包装器。
从预定义的推车类型中选择:
设置宽松动画如何播放,推车何时打开和关闭。默认的缓动是“缓出四轴”。
设置持续时间以毫秒(ms)为单位的动画。默认值为300ms。
如果您想在每次新产品添加到购物车时打开购物车,请选中此框。欧宝体育在线首页
在购物车的不同状态之间切换,以编辑和自定义每种状态。
你可以恢复默认来自错误消息编辑器的错误消息。
选择要在购物车中显示的商品数量。您可以选择显示单个项目或最多显示15个项目。默认为“3”项。