External Links

Updated Apr 28, 2026

The links array attaches external URLs to the header or the sidebar. Each entry renders as a link with an optional icon.

Basic usage

livemark.config.ts
import { defineConfig } from "livemark"

export default defineConfig({
  include: "docs/**/*.md",
  links: [
    {
      url: "https://github.com/acme/docs",
      title: "GitHub",
      icon: "github",
    },
  ],
})

Fields

FieldTypeDefaultPurpose
urlstringExternal URL.
titlestringVisible label.
iconstringLucide icon name (e.g. github, twitter, mail).
prefixstringSection path prefix; if set, the link only shows in that section.
position"header" | "sidebar""header"Where the link renders.

Icons come from lucide-react. Use the kebab-case name.

By default, links render to the right of the section tabs in the header. An external icon is appended automatically.

links: [
  { url: "https://github.com/acme/docs", title: "GitHub", icon: "github" },
  { url: "https://twitter.com/acme", title: "Twitter", icon: "twitter" },
]

Set position: "sidebar" to render inside the left sidebar, below the sections tree.

links: [
  {
    url: "https://github.com/acme/docs/edit/main",
    title: "Edit on GitHub",
    icon: "pencil",
    position: "sidebar",
  },
]

Use prefix to show a link only when a specific section is active. This is useful for per-section "Edit on GitHub" or "Report issue" shortcuts.

links: [
  {
    url: "https://github.com/acme/docs/edit/main/blog",
    title: "Edit on GitHub",
    icon: "pencil",
    prefix: "/blog/",
    position: "sidebar",
  },
]

See also

  • Article Sections — the prefix values that prefix on a link targets.
  • Site Metadata — the brand title and logo that sit next to header links.

Built with and Livemark