1

Facebook フィードを HTML ページに統合したいと考えています。私は多くのことを調査し、これを行うためのいくつかの方法を見つけましたが、どれもうまくいかないようです...

私が最も効果的だと思う方法は、iFrame を使用することです。しかし、ページにロードするたびにエラーが発生します。エラーは、ファイルまたはディレクトリが見つからなかったことを示しています。エラーは、顔をしかめたスマイリーのある灰色の四角形で示されます。

注意してください、私はまだこのウェブサイトを作成しているので、すべてのコンテンツはオフラインであり、私のコンピューターからアクセスされます.

乾杯！

ここに私のコードがあります:

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>Sample</title>
        <link href="_resources/styles/sample.css" rel="stylesheet" type="text/css" />
        <link rel="stylesheet" href="themes/default/default.css" type="text/css" media="screen" />

    </head>
    <body>

<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/all.js#xfbml=1&appId=207087449372135";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>


<div class="fb-like-box" data-href="http://www.facebook.com/FacebookDevelopers" data-width="200" data-height="500" data-colorscheme="light" data-show-faces="true" data-header="true" data-stream="true" data-show-border="true"></div>

    </body>
</html>
4

1 に答える 1

2

非常にシンプルで、プログラミングは不要です。ここで確認してください - https://developers.facebook.com/docs/plugins/like-box-for-pages/

このコードは、body の開始タグの直後に配置する必要があります。

<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/all.js#xfbml=1&appId=207087449372135";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>

フィードを表示したい場所に以下のコードを貼り付けます。

<div class="fb-like-box" data-href="http://www.facebook.com/FacebookDevelopers" data-width="The pixel width of the plugin" data-height="The pixel height of the plugin" data-colorscheme="light" data-show-faces="true" data-header="true" data-stream="true" data-show-border="true"></div>

ここでデモをチェックしてください

于 2013-10-14T10:56:51.093 に答える