如何将 Facebook 小部件添加到 WordPress(无编码)

已发表: 2020-07-28

如果您正在寻找将Facebook页面及其内容与 WordPress 网站集成的最佳方式,那么您来对地方了。 在本指南中,您将逐步了解如何将 Facebook 小部件添加到 WordPress

本教程将向您展示如何在 WordPress 侧边栏或直接在页面/帖子上显示 Facebook Like 框。 这种完全用户友好的方法使您可以轻松地将自定义的嵌入式窗口添加到您的 Facebook 页面,而不会有任何麻烦。

为什么要将 Facebook 小部件添加到您的网站?

为了您的社交媒体内容和网站的成功,建议将它们集成。 例如,您可以考虑使用社交提要插件以有组织的方式直接在您的网站上分享您的社交内容。 此外,让您的网站和社交媒体页面之间的流量流动是个好主意,尤其是当您在线销售产品和服务时。 您网站侧边栏上的一个小部件可以显示您的 Facebook 提要、时间线或图像,可以通过许多不同的方式产生好处。 例如,您可以从您的用户可以直接在您的网站上查看的 Facebook 页面显示即将发生的事件或更新。 此外,如果您有在线商店,则可以将 WooCommerce 与 Facebook Shop 集成以提高销售额。

Facebook Like 框是一个非常灵活的工具,只需极少的努力即可启用。 该小部件非常轻巧,因此加载时间通常不是问题。 您甚至可以使用可以放置在 WordPress 网站上任何位置的专用短代码,包括您的页面和帖子。

总而言之,使用类似 Facebook 的框/小部件,您可以:

  • 显示您的 Facebook 页面提要以及显示事件、消息或整个时间线的特定选项
  • 自定义点赞框的尺寸以及自动调整到小部件容器
  • 显示/隐藏时间线中的帖子,隐藏页面封面,甚至显示一个小标题
  • 使用自定义 CSS 进行其他自定义

因此,如果您尝试使用 Facebook 页面为您的网站设置更好的社交媒体集成,那么使用 Facebook 小部件是可用的最佳和最简单的选项之一。

现在,让我们继续检查在 WordPress 中使用 Facebook 小部件的过程。

如何将 Facebook 小部件添加到 WordPress

在本指南中,我们将使用 Facebook Page like Widget,也称为Widget for Social Page Feeds 。 这是将 Facebook 小部件与您的网站连接起来的最佳插件之一。 虽然还有其他选择,但我们强烈推荐它,因为它简单且用户友好。

但是,如果您选择不同的工具,我们将在本教程中描述的方法也应该很有用,只需对短代码进行一些更改。 如果是这种情况,您可以在开始之前参考插件的文档/指南以获得更多指导。

现在,让我们看看如何一步一步地将 Facebook 小部件添加到 WordPress。

安装并激活 Facebook 小部件

让我们从 Facebook 小部件的安装过程开始。 首先,继续安装Widget for Social Page Feeds 插件,我们将在此演示中使用它。 该工具是免费的,并且在 WordPress 存储库中有超过 100,000 个活动安装。 要安装插件:

  1. 打开您的WordPress 仪表板侧边栏,然后单击Plugins > Add New
  2. 然后,使用右侧的搜索栏搜索Widget for Social Page Feeds
  3. 单击右侧插件卡旁边的安装按钮。
  4. 安装插件后,点击激活按钮,插件应该可以使用了。

将 facebook 小部件添加到 wordpress - 安装插件

如何使用 Facebook 小工具?

将 facebook 小部件添加到 wordpress - 插件图像

安装插件后,让我们看看如何使用它。 有两种方法:

  1. 在您的主题提供的小部件位置使用您的 Facebook 小部件
  2. 将其作为简码放在您的页面/帖子上。

这两个选项都非常容易实现,但我们强烈建议您将 Facebook 小部件添加到侧边栏或其他此类小部件位置。 该小部件易于设置、自定义,而且非常轻巧,因此有一个固定框来显示您的 Facebook 页面是个好主意。

但在开始之前,您需要保存Facebook 页面的 URL以显示在框上。 您所要做的就是打开您的 Facebook 页面并从浏览器的地址栏中复制 URL。 现在您已保存页面 URL,您可以继续。

1) 将 FB 小部件添加到 WordPress 小部件位置

要将 Facebook 小部件添加到 WordPress 主题的小部件位置,请转到您的管理仪表板>外观 > 小部件。

然后,从左侧的可用小部件列表中选择Facebook Page Like 小部件 然后,选择要显示小部件的位置并单击添加小部件。

将 facebook 小部件添加到 wordpress - 添加小部件

之后,您将看到该小部件将出现在右侧的侧边栏上。 在那里,单击Facebook Page Like Widget ,您将需要自定义一些其他详细信息,以便为您的网站设置好。

  • 首先,您可以更改标题以适合您的网站。
  • 然后,添加您之前在相应字段中复制的Facebook 页面的 URL
  • 之后,选择要在“赞”框中显示的标签。 您可以在事件、消息或显示页面的整个时间线之间进行选择。
  • 您还可以打开/关闭其他选项,例如显示页面时间轴中的帖子、隐藏封面照片、使用“设置宽度”和“设置高度”字段自定义框的大小等。

完成自定义 Facebook 小部件后,单击“保存”按钮,您的小部件应显示在您选择的位置。

将 facebook 小部件添加到 wordpress - 像框预览

2) 在帖子/页面中插入 Facebook 小部件

要将 Facebook 点赞框添加到您的帖子/页面,您必须使用插件的[fb_widget]短代码。 为此,只需将短代码添加到您的页面/帖子中,如下所示:

 [fb_widget fb_url="https://www.facebook.com/quadlayers/"]

请注意,您必须在https://www.facebook.com/quadlayers/上添加您的 Facebook 页面 URL。

所以,如果你想在你的网站上插入这个简码,你必须使用古腾堡编辑器的简码块。 只需单击添加块按钮并搜索简码小部件。 然后,单击简码小部件将其添加到您的页面/帖子。 之后,将短代码拖到您要放置的帖子的任何部分。

将 facebook 小部件添加到 wordpress - 添加块

然后,使用您的 Facebook URL 添加您的简码:

 [fb_widget fb_url=”https://www.facebook.com/quadlayers/”] 

将 facebook 小部件添加到 wordpress - 小部件短代码块

然后,一旦您保存/发布您的帖子,Facebook 小部件应显示在 WordPress 上,如下所示:

为了更好地了解插件的工作原理和简码参数,我们建议您查看插件的文档和支持。

结论

我们关于如何使用专用插件将 Facebook 小部件添加到 WordPress 的指南到此结束。 为了确保您已准备好设置 Facebook 赞框小部件,请记住以下步骤:

  • 安装并激活插件
  • 获取您的 Facebook 页面的 URL
  • 将 Facebook 小部件添加到小部件位置,然后将 Facebook 页面的 URL 放在小部件 URL 字段中
  • 将短代码与您的 Facebook 页面的 URL 一起使用

如果您按照说明有任何问题,请在评论中告诉我们,我们很乐意为您提供帮助。 此外,请告诉我们您是否希望我们提供其他其他指南; 您的意见对我们来说意味着世界。

最后,如果您想在您的网站上添加更多社交媒体元素,我们建议您查看我们的 WordPress 最佳 Instagram Feed 插件指南。