DisqusJS icon indicating copy to clipboard operation
DisqusJS copied to clipboard

跟随深色模式切换

Open eallion opened this issue 2 years ago • 1 comments

当 DisqusJS 加载完以后,切换网站的深色(或浅色)样式,评论样式不能跟随适配。我发现我也提过这样的 Issue,现在解决了,分享一下。每个网站切换深色模式的方法不一样,所以感觉不太适合提 PR。

  1. 监听样式切换事件
let event = new Event('themeChanged');
document.dispatchEvent(event);
  1. 重载 DisqusJS
<script>
    var disqus_config = function () {
        this.page.url = ' '; // Replace PAGE_URL with your page's canonical URL variable
        this.page.identifier = ' '; // Replace PAGE_IDENTIFIER with your page's unique identifier variable
    };

    (function () {
        var d = document,
            s = d.createElement('script');
        s.src = 'https://eallion.disqus.com/embed.js'; // Replace SITE_URL with your site's URL
        s.setAttribute('data-timestamp', +new Date());
        (d.head || d.body).appendChild(s);
    })();

    // Disqus theme switching
    document.addEventListener('themeChanged', function (e) {
        if (document.readyState == 'complete') {
            DISQUS.reset({
                reload: true,
                config: disqus_config
            });
        }
    });
</script>

ref: https://help.disqus.com/en/articles/1717163-using-disqus-on-ajax-sites

eallion avatar May 23 '22 04:05 eallion

#40 #60

eallion avatar May 23 '22 04:05 eallion