用途:构建或优化商品详情页(PDP),提升加入购物车转化率。适用于新建店铺商品页、优化现有 PDP、实现多选项变体选择器、添加带缩放/缩略图/滑动的图片画廊,以及集成评价、评分、库存提示等社会证明元素。
主要能力:按平台给出实现路径。Shopify 推荐使用 OS2.0 主题(Dawn、Sense、Craft)并通过主题编辑器配置,评价可接 Judge.me 或 Loox,变体色板可用 Variant Image Selector 或主题内置功能,库存紧迫感可用 Urgency Bear 或 Hurrify。WooCommerce 使用内置商品页配合 Astra、Kadence、Flatsome 等主题,评价可用 WooCommerce Product Reviews Pro 或 Customer Reviews for WooCommerce,变体色板可用 Variation Swatches for WooCommerce。BigCommerce 定制 Cornerstone 主题,启用内置评价系统,高级评价可接 PowerReviews 或 Yotpo。自定义/无头方案提供两栏响应式网格、粘性画廊、变体选择器、粘性加购栏与 JSON-LD 结构化数据等代码模式。
使用方式:先确定商家平台并选择对应方案,再配置 PDP 布局与组件,最后添加社会证明与信任信号。核心实践包括:首屏优先展示标题、价格、主图与加购按钮;变体选择器使用 fieldset/legend/radio 语义化 HTML;首屏图片 eager 加载,其余 lazy 加载;清晰展示划线原价;缺货变体禁用而非隐藏;仅使用真实库存数据做紧迫提示。
限制与注意:资料未提供该技能的具体安装命令、收费方式或平台兼容性细节。常见问题包括图片加载导致 CLS、变体选择器未更新 URL、移动端加购按钮被隐藏、画廊加载慢、评价区拖慢首屏等,资料给出了对应解决方向。