Skip to content

feat: add Mastodon/Fediverse comments via mastodon-comments web component#1033

Open
claytonlin1110 wants to merge 3 commits intodillonzq:masterfrom
claytonlin1110:feat/mastodon-comments-integration
Open

feat: add Mastodon/Fediverse comments via mastodon-comments web component#1033
claytonlin1110 wants to merge 3 commits intodillonzq:masterfrom
claytonlin1110:feat/mastodon-comments-integration

Conversation

@claytonlin1110
Copy link
Copy Markdown

Summary

Adds Mastodon/Fediverse as an optional comment system using the mastodon-comments web component, so posts can show replies from a linked Mastodon toot.

Closes #981

Changes

  • Config: New [params.page.comment.mastodon] with enable, host, and user in hugo.toml and exampleSite/hugo.toml.
  • Comment partial: New Mastodon block in layouts/_partials/comment.html that only renders when Mastodon is enabled and the page has fediverse or mastodonTootId in front matter. Injects DOMPurify and mastodon-comments.js from CDN and outputs with the toot ID.
  • Styles: Mastodon comment layout and component CSS variables in assets/css/_partial/_single/_comment.scss.
  • i18n: New strings for noscript message, prompt text, and “post” link in i18n/en.toml and i18n/zh-CN.toml.
  • Archetype: Comment in archetypes/default.md for optional fediverse / mastodonTootId front matter.

Usage

  • Enable and set host and user under params.page.comment.mastodon.
  • In each post that should have Fediverse comments, set fediverse (or mastodonTootId) in front matter to the toot ID for that post’s thread.

@netlify
Copy link
Copy Markdown

netlify bot commented Mar 11, 2026

Deploy Preview for hugo-loveit ready!

Name Link
🔨 Latest commit 4698330
🔍 Latest deploy log https://app.netlify.com/projects/hugo-loveit/deploys/69b3f54848640b0008313fd6
😎 Deploy Preview https://deploy-preview-1033--hugo-loveit.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.
Lighthouse
Lighthouse
1 paths audited
Performance: 99
Accessibility: 98
Best Practices: 100
SEO: 82
PWA: 78
View the detailed breakdown and full score reports

To edit notification comments on pull requests, go to your Netlify project configuration.

@claytonlin1110
Copy link
Copy Markdown
Author

@dillonzq Please review

@claytonlin1110
Copy link
Copy Markdown
Author

@dillonzq Had a chance to review?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[FEATURE] integrate mastodon comments webcomponent

1 participant