tigtools

YouTube 嵌入代码生成器

粘贴 YouTube 链接,选择播放器选项,然后将 iframe 代码复制到你的网站。响应式模式会以 16:9 比例填满所在容器的宽度。

在浏览器中运行 无需注册

视频

播放

语言代码,如 en、de 或 pt-BR。用于设置播放器界面语言,并在开启字幕时设置首选字幕语言。

尺寸与页面

尺寸

播放器会占满容器宽度并保持 16:9 比例,使用当前浏览器支持的 CSS aspect-ratio 属性。

为屏幕阅读器描述播放器。如有可能,请使用视频标题。

嵌入代码

粘贴视频链接以获取嵌入代码。

使用方法

  1. 粘贴 YouTube 视频链接或其 11 位视频 ID。
  2. 设置开始和结束时间以及所需的播放选项。
  3. 选择响应式或固定尺寸,并设置一个描述性标题。
  4. 复制 HTML 并粘贴到你的页面或建站工具的 HTML 区块中。使用“显示预览”进行测试。

工作原理

该代码使用 YouTube 标准 iframe 播放器。选项会作为播放器地址的 URL 参数:start 和 end(秒)、autoplay、mute、loop 及 playlist、controls=0、用于字幕的 cc_load_policy=1、用于字幕语言的 cc_lang_pref,以及用于播放器语言的 hl。隐私增强模式会将地址切换为 youtube-nocookie.com。

某些选项受 YouTube 或浏览器的限制。自动播放仅在视频静音时有效,因此该工具会在开启自动播放时添加 mute=1。循环播放单个视频需要将 playlist 参数设置为同一视频 ID,该工具会自动添加。仅当视频包含字幕时,字幕才会显示。如果视频所有者禁用了嵌入,播放器中会显示错误。

响应式模式会将 iframe 包裹在设置了 aspect-ratio: 16 / 9 和 width: 100% 的容器中,使其随页面缩放,而无需旧式 padding-bottom 技巧。固定模式会写入 width 和 height 属性。延迟加载会推迟播放器加载,直到其接近页面可见区域。

示例

隐私友好的响应式嵌入

默认设置:youtube-nocookie.com、响应式 16:9 和延迟加载。将代码片段粘贴到任意 HTML 页面中。

背景式循环

自动播放、循环且不显示控件会生成 …/embed/ID?autoplay=1&mute=1&loop=1&playlist=ID&controls=0。

仅播放某一片段

从 1:00 开始并在 2:30 停止会生成 start=60&end=150,因此播放器只会播放该片段。

常见问题

为什么我嵌入的视频无法带声音自动播放?

浏览器会阻止带声音的自动播放。自动播放需要 mute=1,该工具会自动添加;某些浏览器或设置仍可能阻止。

隐私增强模式有什么作用?

它会从 youtube-nocookie.com 加载播放器。根据 YouTube 的说明,除非访问者播放视频,否则不会存储访客信息用于个性化。

为什么循环播放需要 playlist=?

YouTube 的循环参数仅在配合播放列表时有效。将 playlist 设置为相同的视频 ID 即可让单个视频循环播放。

生成的代码能在 WordPress 中使用吗?

可以。将代码粘贴到“自定义 HTML”区块中。出于安全考虑,某些建站工具会移除 iframe;此时请使用它们自带的视频区块。

隐私

嵌入代码在您的浏览器中生成,不会向任何地方发送数据。仅当您点击“显示预览”时,浏览器才会从 YouTube(或 youtube-nocookie.com)加载播放器。