Question

我想为Wordpress博客安装Facebook Comments和Like button。所以我在<body>之后立即设置了这段代码。第一部分是Facebook SDK for web，我认为这里没有错误。第二部分是Web应用程序的代码块。（我已经用XXXXX替换了appId。）

<script>
  window.fbAsyncInit = function() {
    FB.init({
      appId      : 'XXXXXX',
      xfbml      : true,
      version    : 'v2.4'
    });
  };

  (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>

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

然后我在单一帖子后立即放置Facebook Like Button。

<div class="fb-like" data-layout="box_count" data-action="like" data-show-faces="true" data-share="false"></div>

此后Facebook评论。

<div class="fb-comments" data-numposts="3" data-width="100%" data-href="http://<?php echo $_SERVER["HTTP_HOST"] . $_SERVER["REQUEST_URI"] ?>" data-mobile="false"></div>

但在我的Wordpress temp demo中，Facebook评论显示，而Like按钮则没有。这里有什么不对吗？

Answer 1

最初，我想让Facebook评论变得灵活，所以给它一个100％宽度的值。但在那种情况下，我还无意中在Facebook Like Button中指定了一些div。因此，孩子的100％宽度只会使父级折叠，整个Like按钮会折叠。

您可以在this temp demo或image中查看Facebook赞按钮的整个当前结构。

在Wordpress上设置Facebook评论和喜欢按钮

1 个答案: