如何使用指定代码在Fancybox中嵌入Facebook视频？报错求助

问题重现 #

你当前使用的嵌入代码：

<a class="overlink" data-fancybox="" href="https://www.facebook.com/watch/?v=222587198843939"></a>

出现加载报错，核心原因是Fancybox无法直接解析Facebook的普通watch链接，需要使用官方专属的嵌入格式并指定正确的内容加载类型。

可行解决步骤 #

1. 替换为Facebook视频嵌入链接 #

将原watch链接替换为Facebook官方的嵌入格式：
原链接：https://www.facebook.com/watch/?v=222587198843939
替换为：https://www.facebook.com/video/embed?video_id=222587198843939

2. 给Fancybox标签添加iframe类型声明 #

Fancybox需要明确识别内容类型，需添加data-type="iframe"属性，还可补充data-width和data-height参数控制弹窗尺寸。

修改后的完整代码 #

<a class="overlink" data-fancybox="" data-type="iframe" data-width="854" data-height="480" href="https://www.facebook.com/video/embed?video_id=222587198843939"></a>

3. 检查Fancybox初始化配置（可选） #

如果使用Fancybox 3及以上版本，建议初始化时配置iframe相关参数，确保加载正常：

$('[data-fancybox]').fancybox({
  iframe : {
    css : {
      width : '854px'
    }
  }
});

额外注意事项 #

• 确认目标Facebook视频的隐私设置允许嵌入（仅公开视频或开启嵌入权限的视频才能正常加载）
• 确保已正确引入Fancybox的JS和CSS文件，优先使用最新稳定版本

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