案例作品集 浏览精选项目

Shopify Plus 升级月费减免+最高抵扣$4800开发费用 - WesWoo专属优惠

家庭能源与阳台光伏储能

Zendure Germany

Zendure 德国站销售的不只是电池,而是阳台光伏、动态电价和家庭负载协同的能源系统;Shopify 需要把复杂拓扑转成德国用户可购买的配置。

访问项目官网
Zendure SolarFlow 2400 Pro 阳台光伏储能系统
品牌官方公开视觉

核心实施拆解

从选型到加购:三条关键前端链路

德国阳台光伏要先回答这套 SolarFlow 能否接上现有光伏、家庭负载和电价策略,而不是先比电池容量。800 与 2400 是不同系统等级,容量、兼容件和并网说明必须挂在可购买的主机上。以下三条链路决定用户有没有配对本档系统。

项目背景

先明确客户怎么选,再决定前端承担什么

购买决策

购买先从家庭是否已有光伏、日用电量和目标(自发自用、削峰或备电)开始,再决定 SolarFlow 主机、AB 系列电池、PowerHub 与配件。回本逻辑、兼容与安装比单个参数更能影响决策。

交付边界

德语 Shopify 前端、能源产品信息架构、规格叙事、产品组合与本地化购买体验。

01系统分档

800 与 2400 按功率等级分流,不挤进同一变体

用户先用双向功率和扩展上限锁定主机,再选择该主机上的在售容量;两套系统等级保持独立商品。

  1. 01从阳台光伏储能系列进入功率分档
  2. 02按双向功率、光伏输入和扩展上限核对主机
  3. 03在对应商品上选择在售容量
  4. 04把电池、线缆和智能附件当作兼容组件

实现方法

  • 系列按功率等级组织,SolarFlow 800 Pro 2 与 SolarFlow 2400 Pro 作为独立商品,不共用变体矩阵。
  • 商品对象保存输入、输出和扩展上限;变体只管理在售容量,系统等级不写成选项值。
  • 电池、线缆和智能附件通过兼容关系挂到主机,而不是复制成第二套主机 SKU。

部署与验收

  • 容量上限、兼容清单和安装说明放进主题区块设置,由德国运营编辑,不必改 theme.js。
  • 技术内容区块可在主题编辑器中重排,并按官方 section 生命周期重新挂载,避免和交互内核绑死。
最终效果实现后的变化
  • 用户先确认买的是哪一档系统,再看容量,减少把 800 与 2400 当成同一商品换配。
  • 后续主机只要沿用功率分档和兼容字段,就能进入现有系列,而不重做变体结构。
查看脚本与 Shopify API 依据
SolarFlow 2400 ProSolarFlow 800 Pro 2theme.js
02能量图解

把家庭能量流画成购买前能核对的证据

产品页用系统图、规格表和容量上限讲清输入输出,加购和相关组件留在同一决策位置,倒计时不进入选型。

  1. 01桌面端并列系统图与购买栏
  2. 02用能量线标出输入输出关系
  3. 03移动端折叠长技术说明
  4. 04核对容量与兼容件后加入购物车

实现方法

  • 家庭能量流、设备组合和规格表作为主证据;黄/绿色能量线只解释输入输出,不承担促销装饰。
  • 卡片层即可区分 2400 Pro 与 800 Pro 2 的功率和扩展上限,避免进页后才发现买错档。
  • 并网、合规和质保使用高对比正文,与营销标题分层。
  • 相关组件由 Product Recommendations API 按当前主机关联刷新;倒计时停在应用扩展,不进入商品选择状态。

部署与验收

  • swiper-bundle.min.js 驱动产品与内容轮播;theme.js 与 global-component.js 负责组件注册,不把营销倒计时写进选型逻辑。
  • gsc-countdown-widget.js 保持应用扩展,不得遮挡主加购,并提供减弱动效路径。
  • 推荐区异步加载,失败时不挡住主机价格和购买操作。
最终效果实现后的变化
  • 同一产品页可以核对能量关系、容量上限和当前可买配置。
  • 促销倒计时不干扰系统选型;复杂家庭场景仍可走向咨询,而不是在看不清拓扑时下单。
查看脚本与 Shopify API 依据
swiper-bundle.min.jstheme.jsglobal-component.jsProduct Recommendations APIgsc-countdown-widget.js
03德语交易

搜索、购物车和钱包落在同一套 de-DE 语境

德语场景词能找到正确主机;加购之后,购物车同步、增值税展示和钱包入口与结账预加载使用同一本地化。

  1. 01用德语关键词进入系列或主机
  2. 02通过 Ajax Cart 提交当前主机或配件
  3. 03在德语购物车中核对数量、税费和相关组件

实现方法

  • Predictive Search API 在输入阶段返回商品与系列建议,同时承接德语场景词和型号名。
  • 加购与数量调整走 Cart Ajax 的 add 与 change;德语购物车同步由 loader.init-shop-cart-sync.de.esm.js 承接。
  • 结账预加载使用 locale=de-DE,portable-wallets.de.js 提供德语钱包入口,支付脚本停在结账边界。

部署与验收

  • 并网、增值税、配送、保修和电价说明作为德国站内容对象维护,不写进 theme.js。
  • 主机功率与扩展上限可与全球型号共享;可售电池、促销和安装说明由德国运营独立编辑。
最终效果实现后的变化
  • 从浏览、加购到结账预加载都保持德语与欧元,购物车阶段不会切回另一套市场规则。
  • 更新德国合规文案不必改交互内核,功率参数也不会被促销模块覆盖。
查看脚本与 Shopify API 依据
Predictive Search APICart Ajax: addCart Ajax: changeloader.init-shop-cart-sync.de.esm.jsportable-wallets.de.jstheme.js

运营交接

上线之后,运营团队可以继续维护

商品与内容
  • 目录以阳台光伏储能主机为交易对象;SolarFlow 800 Pro 2 与 SolarFlow 2400 Pro 分属不同功率等级,不进入同一变体矩阵。
  • 商品对象保存双向功率、光伏输入和扩展上限;变体管理在售容量;电池、线缆和智能附件按兼容组件维护。
  • 并网与电价说明作为可编辑内容对象;系列、推荐和产品页读取同一套功率与兼容字段。
市场与日常运营
  • 结账预加载为 de-DE,交易货币为欧元,面向德国消费者。
  • 并网规则、增值税、配送、保修和动态电价说明只在德国站维护,不套用其他地区主机文案。
  • portable-wallets.de.js 提供德语钱包入口;倒计时等营销扩展停在应用边界,不改 theme.js 交互内核。
资料说明公开来源与核验边界

公开资料来源

内容核验

行业、商品与公开功能依据品牌官网核验;无法从前台验证的 App、后台配置和经营数据不作推断。WESWOO 的工作范围只按项目记录和客户授权表述。

公开信息最近核验:2026-08-12

你的下一步

让品牌独立站成为可持续增长的基础设施

讨论你的项目