utterberg / utterberg

utterances の Codeberg 移植版。 Codeberg の Issue をコメントストアとして使う軽量ウィジェットです。

## 特徴

✅ バックエンド不要 — PKCE OAuth でブラウザのみで完結
✅ Client Secret 不要 — client_id だけで動作（公開しても安全）
✅ 第三者コメント対応 — Codebergアカウントがあれば誰でも投稿可能
✅ 高速表示 — LocalStorageキャッシュで2回目以降は即時表示
✅ utterancesと同じ使い方 — scriptタグ1行で埋め込み

## utterancesとの比較

	utterances	utterberg
ホスティング	GitHub	Codeberg（Forgejo）
OAuth	バックエンド必須	PKCE（ブラウザのみ）
Client Secret	必要	不要
埋め込み	`<script>` 1行	`<script>` 1行

## セットアップ

コメント用リポジトリを作成
Codebergに public リポジトリを作り、Issueを有効にします。
OAuth App を登録
Codeberg → Settings → Applications → OAuth2 Apps → Create
- Application Name: 任意（例: utterberg）
- Redirect URI: https://あなたのサーバー/utterberg.html
発行される Client ID をメモします（Client Secret は不要）。
トークンのスコープ（コメント投稿者に必要）
Codebergのトークン設定で read:user と write:issue が必要です。
OAuthフローでは自動的に write:issue スコープが要求されます。
ブログに埋め込む
以下の <script> タグを記事の末尾に追加します。

<script
  src="https://k-rebo.github.io/utterberg/client.js"
  repo="あなたのユーザー名/リポジトリ名"
  issue-term="pathname"
  client-id="あなたのClient ID"
  theme="github-light"
  crossorigin="anonymous"
  async
></script>

オプション：投稿元を制限
コメントリポジトリのルートに utterberg.json を置くと、許可するオリジンを制限できます。

{
  "origins": ["https://bido.dev"]
}

## デモ

このページ下部のコメント欄がutterbergです。

A port of utterances for Codeberg. A lightweight widget that uses Codeberg Issues as a comment store.

## features

✅ No backend required — PKCE OAuth, browser-only
✅ No client secret needed — only client_id required (safe to expose)
✅ Third-party comments — anyone with a Codeberg account can post
✅ Fast — instant on repeat visits via LocalStorage cache
✅ Same usage as utterances — embed with a single <script> tag

## comparison with utterances

	utterances	utterberg
Hosting	GitHub	Codeberg (Forgejo)
OAuth	Backend required	PKCE (browser-only)
Client Secret	Required	Not required
Embed	`<script>` 1 line	`<script>` 1 line

## setup

Create a comment repository
Create a public repository on Codeberg with Issues enabled.
Register an OAuth App
Codeberg → Settings → Applications → OAuth2 Apps → Create
- Application Name: anything (e.g. utterberg)
- Redirect URI: https://your-server/utterberg.html
Note the Client ID that is issued (Client Secret is not needed).
Token scopes (required for commenters)
read:user and write:issue scopes are required in Codeberg token settings.
The OAuth flow automatically requests the write:issue scope.
Embed in your blog
Add the following <script> tag to the end of your article.

<script
  src="https://k-rebo.github.io/utterberg/client.js"
  repo="your-username/repo-name"
  issue-term="pathname"
  client-id="your-client-id"
  theme="github-light"
  crossorigin="anonymous"
  async
></script>

Optional: Restrict allowed origins
Place utterberg.json at the root of your comment repository to restrict allowed origins.

{
  "origins": ["https://bido.dev"]
}

## demo

The comment section at the bottom of this page is powered by utterberg.

utterberg utterberg