360°全景产品主图，指图片自身能够从360°等多个方向全方位展示产品的一种 GIF 动图形式。

1. 背景

对于产品颜色为白色或者浅色的情况下，就可以选用黑色或者灰色的背景色，根据产品的颜色和特征进行灵活调整。

2. 帧率

3. 图片

拍摄完成的照片需要经过加过处理，将杂乱的背景或者是不需要的细节部分进行调整优化。照片文件必须按照统一的规则去进行命名。

关于制作360°全景产品主图的工具，店匠SHOPLAZZA 向大家推荐 Sirv 插件。它有以下几大优点：

• 有免费套餐可以使用，并且免费套餐的功能已经非常充沛。

Sirv 所提供的几种套餐定价及功能

• 操作简单，针对不懂代码的卖家，能够自行使用。
• 针对想要更多自定义功能的卖家，提供 API 接口。
• 图片不光能自主旋转，也可以放入详情页中实现手动拖拽（drag to spin），使消费者能够浏览更多细节，增强互动。

1.  Sirv 插件使用方法

• 首先将拍摄好的所有产品图片按照统一的规则命名
• 接着在 Sirv (https://sirv.com/) 将账号注册好，进入插件后台
• 新建文件夹并将产品图片文件上传
• 进入文件夹后全选图片，然后点击右上角的 Create spin

• 输入文件名，默认选择 Horizontal spin (a row of images)，点击 Create，spin 文件即创建成功

• 选中 spin 文件，点击更多(…)选项
• Download as GIF - 适用商品主图
• Embed - 适用商品详情页

2.  店匠SHOPLAZZA 主图制作方法

• 点击 Download as GIF，将 GIF 文件下载下来，然后返回到 店匠SHOPLAZZA 后台，依次找到“后台设置-素材中心”，点击右上角的本地上传(Local upload)，将 GIF 文件上传

• 接着返回“商品-商品管理”找到对应的商品链接，点击添加图片，将上传好的 GIF 选中并插入(Insert)，点击保存。

3.  店匠SHOPLAZZA 详情页制作方法

• 点击 Embed 进入代码设置页面。

• 依次找到“商品-商品管理”，找到对应商品的描述部分，点击编辑框右上角“源代码(Source code)”将在 Sirv 中拿到的第一行代码复制粘贴进来。

• 如果想在详情页中把图片居中摆放，可以在特定部分加上 style="text-align: center;" 这部分代码，然后保存，示例：
• 修改前：<div class="Sirv" data-src="https://ivercerj.sirv.com/Spins/Egg-Chair/Egg-Chair.spin"></div>
• 修改后：<div class="Sirv" data-src="https://ivercerj.sirv.com/Spins/Egg-Chair/Egg-Chair.spin" style="text-align: center;"></div>

• 然后在 店匠SHOPLAZZA 店铺后台的应用市场里找到“自定义代码嵌入(Custom code)”插件，点击进入。

• 点击右上角的新增代码(Create Code)创建新的自定义代码

• 将在 Sirv 插件中拿到的第二行代码复制粘贴过来
• 用户端(Select APP)：选择 PC 端和手机端
• 出发页面(Trigger page)：选择全部
• 代码位置(Code location)：选择顶部

• 设置完成后点击保存(Save)，然后在前台商品详情描述部分就能实现手动进行拖拽旋转了。