这是一个 WooCommerce 层级定价插件,主要是给一个使用 WooCommerce + Woodmart 主题 的外贸商城做的。

这个需求挺典型:客户不是单纯做零售,而是带一点批发属性。用户买得越多,单价越低。比如买 10 件一个价格,买 50 件又是另一个价格。

WooCommerce 默认更偏普通零售逻辑,商品页一般就是选规格、选数量、加入购物车。但客户的商品有很多变体,比如颜色、尺寸、型号,如果每次只能选一个变体加入购物车,批发用户操作起来会很麻烦。

所以这个插件主要做的是:

在商品页展示阶梯价格,让用户一次选择多个变体数量,并且购物车和支付时真实按层级价格结算。

层级定价1.png

后台规则配置

插件后台做了一个独立的“分层定价”管理入口。

层级定价2.jpg

管理员可以创建不同的价格规则,比如:

  • 1-9 件:原价
  • 10-49 件:95 折
  • 50 件以上:9 折
    规则支持几种计算方式:
  • 百分比折扣
  • 固定金额折扣
  • 固定价格
    也可以设置起购数量。比如某个商品最少 5 件起买,用户没有买够数量时,前端会弹出提示,不让直接加入购物车。

选商品这块也做了管理界面,不是让管理员手动输商品 ID。后台可以搜索商品名称、SKU,按分类筛选,也可以一次把某个分类下的商品全部加入规则。对商品比较多的商城来说,这样会省事很多。

层级定价3.jpg

商品页展示

前端商品页会显示一个层级价格区域。

上面是价格档位,比如:

  • $10.00 / 1-9
  • $9.50 / 10-49
  • $9.00 / 50+
    下面是商品变体列表。每个变体一行,显示图片、SKU 或属性名称、当前价格、库存状态和数量加减按钮。

用户加减数量时,插件会实时计算当前命中的价格档位,并高亮对应的阶梯价格。这样用户能很直观看到:如果再多买几件,单价会不会更低。

这个交互对批发型商品挺重要。用户不用来回切换变体,也不用自己算总数,直接在一个表格里把不同规格的数量填好就行。

适配 Woodmart 主题

这个插件点名是给 WooCommerce + Woodmart 主题 做的。

Woodmart 是很常见的 WooCommerce 商城主题,尤其外贸站用得很多。但它对商品页做了很多自己的结构,比如商品图库、变体图片、AJAX 加购、购物车计数、按钮样式等,和 WooCommerce 默认模板不完全一样。

所以适配的时候不能只按 WooCommerce 原生结构来写。

插件里专门处理了几个地方:

  • 点击变体图片时,自动更新 Woodmart 商品主图
  • 兼容 Woodmart 的商品图库和轮播结构
  • 尽量复用主题原来的加入购物车按钮样式
  • AJAX 加购后同步更新购物车数量
  • 不破坏 Woodmart 商品页原有布局
  • 兼容简单商品和可变商品
    这个地方挺容易踩坑。很多插件在默认主题里正常,一换到 Woodmart 就会出现图片不更新、按钮被主题接管、AJAX 加购没反应、购物车数量不刷新等问题。

多变体批量加入购物车

这个插件比较实用的功能,是可以一次选择多个变体数量。

比如一个商品有多个颜色,用户可以这样选:

  • 黑色 5 件
  • 白色 10 件
  • 蓝色 8 件
    然后点一次加入购物车,插件会把这些变体分别加入购物车。

这里还有一个细节:起购数量和层级价格,不是每个变体单独算,而是按同一个父商品下所有变体数量合计。

也就是说,如果规则是 20 件起享受批发价,那么黑色 5 件、白色 10 件、蓝色 8 件,总数 23 件,就应该进入 20 件以上的价格档。

这个逻辑对批发场景更合理。因为客户买的是同一款商品的不同规格,本质上还是同一个产品的批量采购。

购物车和支付流程适配

这个插件真正麻烦的地方,其实不是商品页把价格算出来,而是 购物车和支付流程里也必须按同一套价格结算 。

如果只是前端展示一个优惠价,那很简单。但 WooCommerce 在加入购物车、进入购物车页、结账页、提交支付时,都会重新读取商品价格并计算总价。如果没有接入 WooCommerce 的购物车计算链路,用户在商品页看到的是优惠价,到了购物车可能又变回原价。

所以这里做了几层处理:

  • 加入购物车时,把命中的层级价格写入购物车项目数据
  • WooCommerce 计算购物车总价前,重新设置商品实际价格
  • 购物车数量变化时,重新判断是否命中新价格档位
  • 用户恢复购物车商品时,也重新计算层级价
  • 购物车里显示原价、优惠价、折扣比例和节省金额
  • 结账页沿用购物车中的最终价格
  • 确保支付网关拿到的是层级定价后的金额
    这个地方最容易出问题的是数量变化。

比如用户在商品页选了 8 件,没有达到优惠档。到了购物车里改成 12 件,就应该自动进入 10 件以上的价格档。反过来,如果从 12 件改回 3 件,也应该取消优惠价,恢复原价。

还有多变体场景也比较麻烦。用户可能不是一个变体买 10 件,而是多个变体合起来达到 10 件。如果购物车里只按单个变体数量算,就会和商品页展示逻辑不一致。

支付流程也要特别小心。WooCommerce 最终扣款金额不是看前端显示,而是看购物车对象里真实参与计算的商品价格。所以插件必须在购物车计算阶段重新写入价格,保证购物车、结账页、支付网关三边金额一致。

这也是这个插件和普通“价格展示插件”的区别:它不只是告诉用户买多便宜,而是真的把层级价格接进了 WooCommerce 的结算链路。

多币种兼容

这个项目还考虑了多币种兼容。

客户站点是外贸商城,Woodmart + WooCommerce 这类组合经常会配货币切换插件。插件里会尝试识别当前货币,并按当前货币下的商品价格计算层级价,而不是固定使用后台默认币种。

这个细节挺重要。否则前端显示美元,购物车却按默认币种计算,价格就会乱。

做完后的效果

做完以后,商品页更像一个批发下单表。

用户不用一个规格一个规格地反复选择,也不用自己算满多少件便宜。直接在商品页填数量,系统自动算价格、自动判断起购数量、自动加入购物车。

对站长来说,后台只需要维护层级规则和应用商品。对用户来说,购买流程还是 WooCommerce 原来的购物车和支付流程,只是价格规则变得更适合批发场景。

简单总结

这个插件可以理解成一个面向 WooCommerce + Woodmart 主题 的批发层级定价工具。

它主要解决了几个问题:

  • 后台灵活配置不同商品的数量阶梯价格
  • 商品页直观展示买多少对应什么价格
  • 多变体商品支持批量选择数量
  • 按父商品总数量计算起购和优惠档位
  • 购物车、结账页、支付网关真实按层级价结算
  • 兼容 Woodmart 商品页结构和多币种场景
    这类项目不是特别花哨,但很贴近实际电商需求。尤其是外贸商城和批发站,价格规则、变体选择、购物车结算这些地方只要有一个环节没接好,用户下单体验就会很别扭。

所以这个插件最重要的不是“显示一个阶梯价格表”,而是把商品页、购物车和支付流程整个打通。