多列视频布局示例用例
当您想在同一版块中显示多个视频时，多列视频布局非常有用。它们可以让您的产品页面更具吸引力，信息更丰富。常见用例包括：
- 展示产品功能：在不同的视频中突出不同的特点。
- 比较视图：并排放置 2-3 个视频来比较产品型号或变化。
- 客户推荐：添加多个评论视频以建立可信度。
- 教程和操作方法：通过简短的片段展示分步说明。
- 营销活动：结合品牌故事、生活方式视频和宣传内容。
使用视频元素设计多列视频布局
要为使用 GemPages 构建的产品页面创建 3 行视频布局，请按照以下步骤操作：
步骤 1：访问 GemPages 编辑器
- 从您的 Shopify 管理仪表板 > GemPages 构建器 应用> 前往.
- 选择“产品”从您现有的产品页面中选择。否则，您可以点击 建立新页面 > 产品页面 去建立一个新的。
第 2 步：添加行元素
进入编辑器后，将 行元素 左侧边栏采用 3 列布局。
如果您希望使用其他列布局来显示视频，您可以在 个人设置 标签> 布局 部分。
一行中的最大列数为 6。
步骤 3：添加视频/视频横幅元素
- 带回了 元素 选项卡，然后向下滚动，直到看到 相关媒体 部分。
- 拖放一个 视频元素 or 视频横幅 行中每列上的元素。
步骤 4：上传并自定义您的视频
点击视频打开其设置。在 视讯来源，点击 类型 字段从下拉菜单中选择视频源： YouTube, Vimeo的 或 视频托管.
然后，在 视频链接 字段，并设置 缩图 根据您的喜好为每个视频添加图像。
您可以从库（Shopify 文件）中的任何图像中进行选择，也可以上传新的图像。
如需进一步定制，请查看我们的文章：
高级：使用自定义代码元素
这两个元素仅允许您插入来自以下三个来源之一的视频（YouTube、Vimeo 或视频托管）。因此，如果您希望添加来自其他来源（例如 TikTok）的视频，请使用 自定义代码元素 是最好的选择。
按照以下步骤使用此元素创建您自己的 3 列视频布局：
第三步： 将行元素的 3 列布局拖放到页面上所需的位置。
第三步： 输入“自定义代码”，然后将自定义代码元素嵌套到每一列中。
第三步： 点击元素即可打开左侧边栏中的设置面板。在 自定义代码 部分，选中 代码 领域。
第三步： 代码编辑器对话框将出现在屏幕上。在 HTML 选项卡，粘贴视频的嵌入代码，然后点击 已保存 按钮。
举个例子，我们插入一个TikTok视频的嵌入代码。
<blockquote class="tiktok-embed" cite="https://www.tiktok.com/@gempages/video/7384328395699539217" data-video-id="7384328395699539217" style="max-width: 605px;min-width: 325px;" > <section> <a target="_blank" title="@gempages" href="https://www.tiktok.com/@gempages?refer=embed">@gempages</a> <p>🥰 Master the Art of Crafting Comparison Tables with GemPages! 🥰 _________________________ ⭐️Try GemPages for FREE: https://bit.ly/appstore-Gempages #ecommerce #gempages #tipsandtricks #webdesign #landingpage #productdesign #productpage #homepage #abovethefold #mobileview #shopifydropshipping #pagebuilding #pagebuilder</p> <a target="_blank" title="♬ nhạc nền - GemPages" href="https://www.tiktok.com/music/nhạc-nền-GemPages-7384328668371667729?refer=embed">♬ nhạc nền - GemPages</a> </section> </blockquote> <script async src="https://www.tiktok.com/embed.js"></script>
结果：
谢谢您的意见