Question

我正在尝试将Facebook页面插件集成到一个网页中（一个简单的html页面上没有其他内容）。

我正确地遵循了所有步骤，但最后，我在页面上看不到任何Facebook页面插件，只是指向我的Facebook页面的链接。

这是Facebook的指示：

在您的网页上包含一次SDK JavaScript，最好是在开始正文标记之后。

<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/fr_FR/sdk.js#xfbml=1&version=v2.3";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>

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

<div class="fb-page" data-href="https://www.facebook.com/hyundaifrance" data-width="300" data-height="400" data-small-header="true" data-adapt-container-width="false" data-hide-cover="false" data-show-facepile="false" data-show-posts="true"><div class="fb-xfbml-parse-ignore"><blockquote cite="https://www.facebook.com/hyundaifrance"><a href="https://www.facebook.com/hyundaifrance">Hyundai France</a></blockquote></div></div>

看起来很简单！我应该问我做错了什么或者究竟是什么问题？这是我的实际“完整版”代码：

<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/fr_FR/sdk.js#xfbml=1&version=v2.3";
    fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>

<h1>I want my Plugin to appear below this title</h1>

<div class="fb-page" data-href="https://www.facebook.com/hyundaifrance" data-width="300" data-height="400" data-small-header="true" data-adapt-container-width="false" data-hide-cover="false" data-show-facepile="false" data-show-posts="true">
<div class="fb-xfbml-parse-ignore"><blockquote cite="https://www.facebook.com/hyundaifrance"><a href="https://www.facebook.com/hyundaifrance">Hyundai France</a></blockquote></div>
</div>

</body>

我一直在尝试更改Facebook SDK链接，但它没有奏效：

来自：js.src = "//connect.facebook.net/fr_FR/sdk.js#xfbml=1&version=v2.3";

对此：js.src = "http://connect.facebook.net/fr_FR/sdk.js#xfbml=1&version=v2.3";

还有：js.src = "//connect.facebook.net/fr_FR/sdk.js#xfbml=1";

我也试过他的代码：

<script>
      window.fbAsyncInit = function() {
        FB.init({
          appId      : '113869198637480',// The page id I want to use
          xfbml      : true,
          version    : 'v2.3'
        });
      };

      (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";
         fjs.parentNode.insertBefore(js, fjs);
       }(document, 'script', 'facebook-jssdk'));
    </script>

而不是这个，在Facebook页面插件指令上给出：

<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/fr_FR/sdk.js#xfbml=1&version=v2.3";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>

也没用。

有人可以帮我吗？

非常感谢。

Answer 1

这实际上有效，但我不明白为什么。

这仍然不是您使用代码生成器时获得的内容。我做了什么：

生成页面插件后，我从源代码中选择了代码（使用控制台），而不是从生成器中复制代码：

<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/fr_FR/sdk.js#xfbml=1&version=v2.3";
    fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>

<h1>I want my Plugin below this title</h1>

<iframe width="800px"
        height="800px"
        frameborder="0"
        allowtransparency="true"
        scrolling="yes"
        style="border: medium none; visibility: visible; "
        sdk=joey&amp;
        show_facepile=false&amp;
        show_posts=true&amp;
        small_header=true&amp;">

</iframe>

如果您对此解决方案仍有解释或评论，我会听取您的意见，因为我不会将此代码用于个人用途，但仅限于专业用途，我真的需要以正确的方式做事

非常感谢您的回答：）

Facebook页面插件不起作用

1 个答案: