影片元件｜Shopper App

在编辑 App 首页时，您可以透过新增「影片元件」，在 App 首页加入 Youtube 或是 Vimeo 影片，并且可调整影片的位置。

⚠️ 开始前请注意：此功能在香港地区仅支持 Shopper App Pro 版本。

本篇文章将介绍：

• 增加影片元件
• 编辑影片元件

一、 增加影片元件

步骤一

前往 SHOPLINE 后台 >「Shopper App 管理 > App 设计 > 目前版型」，点选「设定」进入 App 页面编辑器。

步骤二

点选「添加元件」按钮。

步骤三

选择影片元件，拖曳至中间预览区提示可以放置的位置处，预览区出现影片元件即代表新增成功。

二、 编辑影片元件

步骤一

在栏位中输入 YouTube、Facebook 或 Vimeo 影片网址。

＊注意：Facebook 影片网址仅支援 videos 或 watch 格式，例如：

• https://www.facebook.com/Creator/videos/01234567890
• https://www.facebook.com/watch?v=0123456789

 步骤二

开启此选项，影片显示时会延伸至荧幕左右两侧，不留空白。

步骤三

点选「新增图片」上传影片封面图，支援 JPG/PNG/JPEG/GIF 档案，大小不超过 2MB。

＊注意：

• 封面图可依需求选择是否上传，但若您设定 Facebook 影片，为避免模糊封面，建议上传清晰的封面图。
• 上传封面图后，Facebook 影片将无法在预览区播放，但不影响顾客在 App 中观看。

步骤四

在影片链接的下方，可选择「图片（影片）比例」。您可依据您影片的比例决定采用横式或直式的前台呈现方式。

• 横式比例为 16:9。

  

   

• 直式比例为 9:16。

  

步骤五

设定标题，标题预设为关闭状态。开启开关显示标题，注意标题内容不能超过 30 个字元。

步骤六

设定说明文字，开关预设为关闭状态。开启开关显示说明文字，不能超过 50 个字元。

步骤七

设定预约上架时间。点击起讫时间栏位右侧的「月历」图标选择日期时间，或勾选下方「永不过期」。

若点击图标选择日期时间，会跳出弹窗（如下图），设定完成后点按「确定」即可。

步骤八

若需移动元件位置或删除元件，可于左侧元件列表区（➊）、中间预览区（➋）或右侧元件底部（➌）进行相关操作。

步骤九

确认完成设定后，可先点按「储存」保存元件变更。若已完成影片元件的所有编辑，可点击「更新并使用」。