如何在HTML及邮件中嵌入Gumlet视频？

一、HTML页面嵌入视频（正确方法） #

你之前用的iframe路径不对，Gumlet的watch页面是面向用户的观看页，不是嵌入用的播放器地址。正确做法是：

1. 登录Gumlet后台，找到目标视频的详情页
2. 复制官方提供的嵌入代码，或者自己构造标准的iframe：

<iframe 
  src="https://player.gumlet.io/64a651e54dc6e9c15e3aa689/embed" 
  width="640" 
  height="360" 
  frameborder="0" 
  allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" 
  allowfullscreen>
</iframe>

这段代码包含播放器必要的权限和尺寸设置，能在HTML页面正常加载播放。

二、邮件嵌入视频（兼容方案） #

邮件客户端普遍对iframe和HTML5 video支持很差，推荐以下两种稳定方案：

方法1：缩略图+跳转链接（最兼容） #

这是邮件嵌入视频的行业通用方案：

• 从Gumlet视频详情页获取视频缩略图链接（格式类似https://img.gumlet.io/64a651e54dc6e9c15e3aa689/thumbnail.jpg）
• 在邮件HTML中插入缩略图，并给图片添加点击跳转链接：

<a href="https://www.gumlet.com/watch/64a651e54dc6e9c15e3aa689">
  <img src="https://img.gumlet.io/64a651e54dc6e9c15e3aa689/thumbnail.jpg" alt="视频缩略图" width="640" height="360">
</a>
<p>点击图片观看完整视频，或直接访问：<a href="https://www.gumlet.com/watch/64a651e54dc6e9c15e3aa689">https://www.gumlet.com/watch/64a651e54dc6e9c15e3aa689</a></p>

如果是纯文本邮件，直接附上视频链接即可。

方法2：HTML5 Video标签（仅限部分客户端） #

仅苹果邮件、部分Outlook版本支持，需要从Gumlet获取视频的直接播放链接（MP4格式），代码示例：

<video width="640" height="360" controls>
  <source src="https://your-gumlet-video-url.mp4" type="video/mp4">
  你的邮件客户端不支持视频播放，请点击<a href="https://www.gumlet.com/watch/64a651e54dc6e9c15e3aa689">这里</a>观看。
</video>

注意：此方法兼容性有限，必须添加降级提示。

三、附带完整视频链接 #

不管是HTML页面还是邮件，都可以在嵌入内容下方添加明显的链接：

• HTML页面：*完整视频链接：* <a href="https://www.gumlet.com/watch/64a651e54dc6e9c15e3aa689">https://www.gumlet.com/watch/64a651e54dc6e9c15e3aa689</a>
• 邮件：直接用文本链接或按钮样式突出显示，确保用户即使无法加载嵌入内容，也能通过链接访问视频。

内容的提问来源于stack exchange，提问作者akbansa