如何在 WordPress 中嵌入 YouTube 直播

已发表: 2023-04-24

您想在您的 WordPress 网站上嵌入 YouTube 直播吗?

在您的 WordPress 网站上嵌入 YouTube 直播可以让访问者与您和您的内容实时互动,从而提高参与度。

在本文中,我们将向您展示如何在 WordPress 中轻松嵌入 YouTube 直播。

How to embed a YouTube live stream in WordPress

为什么在 WordPress 中嵌入 YouTube 直播流

实时流媒体允许您通过 Internet 广播实时视频或音频内容,使用户能够实时观看视频。

YouTube live stream

在您的 WordPress 网站上嵌入 YouTube 直播是与您的观众建立联系并吸引更多用户的绝佳方式。

它还可以让您与网站访问者互动,从而提高用户参与度。

YouTube 直播还可以帮助提升网站搜索引擎优化并吸引更多流量。 研究表明,至少包含一个视频的博文比没有任何视频的博文获得的访问者多 83%。

话虽如此,让我们看看如何轻松地将 YouTube 直播流嵌入 WordPress。

如何在 WordPress 中嵌入 YouTube 直播

嵌入 YouTube 直播的最简单方法是使用 Smash Balloon 的 YouTube Feed Pro 插件。

它是最好的 WordPress YouTube 提要插件,可让您在您的网站上嵌入 YouTube 视频和直播流。

首先,您需要安装并激活 YouTube Feed Pro 插件。 有关更多说明,请参阅我们关于如何安装 WordPress 插件的初学者指南。

注意:YouTube Feed 也有免费版本。 但是,它不支持直播功能。

激活插件后,您需要从管理侧边栏访问Youtube Feed » 设置页面。 在这里,您需要输入许可证密钥并单击“激活”按钮。

您可以从 Smash Balloon 网站上的“帐户”页面获取许可证密钥。

Activate your smash balloon license key

接下来,您需要从 WordPress 管理侧边栏访问YouTube Feeds » All Feeds页面。

从这里,只需单击顶部的“添加新”按钮。

Click the Add New button to add the YouTube feed

这将打开“选择 Feed 类型”提示。

现在,您需要选择“Live Streams”选项,然后单击“Next”按钮继续。

Choose live stream as feed type

在下一步中,您需要将 YouTube Feed Pro 与您的 Youtube 帐户相关联。 系统会要求您提供 YouTube API 密钥。

如果您已有 API 密钥,只需将其复制并粘贴到“输入 API 密钥”框中,然后单击“添加”按钮。

Add YouTube API key

创建 YouTube API 密钥

如果您还没有 API 密钥,则需要转到 Google Cloud Console 并使用您的 Google 帐户登录。

登录后,单击顶部的“选择项目”按钮。

Click Select Project button

这将打开一个弹出窗口,显示您创建的所有项目。

接下来,只需单击顶部的“新建项目”按钮。

Click the New Project button

这将带您进入“新项目”页面,您可以在其中输入项目名称。 这可以是任何可以帮助您轻松识别它的东西。

接下来,您还必须从下拉菜单中选择一个“组织”及其位置。 您可以选择“无组织”并单击“创建”按钮继续。

Choose a project name and its organization

创建项目后,您将被带到项目仪表板。

从这里,您需要单击顶部菜单中的“+ 启用 API 和服务”按钮。

Click on the + ENABLE APIS AND SERVICES button

这会将您带到 API 库页面。 它显示了您可以为项目创建 API 并在项目中使用的不同 Google 服务。

现在继续并在搜索框中搜索“YouTube Data API v3”。

Search for the YouTube data API v3 option

一旦“YouTube Data API v3”结果出现,只需点击它。

这会将您带到一个新页面,您需要在该页面上单击“启用”按钮以激活 YouTube API 密钥。

Enable the YouTube API

您现在将被带到“API/服务详细信息”页面。

从这里,只需单击顶部的“创建凭据”按钮。

Click the Create Credentials button

接下来,您将被定向到一个新页面,您必须在该页面上选中“公共数据”选项旁边的框。

之后,单击“下一步”按钮创建您的 API。

Check the Public data box and click on the Next button

您的 API 密钥现在将被创建并显示在页面上。

只需复制 API 密钥并单击“完成”按钮。

Copy the YouTube API key

接下来,是时候回到 WordPress 仪表板了。

继续并将 API 密钥粘贴到“需要 API 密钥”框中。 然后,单击“添加”按钮继续。

Add YouTube API key

将 YouTube 直播流添加到您的 WordPress 网站

添加 YouTube API 密钥后,您将被重定向到“选择 Feed 类型”页面。

从这里,您需要再次点击“直播”选项,然后点击“下一步”按钮。

这将打开“为实时流添加频道 ID”页面。

Visit the Add channel ID for live stream page

现在,您需要访问包含您的直播视频的 YouTube 频道。

从这里开始,复制顶部 URL 中“/channel/”或“/user/”之后的文本。

Copy the code after channel or user in the URL

接下来,切换回 WordPress 仪表板并将代码粘贴到“为直播添加频道 ID”框中。

之后,单击“连接”按钮将您的 YouTube 频道与 WordPress 连接。

连接通道后,您需要单击“下一步”按钮继续。

Add code and click the connect button

自定义您的 YouTube Feed

现在您的 YouTube 直播流已经创建,您可以对其进行自定义。 Smash Balloon 的 YouTube Feed Pro 提供了许多不同的显示选项。

首先,您需要在“从模板开始”页面上选择一个模板。 您可以选择默认、轮播、卡片、列表、画廊和网格布局。

做出选择后,只需单击“下一步”按钮。

Choose a template for your Live YouTube feed

选择模板后,将打开一个编辑屏幕,在右侧显示 YouTube 提要的预览,在左侧菜单栏中显示自定义设置。

在这里,您可以从展开“Feed Layout”面板开始。

YouTube Feed editor

在此屏幕上,您可以在布局之间切换。

您还可以根据所选布局配置其他设置。

Customize the YouTube feed layout

接下来,您需要单击“配色方案”面板。

默认情况下,YouTube Feed Pro 使用与您的 WordPress 主题相同的配色方案。 但是,您也可以为视频源使用“浅色”或“深色”配色方案。

您还可以通过单击“自定义”选项然后使用控件更改背景、文本和链接颜色来设计自己的配色方案。

Customize feed color scheme

要向您的 YouTube 提要添加标题,您需要访问“标题”面板。 从这里,只需切换“启用”开关即可激活标题。

您还可以使用控件在标准标题样式和文本标题样式之间切换。 选择“文本”选项将允许您更改文本大小和颜色。

Customize YouTube feed header

您还可以通过转到“视频”面板自定义视频播放器的外观。

在这里,您将看到一个选项列表。

Videos panel option

要自定义视频布局和个别属性,您需要访问“视频样式”设置面板。

在这里,您可以选择视频布局、背景颜色和边框。

Customize video style

之后,打开“编辑单个元素”面板。 在这里,只需选中要与 YouTube 直播视频一起显示的元素旁边的框。

您可以显示或隐藏播放图标、视频标题、直播倒计时、描述等。

Edit the individual elements you want to display along with the video

接下来,您需要转到“悬停状态”设置。 在这里,您可以选择当用户将鼠标悬停在 YouTube 视频上时将显示的各个元素。

您可以选择许多元素,包括视频标题、描述、日期、观看次数等。

Customize hover state

之后,您需要访问“视频播放器体验”面板。

从这里,您可以更改视频播放器的纵横比。 您还可以选择视频是自动开始播放还是等到访问者单击播放按钮。

Customize video player experience

自定义各个视频元素后,切换到“加载更多按钮”面板。

在这里,在“加载更多按钮”设置下,您可以将开关切换为“启用”。 这将在直播后显示更多视频建议。

您还可以从左侧面板的设置中选择背景颜色、悬停状态和文本。

Customize the Load More button

之后,如果您想激活 YouTube 订阅按钮,请切换到“订阅按钮”面板并将开关切换到“启用”。

您还可以在设置中更改按钮的颜色、文本和悬停状态。

Customize Subscribe button

自定义 YouTube 直播后,您可以预览它在台式电脑、平板电脑和智能手机上的效果。 只需单击右上角的不同按钮即可在不同设备上预览提要。

最后,不要忘记点击顶部的“保存”按钮来保存您的更改。

Preview and save feed

在 WordPress 页面上嵌入 YouTube 直播

下一步是将您的 YouTube 实时供稿嵌入 WordPress 页面。 为此,您必须首先单击顶部的“嵌入”按钮。

这将打开“嵌入提要”提示。 在这里,单击“添加到页面”按钮继续。

Click Add to a page button to embed YouTube feed

弹出窗口现在将显示您网站上所有 WordPress 页面的列表。

只需选择要嵌入 YouTube 直播的页面,然后单击“添加”按钮。

Choose a page where you want to embed the feed and click on the Add button

您选择的页面现在将在块编辑器中打开。

从这里,您需要单击左上角的“添加块”(+) 按钮并搜索“YouTube 提要”块。

找到它后,单击该块将其添加到您的页面。

Embed YouTube Feed on a page

不要忘记单击“更新”或“发布”按钮来保存您的更改或使它们生效。

这就是 YouTube 实时提要在我们的演示网站上的样子。

YouTube Feed Page preview

将 YouTube Live Feed 添加为小部件

您还可以将 YouTube 实时提要作为小部件添加到 WordPress 侧边栏。

首先,您需要从管理侧边栏访问外观 » 小部件页面。

在这里,单击屏幕左上角的“添加块”(+) 按钮,然后找到“YouTube 提要”块。

接下来,单击块以将其添加到小部件区域。

Add YouTube Feed as a widget

不要忘记点击“更新”按钮来保存您的更改。

这就是 YouTube 实时提要在我们的演示网站的侧边栏中的样子。

Widget Preview of YouTube feed

在完整站点编辑器中添加 YouTube 直播

如果您使用的是基于块的主题,那么此方法适合您。

首先,从管理侧栏转到外观 » 编辑器页面以启动站点编辑器。

在这里,单击顶部的“添加块 (+)”按钮并查找“YouTube 的提要”块。

接下来,您可以将该块拖放到您想要在页面上显示 YouTube 提要的任何位置。

Add the YouTube feed in FSE

完成后,不要忘记单击“保存”按钮以应用更改。

这是我们演示网站上的实时流预览。

FSE preview of YouTube live feed

我们希望本文能帮助您了解如何在 WordPress 中嵌入 YouTube 直播流。 您可能还想阅读我们的终极 WordPress SEO 指南或查看我们精选的最佳社交媒体插件来发展您的网站。

如果您喜欢这篇文章,请订阅我们的 YouTube 频道以获取 WordPress 视频教程。 您还可以在 Twitter 和 Facebook 上找到我们。