Page Builder | 展示视频内容

您可以使用 Page Builder(高级卡片)来自由创建和定制卡片布局,以实现多样化的视觉效果。

本教程将介绍一些常用的视频组件和预设卡片,帮助您掌握视频元素的基本用法和原理。通过这些知识,您可以举一反三,创建出符合您需求的视频卡片,丰富您的网站内容。

视频组件介绍

在主题装修中,点击添加卡片 > 高级卡片广场可以添加高级卡片。高级卡片配置界面点击组件 > 通用 > 视频可以添加两个类型的视频组件。

  • 两个视频组件分别是:
    • 支持上传本地视频的卡片组件。

    • 支持链接YouTube 视频作为视频源的卡片组件。

  • 推荐上传/链接的视频比例:

视频组件的推荐比例有4个,分别是 1:1 / 4:3 / 16:9(横版视频) / 9:16(竖版视频)。如果视频是以上4个对应的尺寸,配置对应比例可以让视频完整无裁切或黑边的播放。

视频列表卡片

预设的视频列表卡片可以实现多个视频排列成排,且可以滑动/轮播展示的效果。

  • 展示样式

  • 添加视频列表卡片:在主题装修中,添加卡片 > 高级卡片广场 > 视频 > 视频排列 > 添加视频列表

  • 增加轮播的视频块:选中一个视频的内容块,点击复制即可。

  • 只想保留视频内容,不想要下面的文字:选中不需要的内容,将其删除即可。

  • 添加视频内容:点击视频块即可添加视频以及视频封面,在视频比例处可以调节视频的比例。

  • 调整视频大小:定位到【轮播】层级,拖动轮播块宽度,即可调整视频大小。

视频格子卡片

预设的视频格子卡片支持在一个内容块展示不同排列样式的多个视频。

  • 展示样式

  • 添加视频格子卡片:在主题装修中,添加卡片 > 高级卡片广场 > 视频 > 视频排列 > 添加视频格子

  • 调整视频大小

选择到Column 的层级,拖动蓝色的拖动条即可调整当前视频块的大小。

单视频卡片

主题自带的视频卡片不支持随意调整卡片大小,导致视频占屏幕过大,这时可以使用高级卡片配置单视频卡片,并自由调整大小。

  • 展示样式

  • 创建单视频卡片:将高级卡片里的内容元素全部删除,然后添加视频组件即可,可参考以下动图。

  • 调整视频大小:通过调整【最外层容器】的内/外边距以及容器的最大宽度,可以调整这个视频组件的大小。

这篇文章有帮助吗?
0 人中有 0 人觉得有帮助

评论

0 条评论

登录写评论。

Live chat
Reset