- Fresh structure: Next.js App Router + Tailwind v4 at the repo root, exported as static files (output: export) and served by static-web-server - Remove the Strapi CMS, Astro app, Pagefind search, comments, old scripts, Lighthouse config and compose files; content in content/ is now plain markdown with YAML frontmatter - Pages: About, Writing, Reading (3D bookshelf) and Portfolio, styled after adammaj.com - SEO: metadata and canonicals, JSON-LD, generated OG images, sitemap, robots, RSS and JSON feeds, llms.txt - Umami via PUBLIC_UMAMI_SCRIPT_URL / PUBLIC_UMAMI_WEBSITE_ID (build args) - Dockerfile builds the export and serves it with sws.toml (security headers, clean URLs, .well-known, OG image content type, immutable asset caching) - Prettier and cspell for content with a husky/lint-staged pre-commit hook - Old redirect list dropped to start from a clean slate
2.6 KiB
title, description, date, tags
| title | description | date | tags | ||
|---|---|---|---|---|---|
| What say you? | Adding a comment system by utterances | 2023-08-24 |
|
Free speech enhanced
There is no point in writing online if your readers cannot provide feedback for your writings. You might as well be shouting at a void. My ideal commenting system has to be free, open source and should not be a hassle to setup. Luckily, utterances 🔮 checks all of these conditions
It is a lightweight comments widget built on GitHub issues. Use GitHub issues for blog comments, wiki pages and more! The notable features are:
- Open source. 🙌
- No tracking, no ads, always free. 📡🚫
- No lock-in. All data stored in GitHub issues. 🔓
- Styled with Primer, the css toolkit that powers GitHub. 💅
- Dark theme. 🌘
- Lightweight. Vanilla TypeScript. No font downloads, JavaScript frameworks or polyfills for evergreen browsers. 🐦🌲
How it works
When Utterances loads, the GitHub issue search API is used to find the issue associated with the page based on url, pathname or title. If it cannot find an issue that matches the page, utterances-bot will automatically create an issue the first time someone comments.
To comment, users must authorize the utterances app to post on their behalf using the GitHub OAuth flow. Alternatively, users can comment on the GitHub issue directly.
Setting up Utterances
Repository
Choose the repository utterances will connect to.
Make sure the repo is public, otherwise your readers will not be able to view the issues/comments. Make sure the utterances app is installed on the repo, otherwise users will not be able to post comments. If your repo is a fork, navigate to its settings tab and confirm the issues feature is turned on.
repo:
username/repo
A public GitHub repository. This is where the blog post issues and issue-comments will be posted.
Theme
Choose an Utterances theme that matches your blog.
Enable Utterances
Add the following script tag to your blog's template. Position it where you want the comments to appear. Customize the layout using the .utterances and .utterances-frame selectors.
<script
src="https://utteranc.es/client.js"
repo="[ENTER REPO HERE]"
issue-term="title"
theme="gruvbox-dark"
crossorigin="anonymous"
async
></script>
The complete documentation can be found at https://utteranc.es