Shopify兼职之商品详情页折扣码

警告：多图模式，手机党朋友慎入！

借鉴网站的效果：

实现的效果：

实现思路：

借用metafields来实现单个商品的折扣。客户也同意了，因为那边的商品不同渠道商经常变更价格，所以这边也会经常变动价格。所以在metafields的商品里面增加了两个字段：折扣、折扣码。

操作步骤

1.在左侧创建三个文件：

product-discount:页面折扣和折扣码显示文件。也就是如下截图：

component-product-discount.css: css文件

component-product-discount.js: js文件，主要实现折扣码的复制。

2.产品详情界面引用：

标记红色的地方就是引用（注意文件名称一定要一致，我就是单词拼写错了，找了很久才看到），建议在本地写好，直接上传资产。

schema里面增加引用：

本地化语言配置：

开始引用：

3.自定义界面进行展示

完成上述的操作，完了吗？没有的哦，还需要到自定义界面进行展示：

进入界面后，找到商品详情界面

模块是可以拖动调整顺序的，大家可以按照自己的要求来进行排序。

1：这个按钮点中后可以拖动排序。

2：界面上的呈现效果。

3：显示隐藏界面的模块内容。

4.配置商品元字段属性

不知道怎么添加元字段的朋友，请百度一下。或者我后面再建单写一下。

完事收工！

PS：这点东西我搞了一天一夜，到处查文档，问客服。基本没有回复，一点点抠出来的。希望能帮到大家。