博客评论插件 Beaudar(表达)

  很多人的博客都会有评论功能。对于大多数静态博客来说,评论是读者与博主建立联系的唯一桥梁。

  被广泛使用的评论插件是 Disqus,遗憾国外 UCG (用户自产内容)基本上都被墙了,国内还没看到有与其同样优秀的。

  我使用过 Wildfire 🔥,UI很不错,但是要用 Firebase ,在国内很不稳定,用了一段时间后发现使用 Github issue 的 Utterances 非常轻便快速,然后开始使用 Utterances。
  当然类似的项目,国内有:

  除了以上提到的,国内被广泛使用的,还有 Valine,使用了 Gravatar 作为用户图像,评论只需要提供 Gravatar 账号设置的邮箱,非常方便。

  但是还是觉得 utterances 的实现比较好,但是没有多语言是个缺陷。索性把它的源码拿来自己改成中文的了。

  于是,就有了 Beaudar(表达)

  我使用的是“Issue 标题包含页面标题”的版本,另外还有五个模式任君选择。引用代码可以在线生成。也可以参考我下方给出的代码片段,在引用时,我增加了模式切换提示,及加载的状态。

  完整的代码片段在 这里查看

/**
 * 在 #beaudar 处,append 评论的 script
 */
function addBeaudar() {
  // 显示加载状态
  var loading = document.getElementById('loading');
  loading.style.display = 'flex';
  var script = document.createElement('script');
  var beaudar = document.getElementById('beaudar');
  script.src = 'https://beaudar.lipk.org/client.js';
  script.setAttribute('repo', 'zsdycs/lipk.org');
  script.setAttribute('issue-term', 'title');
  script.setAttribute('crossorigin', 'anonymous');
  if (window.localStorage.getItem('darkmode') === 'day') {
    script.setAttribute('theme', 'github-light');
    window.localStorage.setItem('beaudar-theme', 'github-light');
  } else {
    script.setAttribute('theme', 'github-dark');
    window.localStorage.setItem('beaudar-theme', 'github-dark');
  }
  script.async = true;
  beaudar.appendChild(script);
  // 处理评论是否加载完成
  beaudarEnd();
}

  原文阅读,请移步至 https://lipk.org/blog/2020/05/31/how-to-use-beaudar/

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值