Easily embed Mastodon posts into your Astro blog posts.
.md
, .mdx
and .astro
filesInstall the package:
pnpm add astro-mastodon
Update your astro.config.mjs
file:
// Other imports
import { remarkMastodonEmbed } from "astro-mastodon";
export default defineConfig({
// ...
markdown: {
remarkPlugins: [
remarkMastodonEmbed,
// other plugins
],
},
// ...
});
Add import "astro-mastodon/dist/output.css"
at the top of your post template file (e.g. src/pages/blog/[slug]/index.astro
)
In your markdown file, add post "mention":
---
title: Embeds FTW!
---
This is an example of an embedded Mastodon post:
`@[email protected]:109860863149734322`
The anatomy of the embed is as follows:
@[email protected]:postId
Clone the repo and run
pnpm i
pnpm dev
Open http://localhost:4321
and have fun!