Satteri Links

💬 satteri-link-mention

satteri-link-mention converts an empty HTTP or HTTPS Markdown link into an inline mention while Markdown is processed.

Experimental: The API, generated HTML, CSS class names, and behavior may change incompatibly between releases.

👩‍🚀 Astro setup

Sätteri is the default Markdown and MDX pipeline in Astro 7. Configure the plugin through @astrojs/markdown-satteri in astro.config.mjs:

import { satteri } from "@astrojs/markdown-satteri";
import { defineConfig } from "astro/config";
import { satteriLinkMention } from "satteri-link-mention";

export default defineConfig({
  markdown: {
    processor: satteri({
      hastPlugins: [satteriLinkMention()],
    }),
  },
});

🎨 Styling this demo

The plugin emits class names but does not inject CSS. This page uses the optional preset shipped with the package:

import "satteri-link-mention/preset.css";

The preset can be omitted and replaced with site-specific CSS.

✅ Default mention

The empty link supplies the URL. The default output shows the favicon, site name, and title when each value is available.

Example

This repository is [](https://github.com/ItoShimeji/satteri-links).

Output

This repository is GitHubGitHub - itoshimeji/satteri-links: Link-related plugins for Sätteri..

⚙️ Change the part order

Use mention.order to control the order of the enabled parts.

Config

satteriLinkMention({
  mention: {
    order: ["siteName", "title", "favicon"],
  },
});

Output

This repository is GitHubGitHub - itoshimeji/satteri-links: Link-related plugins for Sätteri..

⚙️ Hide the favicon

Set mention.favicon to false.

Config

satteriLinkMention({
  mention: {
    favicon: false,
  },
});

Output

Sätteri is AstroAstro 6.4 | Astro.

⚙️ Show only the title

Each mention part can be enabled independently.

Config

satteriLinkMention({
  mention: {
    favicon: false,
    siteName: false,
    title: true,
  },
});

Output

Astro is Astro 6.4 | Astro.

✅ Mentions in nested content

Unlike link cards, mentions are not limited to root-level paragraphs. An empty link can be used in a list item or other inline content.

Example

- [](https://github.com/ItoShimeji/satteri-links)

Output

❌ Links that are not converted

Links with authored text and bare URLs are not empty-link placeholders. They stay unchanged.

Example

Read the [Sätteri documentation](https://satteri.bruits.org/).

https://astro.build/

Output

Read the Sätteri documentation.

https://astro.build/

💾 Caching

Metadata is cached under .cache/satteri-link-mention by default. Favicons remain remote by default. Configure both caches in the plugin definition:

satteriLinkMention({
  metadataCache: {
    directory: ".cache/link-mentions",
    maxAge: 30 * 24 * 60 * 60 * 1000,
  },
  imageCache: {
    maxImageBytes: 5 * 1024 * 1024,
    store: createFileSystemImageCacheStore({
      directory: "public/link-mentions",
      publicPath: "/link-mentions",
    }),
  },
});

Set metadataCache: false to disable metadata caching. Set imageCache: true to use the default filesystem store, or provide a custom ImageCacheStore for another backend.

⚠️ Limitations

Metadata and image requests run in the build environment. Requests to private or local network addresses are not currently blocked. Use the plugin with trusted Markdown.

Missing favicon and site-name values are omitted. If metadata cannot be resolved, the empty link is left unchanged.