Giscus
category
tags
type
status
slug
summary
date
Last edited time
Jan 31, 2024 08:15 AM
icon
password
状态
天气
星期
日期
Giscus
项目会在您的Github项目讨论区创建评论数据,便于维护管理 ,
完成效果 预览
支持表情包评论
![notion image](https://www.notion.so/image/https%3A%2F%2Fs3-us-west-2.amazonaws.com%2Fsecure.notion-static.com%2F8adba253-3493-4f9c-a27e-144aac8f190a%2FUntitled.png?table=block&id=182489fc-4b49-4b41-9642-1a94277b711f&t=182489fc-4b49-4b41-9642-1a94277b711f&width=2060&cache=v2)
您可以在Github的Discusstion讨论区随时管理评论。
![notion image](https://www.notion.so/image/https%3A%2F%2Fs3-us-west-2.amazonaws.com%2Fsecure.notion-static.com%2Fd8b5513e-3937-4e55-92a7-c715b2c6cb59%2FUntitled.png?table=block&id=589a11a1-8d1d-4992-9768-135b9885480a&t=589a11a1-8d1d-4992-9768-135b9885480a&width=2622&cache=v2)
配置Giscus
分为4步骤,创建仓库、开启discussion、安转giscus插件、配置giscus插件。
2.在项目Setting中开启discussion功能
![notion image](https://www.notion.so/image/https%3A%2F%2Fs3-us-west-2.amazonaws.com%2Fsecure.notion-static.com%2F64cdb0bf-1f46-4c0b-a6aa-26968a38e86d%2FUntitled.png?table=block&id=12f72249-a3f3-4f04-8a33-6928c1be4134&t=12f72249-a3f3-4f04-8a33-6928c1be4134&width=2484&cache=v2)
滚动到下方,找到Discussions并开启它
![notion image](https://www.notion.so/image/https%3A%2F%2Fs3-us-west-2.amazonaws.com%2Fsecure.notion-static.com%2F70e32f25-1255-4bf5-9705-6c95f5d04034%2FUntitled.png?table=block&id=a13160ea-f850-4c41-98ef-c652d4953102&t=a13160ea-f850-4c41-98ef-c652d4953102&width=1922&cache=v2)
3.在Github中安装giscus应用
点击右上方的Install即可,并确认 允许访问仓库数据权限:
![notion image](https://www.notion.so/image/https%3A%2F%2Fs3-us-west-2.amazonaws.com%2Fsecure.notion-static.com%2Fb5db1cde-846b-47ff-a994-f2b37edae20a%2FUntitled.png?table=block&id=e981e0c4-1652-4d97-b081-27aa3bdbcdbf&t=e981e0c4-1652-4d97-b081-27aa3bdbcdbf&width=2046&cache=v2)
默认勾选All repositories即可。也可以只勾选用作评论的仓库,(后续还可以再回来配置)
![notion image](https://www.notion.so/image/https%3A%2F%2Fs3-us-west-2.amazonaws.com%2Fsecure.notion-static.com%2Fb39b65b6-9fc5-4f06-8b65-0f997df2490b%2FUntitled.png?table=block&id=0a23735f-c750-4b33-8baf-b83a3dc9f598&t=0a23735f-c750-4b33-8baf-b83a3dc9f598&width=1330&cache=v2)
4.访问Giscus填写并获取您的Giscus配置参数
Giscus配置参数
访问 以下giscus地址:
主要配置输入您的仓库名,并选择
Discussion
分类为 Announcements
.![notion image](https://www.notion.so/image/https%3A%2F%2Fs3-us-west-2.amazonaws.com%2Fsecure.notion-static.com%2Fcda69522-88fa-4bba-a597-f84a3c27bc4c%2FUntitled.png?table=block&id=1074ed51-b13b-4b48-ae76-2c4e61c76f06&t=1074ed51-b13b-4b48-ae76-2c4e61c76f06&width=480&cache=v2)
填写完成在页面下方可以 看到配置最重要的是
data-repo,data-repo-id
data-category-id
这三项。![notion image](https://www.notion.so/image/https%3A%2F%2Fs3-us-west-2.amazonaws.com%2Fsecure.notion-static.com%2F4af2fdc8-65ea-452e-87f0-154b1d850c40%2FUntitled.png?table=block&id=9d8c7d32-18f1-4252-9bd7-25d8a40c785b&t=9d8c7d32-18f1-4252-9bd7-25d8a40c785b&width=1564&cache=v2)
配置NotionNext
添加giscus环境变量即可
1. 在Vercel后台将上面获取的Giscus配置参数
添加到环境变量。
giscus的三项配置参数:
data-repo,data-repo-id
data-category-id
添加到Vercel后台环境变量的名字关系:giscus参数名 | vercel变量名 |
data-repo | NEXT_PUBLIC_COMMENT_GISCUS_REPO |
data-repo-id | NEXT_PUBLIC_COMMENT_GISCUS_REPO_ID |
data-category-id | NEXT_PUBLIC_COMMENT_GISCUS_CATEGORY_ID |
添加效果如下
![notion image](https://www.notion.so/image/https%3A%2F%2Fs3-us-west-2.amazonaws.com%2Fsecure.notion-static.com%2F310a69dc-8395-4698-b76f-ea1a5884e374%2FUntitled.png?table=block&id=fa4dd2f5-9e23-416e-8fbf-d10560c313d6&t=fa4dd2f5-9e23-416e-8fbf-d10560c313d6&width=1886&cache=v2)
2. 添加完环境变量记得Redploy
项目。
![notion image](https://www.notion.so/image/https%3A%2F%2Fs3-us-west-2.amazonaws.com%2Fsecure.notion-static.com%2F91a31209-906b-4ad1-92fd-22f21d8641e8%2FUntitled.png?table=block&id=a944c585-8aae-4c90-8917-c2b82eee1e2c&t=a944c585-8aae-4c90-8917-c2b82eee1e2c&width=2586&cache=v2)
Prev
Utterance
Next
Twikoo
Loading...