bootstrap 模态的 Facebook 评论插件

Question

对于我正在构建的简单网站，我需要 Facebook 社交插件 - 评论集成。

这很基础。页面加载 (item.php) 来自 mysql 数据库的相应数据。我为社交插件创建了一个 FB 应用程序并将代码添加到页面。这没有问题，但是......我希望评论插件在用户单击同一页面上的评论按钮后以模式 window (Bootstrap) 显示。（即：This link - press comment button）

模式打开很好，但评论插件没有显示。当我在 Chrome 检查器中检查代码时，Facebook 插件似乎已加载并正在生成文本和图像。但出于某种原因，它不会出现在我的模态 window.

中

我已经添加了一个 "share" 和一个 "like" 按钮来查看它们是否会显示，两者都不会出现任何问题。

有人知道如何解决这个问题吗？

这是一段代码：按钮：

<a class="btn btn-block btn-primary" data-toggle="modal" data-target="#commentModal">Comments (<span class="fb-comments-count" data-href="<?php echo $config['paths']['siteURL']; ?>item.php?item=<?php echo $res['titel']; ?>"></span>)</a>

模态 window:

<div class="modal fade" id="commentModal" tabindex="-1" role="dialog" aria-labelledby="commentModal" aria-hidden="true" data-backdrop="false">
<div class="modal-dialog">
    <div class="modal-content">
        <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
        <h4 class="modal-title" id="myModalLabel">Comments for <?php echo $res['titel']; ?></h4>
        </div>
        <div class="modal-body">
            <div class="fb-comments" data-href="<?php echo $config['paths']['siteURL']; ?>item.php?item=<?php echo $res['titel']; ?>" data-numposts="5" data-colorscheme="light"></div>
        </div>
        <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
    </div>
</div>

Answer 1

评论视图的span的宽度设置为0是因为它一开始被bootstrap隐藏了，然后显示之后，宽度还是0所以看不到。也许你可以手动设置我猜的宽度。

这不是facebook sdk的bug。 Facebook sdk 不知道你以后要用这个跨度做什么。它只能在初始加载期间呈现它。也许 bootstrap 可以在他们的未来版本中对此做些什么。但不要抱太大希望...

bootstrap 模态的 Facebook 评论插件

Facebook comment plugin in bootstrap modal

jquery

facebook

facebook-social-plugins

twitter-bootstrap