媒体 — 视频

Last update: Sat Jul 13 2024 00:00:00 GMT+0000 (Coordinated Universal Time)

主题：

创建对象：

初学者
中级
用户

使用视频内容类型将托管在YouTube或Vimeo上的视频添加到Page Builder 阶段。将视频嵌入到页面或块或者产品和类别描述中很容易。

店面主页上的 {width="700" modal="regular"}

NOTE

如果您对Page Builder内容进行了重大更改，建议您增加管理员会话生命周期以防止会话在您工作时超时。

视频工具箱

工具

图标

描述

移动

{width="25"}

将视频移动到舞台上的另一个位置。

（标签）

Video

将当前内容容器标识为视频。将鼠标悬停在图像容器上可查看工具箱。

设置

{width="25"}

打开 Edit Video 页面，您可以在其中更改视频和容器的属性。

隐藏

{width="25"}

隐藏当前视频。

显示

{width="25"}

显示隐藏的视频。

复制

{width="25"}

制作视频的副本。

移除

{width="25"}

从舞台上删除视频。

NOTE

隐藏元素存储在数据库中，对客户不可见。但是，这些元素对搜索引擎和对您的网站爬网的其他机器人可见。如果通过具有不可见属性的API调用发出请求，则它们也会作为内容的一部分返回，除非您将它们从阶段中删除。

添加视频

在开始之前，请导航到要嵌入的YouTube或Vimeo视频，并复制链接。

作为替代方法，您还可以将直接链接复制到有效的视频文件。有关有效链接，请参阅基本视频设置。
在Commerce管理员中，返回到要添加视频的Page Builder工作区。
在Page Builder面板中，展开 Media 并将 Video 占位符拖到舞台上。

{width="600" modal="regular"}
将鼠标悬停在视频容器上以显示工具箱，然后选择设置（ {width="20"} ）图标。
对于 Video URL，粘贴您复制的视频的URL。

此示例中使用的Page Builder视频的URL是： https://www.youtube.com/watch?v=Y0KNS7C5dZA。
要限制视频的 Maximum Width，请输入最大宽度（以像素为单位）。

如果留为空白，则视频宽度与容器允许的宽度一样宽，允许使用边距和边距。
单击右上角的 Save 以应用设置并返回到Page Builder工作区。

更改视频设置

将鼠标悬停在视频容器上以显示工具箱，然后选择设置（ {width="20"} ）图标。
根据以下部分修改设置：
- 基本
- 高级
单击右上角的 Save 以应用设置并返回到Page Builder工作区。

基本视频设置

若要更改当前视频，请更新 Video URL。

请输入有效的视频URL。有效的视频URL可以是指向的链接：
- YouTube视频： https://youtu.be/CoDhMRUUjeI
- Vimeo视频： https://vimeo.com/190156113
- 有效的视频文件（建议使用.mp4）： https://myvideos.com/spiral.mp4
要更改店面中视频允许的宽度，请输入新的 Maximum Width 像素。

如果留为空白，视频会扩展容器的完整宽度，并减小边距和边距的容差。
要在页面加载后自动启动视频，请将 Autoplay 设置为Yes。

如果自动播放设置为Yes，则根据策略在播放时将视频静音。但是，即使使用此设置，移动设备也无法自动播放您的视频。有关这些策略的更多信息，请参阅以下开发人员资源：
- 来自Vimeo的自动播放策略
- 来自Google (Chrome/YouTube)的自动播放策略
- 本地视频的自动播放策略
如果自动播放设置为No，则视频仅按用户要求播放。

Advanced

要控制视频在容器中的水平位置，请选择 Alignment：

table 0-row-2 1-row-2 2-row-2 3-row-2 4-row-2 layout-auto
选项	描述
`Default`	应用在当前主题的样式表中指定的对齐默认设置。
`Left`	沿视频容器的左边框对齐内容，并允许使用指定的任何边距。
`Center`	将内容与视频容器的中心对齐，并允许指定的任何边距。
`Right`	沿视频容器的右边框对齐内容，并允许指定的任何边距。

设置应用于视频容器所有四个侧面的 Border 样式：

table 0-row-2 1-row-2 2-row-2 3-row-2 4-row-2 5-row-2 6-row-2 7-row-2 8-row-2 9-row-2 10-row-2 layout-auto
选项	描述
`Default`	应用关联样式表指定的默认边框样式。
`None`	不提供任何容器边框的可见指示。
`Dotted`	容器边框显示为虚线。
`Dashed`	容器边框显示为虚线。
`Solid`	容器边框显示为实线。
`Double`	容器边框显示为双线。
`Groove`	容器边框显示为一条开槽线。
`Ridge`	容器边框显示为脊线。
`Inset`	容器边框显示为内嵌行。
`Outset`	容器边框显示为外线。

如果设置了除None之外的边框样式，请完成边框显示选项：

边框颜色 {width="600" modal="regular"}

table 0-row-2 1-row-2 2-row-2 3-row-2 layout-auto
选项	描述
Border Color	通过选择色板、单击拾色器或输入有效的颜色名称或等效的十六进制值来指定颜色。
Border Width	输入边框线条宽度的像素数。
Border Radius	输入像素数，以定义用于使边框每个角倒圆角的半径大小。