如何在 WordPress 中显示 YouTube 频道的最新视频

您想在您的 WordPress 网站上显示 YouTube 频道的最新视频吗?

YouTube 视频为您的网站提供了精彩的内容,但手动嵌入每个新视频可能需要花费大量时间和精力。相反,我们建议创建一个供稿,每次您向 YouTube 发布新视频时,该供稿都会自动更新。

在本文中,我们将向您展示如何在 WordPress 中自动显示 YouTube 频道中的最新视频。

如何在 WordPress 中显示 YouTube 频道的最新视频

为什么要在 WordPress 中显示您的 YouTube 频道视频?

如果您投入时间和精力来创建 YouTube 视频,那么将视频发布到 WordPress 也是有意义的。

这些视频可以帮助吸引访问者的注意力,并使他们在您的网站上停留更长时间。这可以 增加 WordPress 的综合浏览量并降低跳出率

嵌入的 YouTube 视频甚至可以吸引更多访问者访问您的网站。事实上,我们的博客统计数据最终列表显示,带有视频的博客文章比没有视频的博客文章获得的流量高出 83%。

如果您只想向网站添加少量视频,那么 在 WordPress 博客文章中嵌入 YouTube 视频很容易。但是,您需要手动添加每个新视频,这需要时间和精力。

相反,我们建议嵌入 YouTube Feed,每次您向频道发布新视频时,该 Feed 都会自动更新。这保证了访问者将始终看到最新的视频,而无需您做任何额外的努力。

话虽这么说,让我们看看如何在 WordPress 中显示 YouTube 频道的最新视频。

如何安装 YouTube 视频插件

显示 YouTube 频道中的最新视频的最简单方法是使用免费的YouTube插件 Smash Balloon Feeds。

在 WordPress 中显示 YouTube 频道的最新视频

注意:还有一个专业版本,可让您显示 YouTube 收藏夹列表中的视频、嵌入直播等。不过,我们将使用该插件的免费版本,因为它拥有显示 YouTube 频道的最新视频所需的一切。

首先,安装并激活 YouTube 插件的 Feeds。有关更多详细信息,请参阅我们有关如何安装 WordPress 插件的分步指南。

激活后,前往YouTube Feed » 设置并点击“添加来源”。

将 YouTube 频道添加到您的 WordPress 网站

在下一个屏幕上,继续并点击“通过 Google 连接到 YouTube”。Smash Balloon 现在将显示您的所有 Google 帐户。

您可以从列表中选择一个帐户,也可以单击“使用其他帐户”并添加新的 Google 帐户。

如何将 Smash Balloon 连接到 WordPress 网站

之后,您会看到一条警告,指出 Smash Balloon 将能够访问有关您的 YouTube 频道的信息。

假设您很乐意继续,请单击“继续”。

将 YouTube 连接到 WordPress

此时,您需要添加 YouTube 频道的 ID 或用户名。

要获取此信息,请访问 YouTube 网站并单击右上角的个人资料图片。然后,选择“您的频道”。

获取您的 YouTube 频道 ID 或用户名

现在,查看浏览器的地址栏。如果您在“user/”后面看到一些文本,那么这就是您的频道用户名。

如果您看到“channel/”后跟一串数字和字母,那么这就是频道 ID,如下图所示。

如何获取您的 YouTube 频道用户名或 ID

只需复制该值并切换回 WordPress 仪表板即可。现在,将值粘贴到显示“输入频道 ID 或用户名”的字段中。

完成后,单击“下一步”按钮。

将 YouTube 频道 ID 或用户名添加到 Smash Balloon

创建 YouTube API 密钥

此时,您将看到以下消息:未输入 API 密钥。

WordPress 仪表板中的 YouTube 错误消息

为了避免任何中断,我们建议创建一个 YouTube API 密钥并将其添加到您的WordPress 博客或网站。

在新选项卡中,转到Google Console并使用您的 Google 帐户登录。

登录控制台后,单击工具栏中的下拉菜单。默认情况下,这显示您最新的 Google Console 项目的名称。

谷歌云控制台

如果这是您第一次登录 Google 控制台,那么您需要接受条款和条件。

完成后,单击“新项目”。

在 Google Console 中创建新项目

您现在可以输入项目的名称。这仅供您参考,因此您可以使用任何您想要的东西。

完成后,点击“创建”。

现在,点击“搜索”图标并输入“YouTube 数据 API”。在“市场”下,找到 YouTube 数据 API 并单击。

启用 YouTube 数据 API

这将带您进入一个屏幕,您可以在其中激活用于发出 YouTube API 请求的密钥。

为此,只需单击“启用”按钮即可。

如何启用 YouTube 数据 API

在左侧菜单中,单击“凭据”。

完成后,选择“创建凭据”。

如何在 Google Cloud Console 中创建 YouTube API

在下拉菜单中,点击“API 密钥”。

几分钟后,您将看到“API 密钥已创建”弹出窗口。您需要将此信息添加到您的网站,因此请记下它。

为您的 WordPress 网站创建 YouTube API 密钥

默认情况下,YouTube API 密钥不受限制。要阻止其他人使用 API 密钥,明智的做法是通过单击弹出窗口中的“编辑 API 密钥”链接来限制它。

这将打开一个显示您所有 Google API 密钥的屏幕。只需找到您刚刚创建的密钥,然后单击即可。

在 Google Cloud Console 中修改 API 密钥

注意: 如果您不小心关闭了弹出窗口,请不要惊慌。您可以通过从左侧菜单中选择“凭据”来访问同一屏幕。同样,如果您没有记录 API 密钥,则只需单击“显示密钥”即可查看您的凭据。

在“设置应用程序限制”下,选择“网站”选项。

限制 YouTube API 对特定网站的访问

在“网站限制”下,点击“添加”。

您现在可以输入您的网站地址,然后单击“完成”。

如何在 Google Cloud Console 中添加 HTTP 引荐来源网址

要让 Smash Balloon 访问 API,您还需要输入 www.googleapis.com 并点击“完成”。

在“API 限制”下,选择“限制密钥”旁边的按钮。

如何创建访问受限的 YouTube API 密钥

完成后,点击“选择 API”下拉菜单,然后选中“YouTube 数据 API”旁边的框。

之后,单击“确定”。

创建安全且受限制的 YouTube API 密钥

如果您对 YouTube API 密钥的设置感到满意,请点击“保存”。

您现在已准备好将 API 密钥添加到您的WordPress 网站。在 WordPress 仪表板中,转到YouTube Feed » 设置

最后,将密钥粘贴到“API 密钥”字段中,然后单击“添加”。

使用 API 密钥获取 YouTube 数据

如何在 WordPress 中显示 YouTube 频道的最新视频

将您的 WordPress 网站与 YouTube 连接后,创建视频库就很容易了。

只需转到YouTube Feed » 所有 Feed,然后点击“添加新的”。

如何创建 YouTube 视频源

YouTube Feed Pro 可让您嵌入个人 YouTube 视频、播放列表、直播等。您甚至可以通过组合来自多个社交平台的帖子来创建社交墙。例如,您可以嵌入 Facebook 状态帖子添加 Instagram 照片等。

由于您使用的是免费插件,因此只需单击“频道”,然后选择“下一步”。

创建显示最新 YouTube 频道视频的 Feed

这将打开编辑器,其中会在右侧显示 YouTube feed 的预览。

在左侧,您将看到可用于微调 YouTube 视频外观的所有不同设置。

在 WordPress 中自定义最新的 YouTube 视频源

这些设置非常简单,因此只需单击左侧菜单中的每个选项并进行所需的任何更改即可。

当您更改设置时,实时预览将自动更新,以便您可以尝试不同的设置,看看什么在您的网站上看起来最好。

首先,您可以通过单击“源布局”来更改视频的显示方式。在此屏幕上,您可以在网格、图库、列表和轮播布局之间切换。

使用 Smash Balloon 更改 YouTube 频道提要布局

根据您选择的布局,您可能会访问一些额外的设置。

例如,如果您选择“列表”,则可以更改 Smash Balloon 在列表中显示的视频数量,并在 YouTube 视频之间留出更多空间。

在 YouTube 频道供稿的不同布局之间切换

研究表明,90% 的消费者在移动设备上观看视频,70% 的人使用智能手机或平板电脑访问 YouTube。考虑到这一点,您需要确保最新视频在移动设备上的效果与在桌面设备上的效果一样好。

您可以使用右上角的一排按钮预览 YouTube feed 在台式电脑、平板电脑和智能手机上的外观。

在智能手机和平板电脑上预览 YouTube 频道源

测试 WordPress 网站的移动版本后,您可能想要更改在智能手机和平板电脑上显示的视频数量。这可以帮助您的 YouTube 视频轻松适应较小的平板电脑和智能手机屏幕。

默认情况下,Smash Balloon 在移动设备和台式计算机上显示不同数量的列。要更改这些默认设置,只需在“列”部分中输入新数字即可。

在移动设备上显示不同数量的列

您现在已准备好探索下一个设置屏幕,即“配色方案”。

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

您甚至可以通过选择“自定义”来创建自己的配色方案,然后使用设置 更改链接颜色、文本颜色、 更改背景颜色等。

在 WordPress 中为您的 YouTube 频道源创建自定义配色方案

Smash Balloon 还可以在 YouTube 视频源上方添加标题。此标题显示您的 YouTube 个人资料图片和频道名称,以便访问者可以准确地看到内容的来源。

要自定义此部分,请单击左侧菜单中的“标题”。

向您的 YouTube 频道 Feed 添加标题

在这里,您可以使用控件在标准标题样式和文本标题样式之间切换。

如果您选择“文本”,则可以 更改文本颜色 和字体大小。默认情况下,标题会显示消息“我们在 YouTube 上”。您可以通过在“文本”框中输入您自己的消息来替换它。

为您的 YouTube 频道 Feed 选择不同的标题样式

当您对标题的外观感到满意时,下一个设置屏幕是“视频”。

这将带您进入一个新屏幕,您可以在其中微调每个 YouTube 视频的默认外观、访客将鼠标悬停在其上时以及视频播放时的外观。

Smash Balloon YouTube 视频编辑器设置

如果单击“编辑单个元素”,则可以选择是否显示或隐藏“播放”图标。

在下图中,我们为 YouTube feed 中的每个视频添加了“播放”图标。

添加和隐藏 YouTube 播放图标

如果您对更改感到满意,请点击“视频”链接。

这将带您返回到上一个屏幕,您可以在其中选择“悬停状态”。

自定义 YouTube 视频的悬停状态

在这里,您可以选择当访问者将鼠标悬停在视频上时是否显示视频标题。

标题可以提供额外有用的信息并鼓励访问者播放视频。考虑到这一点,您可能需要选中“视频标题”旁边的框。

在 WordPress 中为最新的 YouTube 视频添加标题

当访问者点击视频时,它将开始在嵌入式视频播放器中播放。

您可以通过点击“视频播放器体验”来更改播放器的行为和外观。

自定义 YouTube 灯箱体验

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

如果您对视频播放器的设置感到满意,请单击“自定义”链接返回到 Smash Balloon 编辑器主屏幕。

粉碎气球的灯箱设置

在这里,从左侧菜单中选择“加载更多按钮”。

访问者可以使用“加载更多”按钮查看更多 YouTube 视频。这可以让访问者在您的网站上停留更长时间,同时还可以在您的 YouTube 频道上获得更多参与度和观看次数。

考虑到这一点,您可能希望通过更改“加载更多”按钮的背景颜色、悬停状态和文本颜色来使其突出。

在 WordPress 中自定义 YouTube“加载更多”按钮

默认情况下,此按钮显示“加载更多…”,但您可以通过在“文本”字段中输入内容来将其替换为独特的号召性用语。

默认情况下,Smash Balloon 会在您最近的 YouTube 视频下方显示 “订阅”按钮 。

这会鼓励访问者加入您的 YouTube 频道。为了获得更多订阅者,您可能需要通过从主 Smash Balloon 设置屏幕中选择“订阅按钮”来自定义按钮。

如何鼓励人们订阅您的 YouTube 频道

在此屏幕上,您可以通过单击“启用”来添加和删除“订阅”按钮。

您还可以更改按钮的背景颜色、悬停状态和文本颜色。

自定义 YouTube 频道供稿的订阅按钮

默认情况下,此按钮显示“订阅”号召性用语。

您可以通过在“文本”框中输入您自己的消息来替换它。

将自定义消息添加到您的 YouTube 频道 Feed

当您对视频源的外观感到满意时,请不要忘记单击“保存”来存储您的更改。您现在已准备好将最新的 YouTube 视频添加到您的 WordPress 网站。

如何在 WordPress 中嵌入最新的 YouTube 频道视频

您可以使用块、小部件或短代码将 YouTube 视频源添加到 WordPress。

如果您使用 YouTube 供稿插件创建了多个供稿,那么如果您要使用块或小部件,则需要知道该供稿的短代码。

要获取代码,请转至 YouTube Feed » 所有 Feed ,然后复制“短代码”下的文本。

在下面的示例中,我们需要使用 youtube-feed feed=2.

使用块或小部件将最新视频添加到您的网站

如果您想在页面或帖子上显示最新视频,那么我们建议使用“YouTube 供稿”块。

只需打开您想要展示 YouTube 视频的页面或帖子即可。然后,单击“+”图标添加新块并开始输入“YouTube 的 Feed”。

当右侧块出现时,单击将其添加到页面或帖子中。

将最新的 YouTube 视频添加到 WordPress 块

默认情况下,该块将显示您的 YouTube 源之一。如果您想使用不同的提要,请在右侧菜单中找到“短代码设置”。

您现在可以将短代码添加到此框中。完成后,单击“应用更改”按钮。

将 YouTube 频道中的最新视频添加到 WordPress

该块现在将显示您的 YouTube 频道中的最新视频。只需发布或更新页面即可让您的 YouTube 社交媒体源 上线。

您还可以将提要添加到任何小部件就绪区域,例如侧边栏。这使您可以在整个网站上显示最新的 YouTube 视频。

为此,请转到WordPress 仪表板中的外观 » 小部件,然后单击“+”按钮。

将 YouTube 的 Feed 块添加到您的 WordPress 主题

现在,开始在搜索栏中输入“YouTube Feed”以查找正确的小部件。

然后,您可以将该小部件拖动到要显示 YouTube 频道的最新视频的区域。

使用块显示最新的 YouTube 视频

默认情况下,该小部件将显示您使用 YouTube Feed 创建的 Feed 之一。

要显示不同的提要,请在“短代码设置”框中键入该提要的代码。然后,单击“应用更改”。

使用 Smash Balloon 显示 YouTube 频道中的最新视频

最后,单击“更新”按钮以使小部件生效。

有关更多信息,请参阅我们有关如何添加和使用小部件的详细指南。

另一种选择是使用短代码将最新视频嵌入任何页面、帖子或小部件就绪区域。要获取正确的短代码,只需转到YouTube Feed » 所有 Feed并复制“短代码”列中的值即可。

现在只需将此代码添加到您的网站即可。有关更多信息,请参阅我们有关如何在 WordPress 中添加短代码的详细指南。

使用全站编辑器

最后,如果您使用的是启用块的主题,则可以使用全站点编辑器在网站上的任何位置添加 Y​​ouTube 的 Feed 块。

在 WordPress 仪表板中,转到外观 » 编辑器

将 YouTube 的 Feed 添加到您的 WordPress 主题

默认情况下,WordPress 全站编辑器将显示主题的主页模板。

如果您想将最新的 YouTube 视频添加到其他模板,请点击左侧菜单中的“模板”。

选择新的全站编辑器 (FSE) 模板

编辑器现在将显示构成您的 WordPress 主题的所有模板。

只需单击您要编辑的模板即可。

如何使用 FSE 将 YouTube 图库添加到基于块的模板

WordPress 现在将显示模板的预览。

如果您愿意将最近的 YouTube 视频添加到网站的这一部分,请单击铅笔图标。

使用全站点编辑器 (FSE) 编辑 WordPress 基于块的模板

选择模板后,将鼠标悬停在要显示 YouTube 频道最新视频的区域上。

然后,当“+”出现时单击它。

使用 FSE 将最新视频从 YouTube 添加到 WordPress

开始输入“YouTube Feeds”。

当出现右侧块时,单击将其添加到 WordPress 模板中。

使用全站编辑器显示最新视频

与往常一样,YouTube 的 Feed 将默认显示一个 Feed。要更改此提要,只需按照上述相同过程添加正确的短代码即可。

我们希望本文可以帮助您将 YouTube 频道中的最新视频添加到您的 WordPress 网站。您可能还想查看我们关于如何在 WordPress 中嵌入 Facebook 视频的指南以及我们专家精选的最佳社交媒体插件

发表评论

您的电子邮箱地址不会被公开。 必填项已用*标注

Scroll to Top