Vista previa técnicaDanos tu opinión

Enlaces externos

Actualizado el 12 nov 2026

El array links añade URL externas a la cabecera o a la barra lateral. Cada entrada se renderiza como un enlace con un icono opcional.

Uso básico

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

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

Campos

CampoTipoPor defectoPropósito
urlstring—URL externa.
titlestring—Etiqueta visible.
iconstring—Nombre de icono de Lucide (p. ej. github, twitter, mail).
prefixstring—Prefijo de ruta de una sección; si se define, el enlace solo aparece en ella.
position"header" | "sidebar""header"Dónde se renderiza el enlace.

Los iconos vienen de lucide-react. Usa el nombre en kebab-case.

Por defecto, los enlaces se renderizan a la derecha de las pestañas de sección en la cabecera. Solo se muestra el icon que definas: Livemark no añade ningún indicador propio de enlace externo.

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

Define position: "sidebar" para renderizarlo dentro de la barra lateral izquierda, debajo del árbol de secciones.

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

Usa prefix para mostrar un enlace solo cuando una sección concreta está activa. Es útil para accesos directos por sección como "Editar en GitHub" o "Informar de un problema".

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

Ver también

Hecho con ❤ y Livemark