{"id":13771001,"url":"https://github.com/sampsyo/emfed","last_synced_at":"2025-04-10T05:11:51.494Z","repository":{"id":66788069,"uuid":"572260387","full_name":"sampsyo/emfed","owner":"sampsyo","description":"embed your Mastodon feed into your web page","archived":false,"fork":false,"pushed_at":"2024-07-09T00:44:55.000Z","size":157,"stargazers_count":86,"open_issues_count":1,"forks_count":6,"subscribers_count":5,"default_branch":"main","last_synced_at":"2025-04-10T05:11:45.191Z","etag":null,"topics":["embed","fediverse","mastodon"],"latest_commit_sha":null,"homepage":"","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"unlicense","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/sampsyo.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null}},"created_at":"2022-11-29T22:17:45.000Z","updated_at":"2025-04-03T09:08:13.000Z","dependencies_parsed_at":"2024-04-13T07:42:56.902Z","dependency_job_id":"96ab14c0-179a-4ab1-ab67-2272ffb40f9d","html_url":"https://github.com/sampsyo/emfed","commit_stats":{"total_commits":86,"total_committers":4,"mean_commits":21.5,"dds":"0.046511627906976716","last_synced_commit":"0de4f1e809a2678bc0b60ec155e4f58c93a31bd1"},"previous_names":[],"tags_count":7,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/sampsyo%2Femfed","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/sampsyo%2Femfed/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/sampsyo%2Femfed/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/sampsyo%2Femfed/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/sampsyo","download_url":"https://codeload.github.com/sampsyo/emfed/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248161276,"owners_count":21057555,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["embed","fediverse","mastodon"],"created_at":"2024-08-03T17:00:46.198Z","updated_at":"2025-04-10T05:11:51.471Z","avatar_url":"https://github.com/sampsyo.png","language":"TypeScript","readme":"Emfed: Simple Client-Side Mastodon Feed Embedding\n=================================================\n\nTwitter used to have a really convenient way to embed a feed into your website, but now Twitter is dead.\nEmfed is a simple replacement for [Mastodon][] that works entirely in the browser, without a server-side component (beyond your favorite Mastodon instance itself).\n\nTo use it, put a special link like this where you want the feed to appear:\n\n    \u003ca class=\"mastodon-feed\"\n       href=\"https://mastodon.social/@Mastodon\"\n       data-toot-limit=\"4\"\n       \u003efollow me into the Fediverse\u003c/a\u003e\n\nThen include the JavaScript (probably at the end of your `\u003cbody\u003e`):\n\n    \u003cscript type=\"module\" src=\"https://esm.sh/emfed@1\"\u003e\u003c/script\u003e\n\nEmfed generates some pretty basic markup for the feed.\nYou probably want to style it to look like a proper social media feed, which you can do with plain ol' CSS scoped to the `.toots` selector, or you can use its provided CSS (in your `\u003chead\u003e`):\n\n    \u003clink rel=\"stylesheet\" type=\"text/css\"\n          href=\"https://esm.sh/emfed@1/toots.css\"\u003e\n\nYou can customize the feed with `data-` attributes:\n\n* `data-toot-limit`: The maximum number of toots to display.\n* `data-toot-account-id`: Emfed needs to make an extra API request to translate your human-readable username (like `@Mastodon`) into an internal ID (like 13179) before it can look up your toots. If you have [empathy for the machine][eftm], you can make everything faster by specifying the ID directly here.\n* `data-exclude-replies`: \"true\" or \"false\" according to whether or not you'd like to exclude replies. The default behavior is that replies are included.\n* `data-exclude-reblogs`: \"true\" or \"false\" according to whether or not you'd like to exclude reblogs/boosts. The default behavior is that reblogs/boosts are included.\n\nEmfed sanitizes the HTML contents of toots using [DOMPurify][] to avoid malicious markup and XSS attacks.\n\n[mastodon]: https://joinmastodon.org\n[eftm]: https://atp.fm/115\n[DOMPurify]: https://github.com/cure53/DOMPurify\n\nEmbed a Post and Its Replies\n----------------------------\n\nYou can also embed an individual post, the replies to a post, or both.\nThis mode lets you use Fediverse replies as a comment system for static sites, inspired by [a blog post from Carl Schwan][reply-post].\n\nUse this to embed a post along with its responses:\n\n    \u003ca class=\"mastodon-thread\"\n       href=\"https://mastodon.social/@Mastodon\"\n       data-toot-id=\"112011697087209298\"\n       \u003eThread from the Fediverse\u003c/a\u003e\n\nBy default, both the original post and the replies appear.\nYou can customize this link with `data-` attributes:\n\n* `data-exclude-replies`: Set to `true` to exclude the replies.\n* `data-exclude-post`: Set to `true` to exclude the post, leaving just the replies. This may be more appropriate for the blog-comments use case [mentioned above][reply-post].\n\nThis mode uses the same style of markup as the user feed, so you can use the same CSS to provide style for these embedded posts.\n\n[reply-post]: https://carlschwan.eu/2020/12/29/adding-comments-to-your-static-blog-with-mastodon/\n\nHacking\n-------\n\nType `make dev` to serve an example page.\n\nSome missing features you might be interested in contributing include rendering media beyond static images (GIFs, videos, and audio), using a [BlurHash][] placeholder before media has loaded, and optionally filtering out replies or boosts.\n\n[BlurHash]: https://blurha.sh/\n\nAlternatives\n------------\n\n* [Mastofeed](https://www.mastofeed.com): A server-side iframe-embeddable feed generator.\n* [Fedifeed](https://fedifeed.com): Like Mastofeed, but for other ActivityPub software too.\n* [Mastodon embed timeline from idotj](https://gitlab.com/idotj/mastodon-embed-timeline): Also client-side. I wanted something with secure HTML embedding, automatic username lookup, and simpler URL-based configuration.\n\nChangelog\n---------\n\n* v1.6.0: A new `data-exclude-reblogs` config option for hiding boosts.\n* v1.5.0: Add a mode to embed a single post and its replies.\n* v1.4.2: Switch to a more \"normal\" build process.\n* v1.4.1: Fix npm publication.\n* v1.4.0: Split into multiple submodules, which also lets you avoid automatic transformation.\n* v1.3.0: Drop the dependency on [Mustache][]. Fix a bug where, on some browsers, the `data-*` attributes would not work (so we'd always use the default configuration).\n* v1.2.0: Display image attachments.\n* v1.1.0: Display boosts (reblogs) correctly.\n* v1.0.1: Fix an incorrect URL when `data-toot-account-id` is not provided.\n* v1.0.0: Initial release.\n\n[mustache]: https://github.com/janl/mustache.js/\n\nAuthor\n------\n\nEmfed is by [Adrian Sampson][adrian].\nIt is dedicated to the public domain under the terms of [the Unlicense][unl].\n\n[adrian]: https://www.cs.cornell.edu/~asampson/\n[unl]: https://unlicense.org\n","funding_links":[],"categories":["Tools"],"sub_categories":["Webpage"],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsampsyo%2Femfed","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fsampsyo%2Femfed","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsampsyo%2Femfed/lists"}