Embedded 3D product presentation

把商品页变成可交互的 3D 展示窗口

VirtuKit 为模型、套件、机械结构和装配类产品提供可嵌入的 Product 3D 与 Assembly Instructions。客户不用离开商品页，就能查看产品形态、细节、方向和安装步骤。

查看嵌入方式了解功能

商品页场景 先让客户理解 3D 模块在页面中的位置。

降低首屏压力 真实 3D 放在下方对照区中集中演示。

同一个商品，可以分成三个层面展示

客户先用图片确认外观，再用 Product3D 检查结构和比例；需要安装说明时，再打开独立的大尺寸装配说明，不把说明书挤在小窗口里。

商品图片

适合放在商品页最前面，快速确认外观、包装印象和基础识别信息。

Product3D

作为商品详情页的核心互动层，让客户在购买前看清模型结构和关键细节。

装配体说明书

默认不加载，用户需要时再打开独立说明区域；区域高度默认 680px，也可以由客户页面通过嵌入参数或容器尺寸自动设置，降低首屏压力。

为商品详情页补上“看得懂”的空间说明

静态图片适合展示外观，3D 模型更适合解释结构、比例和安装关系。VirtuKit 的嵌入模块可以放在商品卡片、详情页、说明书页或售后支持页面。

交互式模型展示

客户可以旋转、缩放、观察产品细节，减少只看图片时的误解，尤其适合模型、零件、套件和复杂结构商品。

装配说明模块

同一套嵌入框架可以加载 Assembly Instructions，把步骤、零件和视角组合到客户页面里。

API

授权后自动显示

系统根据客户代码、API Key、商品编号和来源域名判断权限。没有授权时默认不显示空窗口。

客户网站只需要嵌入一段脚本

VirtuKit 会根据商品编号加载对应的 3D 展示或装配说明。商品编号可以直接写入，也可以从页面属性、meta 标签或 URL 中自动读取。

<script
  src="https://www.virtu-kit.cn/embed.js"
  data-client="virtu-kit-cn"
  data-key="YOUR_API_KEY"
  data-item="536"
  data-modules="product,assembly"
  data-product-height="380px"
  data-assembly-height="680px">
</script>

从测试到上线的路径很短

上线工作分为两边：VirtuKit 负责模型、授权、模块配置和脚本生成；客户只需要确认商品页位置、提供域名，并把脚本放入页面模板。

01 客户提供测试域名、商品编号和希望嵌入的位置。

02 VirtuKit 生成 API Key，授权域名、商品和可用模块。

03 客户把 VirtuKit 提供的脚本放入商品页模板。

04 双方验收显示效果；VirtuKit 扩展更多 SKU，客户发布到正式页面。

适合这些客户场景

页面可以作为当前 DO 测试服务器首页，用于向潜在客户解释 VirtuKit 会如何出现在他们的网站中。

商品详情页增强

在价格、规格、图片之后加入 3D 模块，让客户在购买前看清结构和比例。

装配与售后说明

把说明书从 PDF 或图片升级为可交互步骤，降低安装和售后沟通成本。

经销商页面嵌入

同一套模型服务可以授权给不同客户域名，按客户、Key 和商品控制展示范围。

新品推广演示

在新品上线前先提供一个可访问测试页，方便销售、客户和合作方快速理解产品。

把单品测试扩展成客户接入样板

当前页面已经接入真实 Product3D，并把装配说明改为按需加载。后续可以复用同一段脚本，为不同客户域名、商品编号和展示模块生成授权。

复制接入结构