{
  "$type": "site.standard.document",
  "bskyPostRef": {
    "cid": "bafyreiceb5an3ewbx6ousss3wanhtvng3jnzimb2dvoksalyb2rjcb2rom",
    "uri": "at://did:plc:jvtquacwpds4pvrhh2k4l3ft/app.bsky.feed.post/3miwmukrhu6o2"
  },
  "coverImage": {
    "$type": "blob",
    "ref": {
      "$link": "bafkreig4tezxydaplwn74bqrwioeen6ck2qm57dlili47vrwmkdclubwce"
    },
    "mimeType": "image/jpeg",
    "size": 271283
  },
  "path": "/blog/i-built-an-eleventy-plugin-for-sharing-posts-to-mastodon/",
  "publishedAt": "2026-04-07T20:34:17.174Z",
  "site": "https://www.kylereddoch.me",
  "tags": [
    "GitHub",
    "live demo",
    "GitHub Repository",
    "Live Demo",
    "npm Package",
    "@kylereddoch"
  ],
  "textContent": "I am happy to share a new open source project I have been working on: `@kylereddoch/eleventy-plugin-mastodon-share`.\n\nYou can browse the source on GitHub and try the live demo.\n\nIt is a small Eleventy plugin that makes it easier for people to share posts from your site to Mastodon.\n\nIf you have ever tried to add Mastodon sharing to a website, you already know the awkward part: there is no single universal destination the way there is with some other social platforms. People need to post through their own Mastodon instance, which means a simple “share this post” button is usually not enough.\n\nThat is the problem I wanted to solve.\n\n## What This Plugin Does\n\nThis plugin adds a Mastodon share button to an Eleventy site, along with a small instance picker that helps visitors choose where they want to post.\n\nIt includes:\n\n  * a main “Share on Mastodon” button\n  * a prompt for entering a custom Mastodon instance\n  * a list of popular instances to choose from\n  * the ability to save a preferred instance for future shares\n  * shortcode helpers so Eleventy users do not have to hand-build all of the markup and logic themselves\n\n\n\nThe goal was to make this feel easy for both sides:\n\n  * easy for site owners to install and use\n  * easy for readers to actually share something without confusion\n\n\n\n## Why I Built It\n\nI wanted a Mastodon sharing experience that fit naturally into Eleventy.\n\nThere are plenty of ways to build your own share button, but once you start dealing with instance selection, remembering preferences, progressive enhancement, and reusable templates, it becomes more work than it should be.\n\nI wanted something I could drop into an Eleventy site and feel good about sharing with the broader community too.\n\n## How It Works\n\nOnce the plugin is added to an Eleventy project, you can load its assets in your layout and render the share UI with a shortcode.\n\nFor a basic post layout, it can look like this:\n\n\n    {% mastodonSharePost title=title, description=description, hashtags=mastodon_hashtags %}\n\nThe plugin can build the share text from your page data, include the page URL, and pass hashtags through to Mastodon.\n\nFor people visiting your site:\n\n  1. If they already saved an instance, the button opens that instance directly.\n  2. If they have not saved one yet, they can enter their own instance.\n  3. They can also choose from a list of popular instances and save one for next time.\n\n\n\nThat means the share flow is much smoother than dropping people onto a generic page and expecting them to figure everything out on their own.\n\n## Built for Eleventy\n\nOne thing that mattered to me with this project was making it feel like an Eleventy plugin, not just a chunk of copied template code.\n\nIt supports:\n\n  * Nunjucks\n  * Liquid\n  * Eleventy JavaScript templates\n\n\n\nIt also includes helper shortcodes for:\n\n  * rendering the share UI\n  * rendering the stylesheet\n  * rendering the script\n  * rendering both assets together\n\n\n\nSo instead of rebuilding the same pattern in each project, users can install the plugin and get going much faster.\n\n## A Few Things I Wanted to Get Right\n\nI wanted this to be practical, lightweight, and approachable.\n\nSo the plugin is designed around a few simple ideas:\n\n  * it should work well with regular Eleventy projects\n  * it should not require a heavy setup\n  * it should offer sensible defaults\n  * it should still be customizable if someone wants to adapt it to their site\n  * it should help readers share to Mastodon in a way that makes sense\n\n\n\nIt also uses progressive enhancement, so the experience still has a fallback even if JavaScript is unavailable.\n\n## Who This Is For\n\nThis plugin is for Eleventy users who:\n\n  * publish blog posts or articles\n  * want to encourage sharing on Mastodon\n  * do not want to reimplement instance selection from scratch\n  * want a reusable solution they can drop into layouts and templates\n\n\n\nIf you write on the open web and care about the fediverse, I hope this makes your site a little more helpful to your readers.\n\n## Getting Started\n\nInstall the package:\n\n\n    npm install @kylereddoch/eleventy-plugin-mastodon-share\n\nRegister it in your Eleventy config:\n\n\n    import mastodonShare from \"@kylereddoch/eleventy-plugin-mastodon-share\"; export default function (eleventyConfig) { eleventyConfig.addPlugin(mastodonShare, { siteUrl: \"https://example.com\", emitStylesheetLink: false, }); }\n\nThen load the assets in your layout:\n\n\n    {% mastodonShareAssets %}\n\nAnd render the share UI where you want it:\n\n\n    {% mastodonSharePost title=title, description=description, hashtags=mastodon_hashtags %}\n\nIf you want more control, the plugin also supports a lower-level shortcode for custom share text and additional configuration options.\n\n## Open Source and Community\n\nThis project is open source, and I built it with the Eleventy community in mind.\n\nI want it to be genuinely useful, easy to understand, and easy to improve over time.\n\nIf you try it and have ideas, feedback, bug reports, or suggestions, I would love to hear from you.\n\n## Links\n\n  * GitHub Repository\n  * Live Demo\n  * npm Package\n\n\n\n## Final Thoughts\n\nI love small tools that solve specific problems well, especially when they help make the open web a little easier to use.\n\nThat is what I hope this plugin does.\n\nIf you use Eleventy and want a cleaner Mastodon sharing experience on your site, I hope `eleventy-plugin-mastodon-share` is helpful.",
  "title": "I Built an Eleventy Plugin for Sharing Posts to Mastodon",
  "updatedAt": "2026-04-07T18:00:00.000Z"
}