在 WordPress 中嵌入 YouTube 视频的详细指南:方法与优化技巧

什么是嵌入 YouTube 视频?

嵌入视频的一个主要优势是可以减少网站的加载时间。视频文件通常文件较大,直接上传到网站会显著降低网站速度。通过嵌入,我们可以既展示视频,又不会影响网站性能。

使用编辑器嵌入 YouTube 视频

图片[1]-在 WordPress 中嵌入 YouTube 视频的详细指南:方法与优化技巧-光子波动网 | 专业WordPress修复服务,全球范围,快速响应

在 WordPress 编辑器中嵌入 YouTube 视频的最简单方法是使用 oEmbed 协议。oEmbed 协议允许你只需使用源 URL 即可将视频、图像和文本从一个网站嵌入到另一个网站。操作方法如下:

  1. 前往 YouTube 并找到想要嵌入的视频
  2. 选择浏览器顶部的 URL 并将其完整复制
  3. 转到你的 WordPress 可视化编辑器并将光标放在希望视频出现的位置
  4. 粘贴视频的 URL 并让 WordPress 自动将其转换为嵌入式视频

粘贴视频 URL 会自动将其转换为嵌入式视频。这种方法简单易用,但需要遵循一些准则:

  • 将嵌入链接放在其行中。这意味着链接前后不应有文本或空格。
  • 不要在 URL 中添加对齐或样式元素。这会使 URL 被包裹在 HTML 格式中并取消嵌入。
  • 仅接受视频或播放列表的链接。请勿粘贴 YouTube 频道的 URL。

使用编辑器的块添加功能

另一种在 WordPress 中嵌入 YouTube 视频的方法是使用块编辑器。这种方法允许你通过添加块来实现更灵活的内容布局:

  1. 在 WordPress 帖子中,可以输入文本或选择不同类型的块
图片[2]-在 WordPress 中嵌入 YouTube 视频的详细指南:方法与优化技巧-光子波动网 | 专业WordPress修复服务,全球范围,快速响应
  1. 单击加号可添加除文本段落之外的其他内容类型,这是 WordPress 块编辑器中的默认设置。你将看到一个菜单,其中显示可以添加到帖子中的不同类型的元素。
  2. 点击“浏览全部”以查找嵌入功能。可以向下滚动到嵌入部分以查找 YouTube 嵌入选项,或使用搜索栏查找它。
  3. 单击 YouTube,复制并粘贴要添加到 WordPress 帖子的 YouTube 视频的 URL
图片[3]-在 WordPress 中嵌入 YouTube 视频的详细指南:方法与优化技巧-光子波动网 | 专业WordPress修复服务,全球范围,快速响应

这样,视频将嵌入到你的帖子中。此方法还支持来自其他平台的视频嵌入,例如 Vimeo、Dailymotion 和 Twitter。

使用 Iframe 方法嵌入 YouTube 视频

oEmbed 方法简单易用,但它不提供任何自定义选项。Iframe 嵌入方法则提供更多自定义选项,允许你精确控制视频在网站上的外观和工作方式:

  1. 单击要在 WordPress 页面上播放的 YouTube 视频下方的“分享”按钮
  2. 单击嵌入按钮,找到 iframe 嵌入代码和一些可自定义的选项。
  3. 如果希望视频从某个点开始,请在该点暂停视频并启用“开始于”选项。还可以在下面管理播放器控制和隐私增强模式。
  4. 复制嵌入代码并返回 WordPress 网站
  5. 从可视化编辑器切换到文本编辑器并粘贴嵌入代码
  6. 更新帖子,WordPress 会将其转换为嵌入式视频

使用在线嵌入工具嵌入 YouTube 视频

虽然 iframe 方法本身带有许多自定义选项,但 YouTube 并未包含所有可能的选项。使用在线 YouTube 视频嵌入工具(例如 YouTube Video Embed),可以创建更多自定义列表,并输出一个可直接复制到 WordPress 文本编辑器中的代码:

图片[4]-在 WordPress 中嵌入 YouTube 视频的详细指南:方法与优化技巧-光子波动网 | 专业WordPress修复服务,全球范围,快速响应
  1. 粘贴视频 URL,尝试嵌入选项,然后复制并粘贴 iframe 代码。
  2. 一些常用的嵌入选项包括
    • 自动播放视频:网页打开时自动播放视频。
    • 循环视频:嵌入的视频重复播放。
    • 显示注释:启用或禁用视频中的文本注释。
    • 允许全屏:观众可以或不可以全屏观看视频。
    • 隐藏式字幕:启用或禁用视频的隐藏式字幕。
    • 进度条:进度条在整个视频过程中可见,或在一定时间后自动隐藏。
    • 相关视频:启用或禁用 YouTube 在视频结尾显示相关视频。
    • 视频标题:控制视频文本标题的可见性。
    • 开始时间:视频开始的时间。
    • 结束时间:视频结束的时间。
    • 布局:视频的尺寸保持固定或根据屏幕尺寸而变化。
    • 对齐:视频可以左对齐、居中或右对齐。
    • 宽高比:视频的宽高比可以是 16:9、4:3 或 1:1。
    • 宽度和高度:视频的尺寸(以像素为单位)。
图片[5]-在 WordPress 中嵌入 YouTube 视频的详细指南:方法与优化技巧-光子波动网 | 专业WordPress修复服务,全球范围,快速响应

优化嵌入页面

嵌入的 YouTube 视频会增加页面的加载时间,因为浏览器需要发出额外的请求来加载视频资源。解决这一问题的一个方法是延迟加载嵌入的 YouTube 视频

  1. 延迟加载是一种仅在页面加载时加载必要资源的技术。其他不太重要的资源(如嵌入的视频)仅在用户点击播放按钮时加载。
  2. 避免使用延迟加载会浪费用户数据、处理时间、电池时间和其他系统资源。如果安装了优质的延迟加载插件,可以减少初始页面重量、系统资源使用量,所有这些都可以提高网站性能。
  3. ELEX Optimize YouTube Videos Embed Plugin for WordPress 插件使用预设的横幅和 YouTube 图标模拟嵌入视频,但仅在访问者点击后加载嵌入视频。
图片[6]-在 WordPress 中嵌入 YouTube 视频的详细指南:方法与优化技巧-光子波动网 | 专业WordPress修复服务,全球范围,快速响应

在侧边栏嵌入视频

在 WordPress 中将 YouTube 视频嵌入侧边栏是一种创造性的方法,可以吸引用户并增加网站的互动性:

  1. 在管理仪表板中,将鼠标悬停在“外观”上并单击“自定义”
  2. 单击“小部件”,选择侧边栏,然后单击“添加小部件”
  3. 在搜索框中输入视频并点击结果。视频小部件将添加到侧边栏。
  4. 点击“添加视频”,选择“从 URL 插入”,粘贴视频链接,等待视频预览,然后点击“添加到小部件”
  5. 最后,点击“发布”即可上线

在 WordPress 上制作视频库

如果你的品牌有自己的专用 YouTube 频道,可以通过展示整个频道来简化内容营销工作。使用插件(如 Embed Plus 和 ELEX WordPress Embed YouTube Video Gallery)可以制作视频库,这些插件具有 zip 导入、实时流媒体、块编辑器兼容性等功能,使流程变得轻松自动化。

嵌入 YouTube 视频替代 WooCommerce 产品图片(高级功能)

在 WooCommerce 网站上用产品视频替换产品图片,可以提供更丰富的产品展示:

  1. 从 ELEXtensions 订阅插件的高级版本
  2. 在 WordPress 仪表板中,导航到“产品”> “所有产品”,选择一个产品
图片[7]-在 WordPress 中嵌入 YouTube 视频的详细指南:方法与优化技巧-光子波动网 | 专业WordPress修复服务,全球范围,快速响应
  1. 在产品页面上,输入建议产品视频的 URL
  2. 单击“更新”。前端的产品页面将显示视频替代产品图片。
图片[8]-在 WordPress 中嵌入 YouTube 视频的详细指南:方法与优化技巧-光子波动网 | 专业WordPress修复服务,全球范围,快速响应

总结

随着视频在网络内容中的重要性日益增加,掌握在 WordPress 中嵌入 YouTube 视频的各种方法非常重要。无论是使用 oEmbed、块编辑器、iframe、在线工具,还是在侧边栏和视频库中嵌入视频,都可以显著提升网站的用户体验和互动性。

图片[9]-在 WordPress 中嵌入 YouTube 视频的详细指南:方法与优化技巧-光子波动网 | 专业WordPress修复服务,全球范围,快速响应

常见问题解答

如何在 WordPress 帖子或页面中嵌入 YouTube 视频?

  • 只需将 URL 粘贴到内容区域,WordPress 就会自动将其嵌入到你的博客或帖子中。也可以使用内容管理系统的视频块。

我可以自定义嵌入的 YouTube 视频的外观吗?

  • 是的,你可以通过各种插件自定义嵌入视频的外观,以实现最佳的自定义效果。

为什么嵌入视频比上传视频更重要?

  • 上传视频可能会导致网站崩溃,加载时间过长也会让用户感到厌烦。嵌入视频可以避免这些问题,并帮助你将视频元素添加到网站上。

我可以在 WordPress 上嵌入 YouTube 播放列表吗?

  • 是的,你可以在 WordPress 上嵌入 YouTube 播放列表,展示你的所有视频内容。
© 版权声明
THE END
喜欢就支持一下吧
点赞0 分享
评论 抢沙发

请登录后发表评论

    暂无评论内容