category
NotionNext
date
Jul 14, 2022
icon
Origin
giscus.app
password
slug
1657787346136
status
Published
summary
A comments widget built on GitHub Discussions.
tags
NotionNext
type
Post
A comments widget built on GitHub Discussions.
由 GitHub Discussions 驱动的评论系统。让访客借助 GitHub 在你的网站上留下评论和反应吧!本项目受 utterances 强烈启发。
- 开源。🌏
- 无跟踪,无广告,永久免费。📡 🚫
- 无需数据库。全部数据均储存在 GitHub Discussions 中。
- 支持自定义主题!🌗
- 支持多种语言。🌐
- 高度可配置。🔧
- 自动从 GitHub 拉取新评论与编辑。🔃
- 可自建服务!🤳
注意: giscus 仍处于活跃开发中。GitHub 也还在活跃地开发 Discussions 及其 API。因此,一些 giscus 的特性可能随时间损坏或改变。
它如何运作
giscus 加载时,会使用 GitHub Discussions 搜索 API 根据选定的映射方式(如 URL、
pathname
、<title>
等)来查找与当前页面关联的 discussion。如果找不到匹配的 discussion,giscus bot 就会在第一次有人留下评论或回应时自动创建一个 discussion。要评论,访客必须按 GitHub OAuth 流程授权 giscus app 代表他发帖。或者访客也可以直接在 GitHub Discussion 里评论。你可以在 GitHub 上管理评论。
配置
语言
选择 giscus 的显示语言。找不到你的语言?贡献一个吧。
语言
仓库
选择 giscus 连接到的仓库。请确保:
- 此仓库是公开的,否则访客将无法查看 discussion。
- giscus app 已安装否则访客将无法评论和回应。
- Discussions 功能已在你的仓库中启用。
页面 ↔️ discussion 映射关系
选择页面与嵌入的 discussion 之间的映射关系。
Discussion 分类
选择新 discussions 所在的分类。 推荐使用公告(announcements)类型的分类,以确保新 discussion 只能由仓库维护者和 giscus 创建。
Discussion 分类
只搜索该分类中的 discussion
当搜索匹配的 discussion 时,giscus 将只搜索该分类。
特性
选择是否启用某些特性。
启用主帖子上的反应(reaction)
Discussion 的主帖子上的反应将会显示在评论前。
输出 discussion 的元数据
Discussion 的元数据将定期被发送到父页面(被嵌入的页面)。作为演示,尝试启用此选项并在此页面打开浏览器控制台。查看文档获取更多细节。
将评论框放在评论上方
评论输入框会放在评论上方,这样用户可以在不滚动到讨论底部的情况下发表评论。
主题
选择适合你网站的主题。找不到合适的?贡献一个新主题吧。
主题
启用 giscus
在你想让评论出现的位置添加以下
<script>
标签。但如果已经存在带有 giscus
类的元素,则评论会被放在那里。<script src="https://giscus.app/client.js" data-repo="[在此输入仓库]" data-repo-id="[在此输入仓库 ID]" data-category="[在此输入分类名]" data-category-id="[在此输入分类 ID]" data-mapping="pathname" data-reactions-enabled="1" data-emit-metadata="0" data-input-position="bottom" data-theme="light" data-lang="zh-CN" crossorigin="anonymous" async> </script>
你可以在嵌入的页面中使用
.giscus
和 .giscus-frame
选择器来自定义容器布局。 > 本文由简悦 SimpRead 转码- Author:三百斤的窜天猴
- URL:https://esxdidi.com/article/1657787346136
- Copyright:All articles in this blog, except for special statements, adopt BY-NC-SA agreement. Please indicate the source!