如何将 Facebook 页面的 feed 嵌入到我的网站中

Question

我正在与一个团体合作，帮助推广一项慈善活动。我想要嵌入的页面不是我的 Facebook 个人资料，而是某人创建的 Facebook 页面。

我想在我的网页中显示该新闻源。如果我需要从此页面获取信息/访问权限，请告诉我。如果其他人有有效的示例，请告诉我。我一直在使用 jsfiddle.net 来绘制它。

这是页面：http://www.facebook.com/pages /厨师-经典-淘汰赛/225835004169328

Answer 1

啊哈，这非常简单，不需要编程。

请参阅：https://developers.facebook.com/docs/plugins/page-plugin

您需要保持显示流选项处于打开状态。您可以调整宽度和高度以及其他一些内容。

Answer 2

如果您正在寻找自定义代码而不是插件，那么这可能会对您有所帮助。 Facebook 图表自发展以来经历了一些变化。这些步骤适用于我最近尝试过并且运行良好的最新 Graph API。

涉及三个主要步骤 - 1. 确保您可以使用服务器端语言 (PHP) 进行编码，2. 获取 Facebook 访问令牌，3. 调用 Graph API 并传递访问令牌。

1.获取访问令牌 - 以下是获取 Facebook 页面的访问令牌的分步过程。 - 在我的网站上嵌入 Facebook 页面 feed。为此，您需要在 Facebook 开发者页面中创建一个应用程序，该应用程序将为您提供应用程序 ID 和应用程序密钥。使用这两个并获取访问令牌。

2.调用 Graph API - 一旦获得访问令牌，这将非常简单。您只需使用要检索的所有字段/属性形成 Graph API 的 URL，并向该 URL 发出 GET 请求。下面是一个关于如何在 ASP.NET MVC 中执行此操作的示例。 使用 asp.net mvc 嵌入 facebook feed。这在任何其他技术中都应该非常相似，因为它只是一个 HTTP GET 请求。

示例 FQL 查询： https://graph.facebook.com/FBPageName/posts?fields=full_picture,picture,link,message,created_time&limit=5&access_token=YOUR_ACCESS_TOKEN_HERE

Answer 3

在新的 page-plugin 中，您可以在网站中执行多个选项卡操作。页面插件可让您轻松在您的网站上嵌入和推广任何 Facebook 页面。就像在 Facebook 上一样，您的访问者无需离开您的网站即可点赞和分享页面。

1. 在您的页面上包含一次 JavaScript SDK，最好是在开始 标记之后。

<div id="fb-root"></div>
<script>(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return;
  js = d.createElement(s); js.id = id;
  js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.5&appId={APP_ID}";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>

2. 将插件的代码放置在您希望插件出现在页面上的任何位置。

<div class="fb-page" 
     data-href="https://www.facebook.com/YourPageName" 
     data-tabs="timeline" 
     data-small-header="false" 
     data-adapt-container-width="true" 
     data-hide-cover="false" 
     data-show-facepile="true">
  <div class="fb-xfbml-parse-ignore">
    <blockquote cite="https://www.facebook.com/facebook">
      <a href="https://www.facebook.com/facebook">Facebook</a>
    </blockquote>
  </div>
</div>

您还可以更改以下设置：

此外，您现在还可以使用新页面插件创建时间线、事件和消息选项卡：

• 时间线选项卡：将显示 Facebook 页面时间线的最新帖子。
• 事件选项卡：人们可以关注您的页面事件并从插件订阅事件。
• 消息选项卡：人们可以直接从您的网站向您的页面发送消息。人们需要登录才能使用此功能。

<div class="fb-page" 
  data-tabs="timeline,events,messages"
  data-href="https://www.facebook.com/YourPageName"
  data-width="380" 
  data-hide-cover="false">
</div>

Answer 4

Like Box/ Page 插件基本上是一个 iframe 并且丑陋：D

所以我创建了自己的免费插件，我称之为 Famax 插件 显示 FanPage 提要。它与点赞框类似，但具有更好的用户界面并且更可定制。

另外，由于 Like 框显示在具有固定宽度和高度等的 iframe 中，因此它的响应速度并不快。

Answer 5

如果我错了，请纠正我，但 Facebook 似乎已弃用 Activity Feed 插件。此外，似乎不再有任何替代活动的插件。

这是链接：https://developers.facebook.com/docs/plugins/activity

Answer 6

对于网站开发人员，您的另一个选择是遵循有效的 Facebook Graph API 教程，例如 这个。

但是，如果您需要一个可以立即自定义和嵌入 Facebook 页面提要的快速解决方案，则应该使用网站插件，例如 这个。

以下是分步指南：

1. 获取免费密钥或付费密钥。
2. 前往此登录页面并使用密钥登录。
3. 登录后，单击“+ 创建自定义源”按钮。
4. 在弹出窗口中，为您的自定义 Facebook 页面提要命名。
5. 在下拉列表中，选择“您网站上的 Facebook 页面源”选项。
6. 输入您的 Facebook 主页 ID。
7. 单击“继续”按钮。这将向您显示自定义选项。
8. 单击屏幕右上角的“嵌入网站”按钮。
9. 在弹出窗口中，单击“复制代码”按钮复制嵌入代码。
10. 将嵌入代码粘贴到您的网站上。

访问教程链接查看那里也有现场演示。

Answer 7

将插件的代码放置在您希望插件出现在页面上的任何位置。

<iframe 
  src="https://www.facebook.com/v18.0/plugins/page.php?href=https://www.facebook.com/facebook&show_posts=true"
  frameborder="0"
  allowtransparency="true"
  allowfullscreen="true"
  scrolling="no"
  allow="encrypted-media"
  width="500px"
  height="500px"
  style="border:none;visibility:visible">
</iframe>

将此链接 https://www.facebook.com/facebook 替换为您的页面链接