Shopify 的两种定制选项

本文记录Shopify 产品两种定制选项的实现方法

定制方式1

左右选择不同度数,且可以购买不同的数量,比如左眼100度买2个,右眼150度买1个

最终要加入购物车要显示不同选项的不同QTY,那么需要创建变体(Variants),不同度数都是一个变体。

var formData = { 
  'items': [{
    'id': idleft,
    'quantity': qtyleft
  }, {
    'id': idright,
    'quantity': qtyright
  }]  
}
fetch('/cart/add.js', {
   method: 'POST',
   body: JSON.stringify(formData),
   headers: {
       'Content-Type': 'application/json'
   }   
})
.then(response => response.json())
.then(function(data) {

})

代码用法查看:https://shopify.dev/api/ajax/reference/cart#post-cart-add-js

定制方式2

因生产管理上的约束,通常左右眼可能成对销售,也就是不存在左2右1,只能是左2右2,或左1右1这种成对购买。那么Qty 只有一个值。这种情况更简单,因为不需要创建变体,用户选择的左右眼度数信息可以以properties的形式传递,度数选择创建一个静态liquid代码段即可。

var formData = {
  'items': [{
    'id': '42179304128725',
    'quantity': 5,
    'properties': {
      'left': '-1.00',
      'right': '-2.00'
    }
  }]
}
fetch('/cart/add.js', {
   method: 'POST',
   body: JSON.stringify(formData),
   headers: {
       'Content-Type': 'application/json'
   }   
})
.then(response => response.json())
.then(function(data) {

})

Leave a Reply

Your email address will not be published.