关于『热卖』标签和划线价格
在这篇文章中:
何为『热卖』标签
通过设置 “原价”『热卖』标签
通过 “指定商品” 优惠启用『热卖』标签
移除自动显示的『热卖』标签
更改『热卖』标签的大小和颜色
更改划线价格的颜色
移除折扣百分比 %
1. 何为『热卖』标签
当您的商品价格低于原价或给予折扣时,『热卖』标签会自动出现在商品右上方,表示该商品目前有特价。这篇文章教您如何在不安装 Product Label 扩充功能的情况下编辑此『热卖』标签。
2. 通过设置 “原价” 启用『热卖』标签
“原价” 是一个嵌入在商品编辑页面 > 订定价格部分的一个折扣功能。
一旦填上 “原价”,『热卖』和划线价格就会自动显示在商品上。
3. 通过 “指定商品” 优惠启用『热卖』标签
除了 “原价” 设定以外,若您为商品新增了 “指定商品” 促销,商品也会自动显示『热卖』标签和化线价格。
优惠必须符合以下条件系统才会自动显示『热卖』标签和化线价格:
数量 = 1,数量 = 2 或以上不会触发『热卖』标签和化线价格
优惠代码 = 不需要
限定目标客群 = 不限
4. 移除自动显示的『热卖』标签
若您希望促销商品显示不同的标签,或者您认为『热卖』标签妨碍了您的商品展示,则可以按照以下步骤移除标签:
到后台 > 销售渠道 > 线上网店 > 布景主题 > HTML/CSS > settings_data.json 文档 > 找到 " collections_show_sale_circle" > 如图改成 0 > 储存。
5. 更改『热卖』标签的大小和颜色
您也可以自由更改标签字体和背景的大小和颜色。到后台 > 销售渠道 > 线上网店 > 布景主题 > HTML/CSS > assets/theme.scss 文档
5.1 搜索 badge__text--small {
字体大小: 更改 font-size 旁边的号码
5.2 搜索 $badgeSize:
标签大小: 更改 $badgeSize: 旁边的号码
标签颜色: 在 background-color: 旁边,将 $colorPrimary 更换成您要的颜色代码
字体颜色: 在 color: 旁边,将 $colorBtnPrimaryText 更换成您要的颜色代码
6. 更改划线价格的颜色
同样到后台 > 销售渠道 > 线上网店 > 布景主题 > HTML/CSS > assets/theme.scss 文档 > 将以下代码黏贴在最底部并将颜色代码更换成您要的颜色代码 > 储存
s .money { color: #999999; }
📌 备注 : 您可以从 这里获得您要的颜色代码
7. 移除折扣百分比 %
7.1 从首页和分类页面移除 :
后台 > 销售渠道 > 线上网店 > 布景主题 > HTML/CSS > product-grid-item.liquid 文档 > 移除灰色部分 > 储存
7.2 从首页和分类页面移除(Candy, X-Force, Lucky 和 Wave 主题适用) :
后台 > 销售渠道 > 线上网店 > 布景主题 > HTML/CSS > product-grid-item.liquid 文档 > 移除灰色部分 > 储存
7.3 从商品页面移除:
后台 > 销售渠道 > 线上网店 > 布景主题 > HTML/CSS > product.liquid 文档 > 搜索 <span id="ComparePricePercent" class="product-single__sale-percent"></span> 并移除 > 储存
更新于: 29/09/2022
谢谢!