WordPress 添加媒体
最近，一位读者问我们如何将 Facebook 活动日历添加到他们的 WordPress 网站？
最近，一位读者问我们如何将 Facebook 活动日历添加到他的 WordPress 网站？
Facebook 活动是社区组织具有内置社交功能的活动的简便方法。但是，如果您不在网站上宣传这些活动，您的网站访问者可能会错过这些活动。
Facebook 活动是社区组织具有内置社交功能的活动的简便方法。但是，如果您不在网站上宣传这些活动，您的网站访问者可能会错过这些活动。
在本文中，我们将向您展示如何在 WordPress 中添加 Facebook 活动日历以最大限度地扩大您的覆盖范围。
在本文中，我们将向您展示如何在 WordPress 中添加 Facebook 活动日历以最大限度地扩大您的影响力。
为什么要在您的网站上添加Facebook活动日历？ （Why Add a Facebook Events Calendar on Your Website?）
将 Facebook 活动日历添加到您的网站可让访问者轻松了解您即将举办的活动。您的用户可以在 Facebook 上将自己标记为感兴趣或将参加该活动。
将 Facebook 活动日历添加到您的网站后，访问者可以轻松找到有关您即将举办的活动的信息。您的用户可以将自己标记为感兴趣或参加 Facebook 上的活动。
这是获得更多 Facebook 关注者并建立参与度的好方法。它还可以节省您的时间和精力，因为它会自动从 Facebook 提取事件。
这是获得更多 Facebook 粉丝并建立参与度的好方法。它还可以节省您的时间和精力，因为它会自动从 Facebook 提取事件。
You will not need to manually add events to your website using a WordPress 日历插件. You can simply create Facebook events instead and automatically show them on your site.
您将不需要使用WordPress 日历插件将事件手动添加到您的网站。 您可以直接创建Facebook事件，然后将其自动显示在您的网站上。
笔记： You will need a Facebook page, not a personal profile. This page will need at least 1 event.
注意：您将需要一个Facebook页面，而不是个人资料。 此页面至少需要1个活动。
In this tutorial, we’ll take you through two ways to add a Facebook events calendar to your WordPress 网站.
在本教程中，我们将为您介绍两种将Facebook事件日历添加到WordPress建站方法 。
第一种方法需要在您的网站上输入一些代码，对于那些不想使用插件的用户来说这很简单。但是它不提供任何自定义选项。
第一种方法需要在您的网站上输入一些代码，这对于那些不想使用插件的人来说很容易。但是，它不提供任何自定义选项。
第二种方法是我们向想要自定义事件日历显示并对显示内容进行更精细控制的用户推荐的方法。以下是我们制作的自定义 Facebook 活动日历显示的示例：
第二种方法是我们向想要自定义事件日历显示并对显示内容进行更精细控制的用户推荐的方法。以下是我们制作的自定义 Facebook 事件日历显示的示例：
方法1.在没有插件的情况下将Facebook事件添加到您的站点 （Method 1. Add Facebook Events to Your Site Without a Plugin）
如果您根本不想使用插件怎么办？无需使用插件即可将 Facebook 事件添加到 WordPress 网站。
如果您根本不想使用插件怎么办？无需使用插件即可将 Facebook 事件添加到您的 WordPress 网站。
此方法涉及向您的网站添加一些代码。如果您是初学者，我们不建议您这样做。它还无法让您对事件的显示方式有太多控制。
此方法涉及向您的网站添加一些代码。如果您是初学者，我们不建议您这样做。它也无法完全控制事件的显示方式。
要使用此方法，您需要使用专为开发人员设计的 Facebook 工具。它被称为 Facebook 页面插件。不要让这个名字让您感到困惑。它不是 WordPress 插件。
要使用此方法，您需要使用专为开发人员设计的 Facebook 工具。它被称为 Facebook 页面插件。不要让这个名字让您感到困惑。它不是 WordPress 插件。
First, go to the 页面插件工具 and enter your Facebook page’s URL.
首先，转到页面插件工具，然后输入您的Facebook页面的URL。
Facebook 现在将显示您页面提要的预览。接下来，您需要删除选项卡字段下的“时间线”一词并添加“事件”。您还可以在此处设置事件源的宽度和高度。
Facebook 现在将显示您的页面提要的预览。接下来，您需要删除“标签”字段下的“时间轴”一词，并添加“事件”。您还可以在此处设置事件源的宽度和高度。
现在，您将看到预览框中列出了您的事件。只需单击预览下方的“获取代码”按钮即可。
您现在将在预览框中看到您的事件。只需单击预览下方的“获取代码”按钮即可。
这将弹出一个弹出窗口，您需要在其中切换到 iFrame 选项卡并复制嵌入代码。
这将弹出一个弹出窗口，您需要在其中切换到 iFrame 标记并复制嵌入代码。
接下来，转到 WordPress 网站的管理区域并编辑要在其中显示 Facebook 事件的帖子或页面。
接下来，转到 WordPress 网站的管理区域并编辑您希望 Facebook 事件出现的帖子或页面。
在帖子编辑屏幕上，单击 (+) 图标添加新块，然后在格式块中找到 HTML 块。
在帖子编辑屏幕上，单击 (+) 图标添加新块，然后在格式块中找到 HTML 块。
接下来，您需要将 Facebook 页面插件工具中的代码粘贴到此块中：
接下来，您需要将 Facebook 页面插件工具中的代码粘贴到此块中：
之后，您可以保存您的帖子或发布它。您现在可以访问此帖子或页面以查看您的 Facebook 事件源的运行情况。
之后，您可以保存或发布您的帖子。您现在可以访问此帖子或页面来查看您的 Facebook 活动源。
要更改其显示方式，您需要返回 Facebook 页面插件工具并再次创建代码。但是，您只能更改一些设置。
要更改其显示方式，您需要返回 Facebook 页面插件工具并再次创建代码。但是，只能更改少数设置。
If you want to customize how your events are displayed and have more fine control over the options, then we recommend using the WordPress plugin 自定义 Facebook Feed Pro that we will cover in the next method.
如果您想自定义事件的显示方式并更好地控制选项，则建议使用WordPress插件“ 自定义 Facebook Feed Pro” ，我们将在下一种方法中介绍。
方法2.使用自定义Facebook Feed Pro插件 （Method 2. Using the Custom Facebook Feed Pro Plugin）
For this tutorial, you will need to install and activate the 粉碎气球自定义 Facebook Feed Pro plugin. For more details, see our step by step guide on 如何安装 WordPress 插件.
对于本教程，您将需要安装并激活粉碎气球自定义 Facebook Feed Pro插件。 有关更多详细信息，请参阅有关如何安装 WordPress 插件步指南。
安装插件后，您需要将其连接到您的 Facebook 帐户。
安装插件后，您需要将其连接到您的 Facebook 帐户。
将您的 Facebook 帐户与 Smash Balloon 关联
将您的 Facebook 帐户与 Smash Balloon 关联
Normally with Smash Balloon, you can connect your account automatically. To do this, you just need to go to Facebook 动态 » 设置, then click the ‘Connect a Facebook account’ button.
通常，使用Smash Balloon，您可以自动连接您的帐户。 为此，您只需转到Facebook 动态 » 设置 ，然后单击“连接Facebook帐户”按钮。
但是，由于最近的 Facebook API 更改，此方法目前不适用于在您的网站上显示事件。
但是，由于最近的 Facebook API 更改，此方法目前不适用于在您的网站上显示事件。
您需要手动生成 Facebook 访问令牌才能显示事件。这涉及几个不同的步骤，但幸运的是，Smash Balloon 有一些工具可以使其尽可能简单。
您需要手动生成 Facebook 访问令牌才能显示事件。这涉及几个不同的步骤，但幸运的是，Smash Balloon 有一些工具可以使其尽可能简单。
First, you’ll need to go to the Facebook 开发者网站 and sign up for a developer’s account using your usual Facebook login details.
首先，您需要转到Facebook 开发者网站，并使用通常的Facebook登录信息注册开发者帐户。
如果您已经拥有开发者帐户，只需单击右上角的“我的应用程序”链接，然后单击“添加新应用程序”按钮。
如果您已经有开发者帐户，只需单击右上角的“我的应用程序”链接，然后单击“添加新应用程序”按钮。
如果您以前从未创建过应用程序，则只需单击“创建应用程序”按钮即可继续。
如果您以前从未创建过应用程序，只需单击“创建应用程序”按钮即可继续。
这将弹出一个弹出窗口，您需要在其中单击“For Everything Else”选项：
这将弹出一个弹出窗口，您需要在其中单击“其他所有”选项：
接下来，您需要输入应用程序的显示名称，然后单击“创建应用程序 ID”按钮。
接下来，您需要输入应用程序的显示名称，然后单击“创建应用程序 ID”按钮。
系统可能会提示您输入 Facebook 密码并完成验证码。之后，您将看到您的应用程序仪表板：
系统可能会提示您输入 Facebook 密码并填写验证码。之后您将看到您的应用程序仪表板：
On the left-hand side of your dashboard, you need to click 设置 » 基本.
在信息中心的左侧，您需要点击设置 » 基本 。
现在，只需单击“应用程序秘密”旁边的“显示”按钮即可。执行此操作时，系统可能会提示您再次输入 Facebook 密码。
现在，只需单击“应用程序秘密”旁边的“显示”按钮即可。执行此操作时，系统可能会提示您再次输入 Facebook 密码。
All you need to do for this step is copy the App ID and App Secret into the boxes in Step 13 on 这个粉碎气球页面:
此步骤所需要做的就是将“应用程序ID”和“应用程序机密”复制到“ 粉碎气球页面上的步骤13中的框中：
We’re now going to create the access token. First, you need to go to the Facebook Graph API 浏览器页面.
现在，我们将创建访问令牌。 首先，您需要转到Facebook Graph API 资源管理器页面 。
在右侧，确保在“Facebook 应用程序”下拉列表中选择您的应用程序名称。然后，继续并单击“生成访问令牌”按钮：
确保在右侧的“Facebook 应用程序”下拉菜单中选择了您的应用程序名称。然后，继续并单击“生成访问令牌”按钮：
这将弹出一个弹出窗口，您只需单击“继续”按钮即可继续。
这将弹出一个弹出窗口，您只需单击“继续为”按钮即可继续。
The next step here is to add a special permission to your access token. To do this, all you need to do is copy and paste pages_read_user_content into the ‘Add Permission’ line and then click on it when it appears in a small popup, like this:
下一步是向访问令牌添加特殊权限。 为此，您需要做的就是将pages_read_user_content复制并粘贴到“添加权限”行中，然后在一个小的弹出窗口中单击它，如下所示：
添加该权限后，它应该如下所示：
添加权限后，应该如下所示：
您现在需要再次单击“生成访问令牌”按钮。现在，您会看到这样的弹出窗口。只需单击“继续为...”按钮：
现在您需要再次单击“生成访问令牌”按钮。现在，您将看到一个像这样的弹出窗口。只需单击“继续...”按钮：
然后 Facebook 会要求您选择要使用的页面。选择您要显示事件的页面。此处仅选择一页很重要。选中所选页面旁边的框后，单击“下一步”按钮。
然后 Facebook 会要求您选择要使用的页面。选择要显示事件的页面。此处仅选择一页很重要。选中您选择的页面旁边的框后，单击“下一步”按钮。
Facebook 随后将显示最终屏幕。
Facebook 随后将显示最终屏幕。
在这里，您所需要做的就是单击“完成”。关于提交应用程序供审核的 Facebook 消息不适用于您，因为该应用程序将仅停留在开发模式。
在这里，您所需要做的就是单击“完成”。 Facebook 上有关提交应用程序供审核的消息不适用于您，因为该应用程序仅处于开发模式。
接下来，您只需最后一次单击“获取访问令牌”按钮即可。现在，Facebook 将为您提供临时访问令牌。
接下来，您只需最后一次单击“获取访问令牌”按钮即可。现在，Facebook 将为您提供临时访问令牌。
该令牌只能用于进行第一次 API 调用。这就是为什么您需要使用 Smash Ballon 的文档页面来进行 API 调用并获取扩展令牌。
令牌只能用于进行第一个 API 调用。这就是为什么您需要使用 Smash Ballon 的文档页面来进行 API 调用并获取扩展令牌。
Simply copy and paste it into the box at step 23 在本页.
只需在本页 23步将其复制并粘贴到框中即可。
将其复制到框中后，单击“扩展我的令牌”按钮。然后您将在一个大框中看到您的扩展令牌：
将其复制到框中后，单击“扩展我的令牌”按钮。然后您将在一个大框中看到扩展令牌：
将其在单独的选项卡中保持打开状态，或者将其复制并粘贴到安全的位置，因为您稍后会需要它。
将其保存在单独的选项卡中，或者将其复制并粘贴到安全的地方以便稍后使用。
Now that we have all the information we need, let’s connect your WordPress 博客 to Facebook.
现在我们有了所需的所有信息，让我们将您的WordPress 博客连接到Facebook。
Simply go to the Facebook 动态 » 设置 in your WordPress dashboard and click on the ‘Manually connect account’ button:
只需转到WordPress仪表板中的Facebook 动态 » 设置 ，然后单击“手动连接帐户”按钮：
您将看到一个下拉列表，您只需在其中选择“页面”选项：
您将看到一个下拉列表，只需选择“页面”选项：
接下来，输入您的页面名称、页面 ID（Facebook 页面 URL 的最后部分）以及您之前创建的扩展访问令牌。然后，继续并单击“连接帐户”按钮。
接下来，输入页面名称、页面 ID（Facebook 页面 URL 的最后部分）以及您之前创建的扩展访问令牌。然后，继续并单击“连接帐户”按钮。
执行此操作后，您将看到自定义 Facebook Feed Pro 设置中列出的连接页面：
完成此操作后，您将看到自定义 Facebook Feed Pro 设置中列出的连接页面：
最后一步是单击“Make Primary Feed”按钮：
最后一步是单击“制作主提要”按钮：
完成此操作后，您将看到屏幕上方的 Facebook ID 和 Facebook 访问令牌现已填写：
完成后，您将在屏幕上看到上面的 Facebook ID 和 Facebook Access Token 已被填写：
执行此操作后，不要忘记单击“保存设置”按钮。
完成此操作后，请不要忘记单击“保存设置”按钮。
设置您的 Facebook 活动日历源
设置您的 Facebook 活动日历源
Next, we’re going to set up the Facebook feed so that it only shows events, not all posts. To do this, you will need to go to the 定制 » 一般 page.
接下来，我们将设置Facebook feed，使其仅显示事件，而不是所有帖子。 为此，您需要转到“ 定制 » 常规”页面。
在这里，您需要将页面向下滚动到帖子类型部分。当您到达该部分时，您需要取消选中除“事件”之外的所有复选框。
在这里，您需要将页面向下滚动到“帖子类型”部分。当您到达该部分时，您需要取消选中除“事件”之外的所有复选框。
You can now add your Events feed to any 帖子或页面 on your site. You can even add it to your sidebar or footer using a 小部件.
现在，您可以将活动供稿添加到网站上的任何帖子或页面上。 您甚至可以使用小零件将其添加到侧边栏或页脚中。
We’re going to create a page for our Facebook events. Go to 页面 » 添加新内容 to make a new page.
我们将为我们的Facebook活动创建一个页面。 转到页面 » 添加新页面以创建新页面。
On the post edit screen, click on the (+) icon to 添加一个新块. Find the Custom Facebook Feed block in the Widgets section, or search for it using the search bar.
在帖子编辑屏幕上，单击(+)图标以添加一个新块 。 在“小部件”部分中找到“自定义Facebook Feed”块，或使用搜索栏进行搜索。
然后，您将在块编辑器中看到您的 Facebook 事件源。您可以预览页面以查看其在您网站上的实时情况。
然后，您将在块编辑器中看到您的 Facebook 事件源。您可以预览页面以在网站上实时查看它。
笔记： We’ve added some extra styling to our events feed. We’ll explain how to do that in a moment.
注意：我们在事件Feed中添加了一些额外的样式。 我们稍后将说明如何执行此操作。
If you’re using the 经典编辑器, then you can add your feed to your page using the 短代码 [custom-facebook-feed]. Simply enter that wherever you want the events to appear on the page:
如果您使用的是经典编辑器 ，则可以使用短代码 [custom-facebook-feed]将提要添加到页面中。 只需输入您希望事件显示在页面上的位置即可：
您还可以使用该短代码将 Facebook Feed 添加到侧边栏或任何其他启用小部件的区域。
您还可以使用此短代码将 Facebook feed 添加到侧边栏或任何其他启用小部件的区域。
To do this, go to 外观 » 小部件 in your WordPress dashboard. Simply add a text widget to your sidebar and copy and paste the shortcode into it:
为此，请转到WordPress信息中心中的外观 » 小部件 。 只需将一个文本小部件添加到边栏中，然后将简码复制并粘贴到其中：
自定义 Facebook 事件源在 WordPress 中的显示方式
自定义 Facebook 事件源在 WordPress 中的显示方式
您可能想要更改默认设置，以使您的 Facebook 活动在您的网站上看起来尽可能良好。
您可能想要更改默认设置，以使您的 Facebook 活动在您的网站上看起来尽可能良好。
使用自定义 Facebook Feed Pro，您可以更改各种详细信息，包括随事件列出的信息以及事件的样式方式。
使用自定义 Facebook Feed Pro，您可以更改各种详细信息，包括事件中列出的信息和事件的样式。
To get started, go to the Facebook 动态 » 自定义 page and click on the ‘Post Types’ link or scroll down to that section of the page. There, you will see various options for your events feed.
首先，请转到Facebook Feed »“自定义”页面，然后单击“帖子类型”链接或向下滚动到页面的该部分。 在那里，您将看到事件供稿的各种选项。
我们建议使用“活动页面”作为活动的来源。这样，它们将按照事件发生的时间顺序显示，而不是按照您添加它们的时间顺序。
我们建议使用事件页面作为事件源。这样它们就会按照事件发生的顺序出现，而不是按照您添加事件的时间出现。
如果需要，您可以更改事件偏移量以在事件开始后尽快停止显示。例如，您可以在活动开始后 1 小时（而不是默认的 6 小时）删除活动：
如果需要，可以将事件偏移更改为事件开始后立即停止显示。例如，您可以在事件开始后 1 小时（而不是默认的 6 小时）删除事件：
进行更改后，请确保单击页面底部的“保存更改”按钮。
进行更改后，请务必单击页面底部的“保存更改”按钮。
The next step is to decide on the layout for your events calendar. To choose this, go to 自定义 » 帖子布局, and simply pick one of the options. We’re going to use the Half-width display for our events.
下一步是确定事件日历的布局。 要选择此选项，请转到“ 自定义»»帖子布局 ，然后只需选择其中一个选项。 我们将对事件使用半角显示。
如果向下滚动页面，您将看到显示/隐藏各种详细信息的选项。您可以根据需要选中或取消选中这些。
如果向下滚动页面，您将看到显示/隐藏各种详细信息的选项。您可以根据自己的需要选择是否勾选这些。
完成此页面上的更改后，请确保单击“保存更改”按钮。
在此页面上完成更改后，请务必单击“保存更改”按钮。
You may also want to customize how your events posts look on your site. To do this, go to 自定义 » 帖子风格 section in Facebook Feed settings.
您可能还想自定义事件帖子在您网站上的外观。 为此，请转到Facebook Feed设置中的“ 自定义 » 风格帖子”部分。
您可以在常规样式或带圆角的盒装样式之间切换
您可以在常规样式或带圆角的盒装样式之间切换
选择样式后，您可以继续向下滚动页面以获取更多选项，例如文本颜色、大小和格式。
选择样式后，您可以继续向下滚动页面以获取更多选项，例如文本颜色、大小和格式。
对设置感到满意后，请确保单击页面底部的“保存更改”按钮。
对设置感到满意后，请务必单击页面底部的“保存更改”按钮。
We hope this article helped you learn how to add a Facebook event calendar in WordPress. You may also want to see our 完整的 WordPress 社交媒体备忘单 and our 最佳电子邮件营销服务比较 to promote your events.
我们希望本文能帮助您学习如何在WordPress中添加Facebook事件日历。 您可能还想查看我们WordPress 的完整社交媒体备忘单，以及我们最佳电子邮件营销服务以促进您的活动的比较。
If you liked this article, then please subscribe to our YouTube 频道 for WordPress video tutorials. You can also find us on 推特 and Facebook.
如果您喜欢这篇文章，请订阅我们的YouTube 频道 WordPress视频教程。 您也可以在推特和Facebook上找到我们。
翻译自: https://www.wpbeginner.com/plugins/how-to-display-facebook-events-on-your-wordpress-site/
WordPress 添加媒体