同一页面上有多个 DISQUS？

Question

我需要在我网站的网页上插入 DISQUS 系统。那很容易。

这里的问题是我需要在同一页上插入多个 DISQUS 框。

我需要像这个之类的东西。每篇文章、每个段落都有自己的评论区。

有什么建议吗？也许我需要通过 AJAX 使用某种 API 加载评论？

我将在我的 WordPress 网站的页面上使用它。

Answer 1

你可以在这里尝试这个技巧，它对我有用：http:// collaborable.com/blog/disqus-jquery-hack-awesome-ux

不幸的是，除了 通过 Wayback Machine。

该链接的相关部分如下。显示/隐藏评论：

<div class="comments">
  <p class="nocomment">
    <a class="nocomment" href="/">Hide comments</a>
  </p>
  <div class="disqus_thread"></div>
</div>
<p class="comment">
  <a class="comment"
    href="http://collaborable.com/blog/blog-entry-title"
    data-disqus-identifier="blog-entry-id">
    <span>Leave a comment</span>
  </a>
</p>

...以及相应的 Javascript：

     // DISQUS vars.
    var disqus_shortname = 'collaborable';
    var disqus_identifier = '';
    var disqus_url = '';

     // Leave a comment/cancel.
    $('.entry a.comment').click(function () {
        // Firefox? Bad firefox.
        if ($.browser.mozilla && window.disqus_loaded) {
            return true;
        }

        // Init DISQUS.
        disqus_identifier = $(this).data('disqus-identifier');
        disqus_url = $(this).attr('href');

        // DISQUS requires each thread to have the ID #disqus_thread.
        $entry = $(this).parents('div.entry');
        $('#disqus_thread').removeAttr('id');
        $entry.find('div.disqus_thread').attr('id', 'disqus_thread');

        // Load DISQUS script, if not already loaded.
        if ($entry.find('div.disqus_thread .dsq-reply').length == 0) {
            $.getScript('http://' + disqus_shortname + '.disqus.com/embed.js',
                function () {
                    window.disqus_interval =
                        setInterval('is_disqus_loaded("' + $entry.attr('id') + '")',
                            200);
                }
            );
        }

        // Hide/kill other DISQUS forums.
        $entry.find('a.nocomment').trigger('click');
        $(this).find('span').addClass('loading');
        return false;

    });

     // Hide/kill all open DISQUS forums.
    $('.entry a.nocomment').click(function () {
        $('div.comments').slideUp('normal',
            function () {
                $(this).find('.disqus_thread').empty();
            });
        $('p.comment').slideDown();
        return false;
    });

    function is_disqus_loaded(entry_id) {
        $entry = $('#' + entry_id);
        if ($entry.find('div.disqus_thread .dsq-reply').length) {
            clearInterval(window.disqus_interval);
            window.disqus_loaded = true;
            $entry.find('div.comments').slideDown();
            $entry.find('a.comment span').removeClass('loading');
            $entry.find('p.comment').slideUp();
        }
    }

Answer 2

您可以尝试 http://tsi.github.io/inlineDisqussions/
它将为您提供由 Disqus 提供支持的每段落评论线程。
只需下载脚本和样式表并包含它们（在 jQuery 之后）。
然后像这样调用脚本：

<script>
  disqus_shortname = 'your_disqus_shortname';
  jQuery(document).ready(function() {
    jQuery("p").inlineDisqussions();
  });
</script>

请参阅链接页面以获取更多信息。
免责声明：我写了这个。

Answer 3

这可能会有所帮助。我的后端是 WordPress/PHP。我将此代码与 Elementor 结合使用。

此代码在单独的 Iframe 'src' 中加载 Disqus。 PHP 会为每个单独的帖子提取页面标识符/URL。

<iframe id="disqus" srcdoc="<div id='disqus_thread'></div>
<script>
    var disqus_config = function () {
    this.page.url = '<?php echo get_permalink(); ?>';  
    this.page.identifier = '<?php echo get_permalink(); ?>'; 
    };

    (function() { // DONT EDIT BELOW THIS LINE
    var d = document, s = d.createElement('script');
    s.src = 'https://XXXXXXXX.disqus.com/embed.js';
    s.setAttribute('data-timestamp', +new Date());
    (d.head || d.body).appendChild(s);
    })();
</script>
<noscript>Please enable JavaScript to view the <a href='https://disqus.com/?ref_noscript'>comments powered by Disqus.</a></noscript>" >
  <p>Your browser does not support iframes.</p>
</iframe>