Metadaten

Die Head-Tags, die jede Seite rendert — Titel, Beschreibung, Canonical, Open Graph und X-Card-Tags — und wie du sie pro Seite über das Frontmatter überschreibst.

Jede Seite rendert die üblichen <head>-Tags aus deiner Konfiguration und dem Frontmatter — ganz ohne Konfigurationsaufwand. Wo sich ein Wert anpassen lässt, findest du ihn unter dem Schlüssel seo in blume.config.ts oder unter seo im Frontmatter einer Seite.

• <title> — der Seitentitel plus dein Website-title.
• <meta name="description"> und og:description — die description der Seite, ersatzweise die description der Website.
• og:title und og:site_name — der Seitentitel und dein Website-title.
• <link rel="canonical"> und og:url — die absolute URL der Seite (sofern deployment.site gesetzt ist).
• og:type — article bei Blogbeiträgen und Changelog-Einträgen, website überall sonst. Artikelseiten geben außerdem article:published_time und article:modified_time aus dem date der Seite und dem Zeitstempel der letzten Änderung aus.
• og:image — das OG-Bild für die Seite. Eine generierte Card deklariert zusätzlich ihre og:image:width, og:image:height, og:image:type und og:image:alt, damit ein Crawler die Card layouten kann, ohne sie vorher abzurufen; ein seo.image, das du selbst angibst, deklariert nichts davon, da Größe und Format unbekannt sind.
• twitter:card, twitter:title, twitter:description, twitter:image — die X-Card. Seiten mit Bild bekommen die breite Variante summary_large_image; Seiten ohne Bild bekommen weiterhin die kompakte summary-Card, statt als nackter Link dargestellt zu werden.

X-Attribution

X liest alles Weitere auf der Card aus den og:*-Tags, die einzigen Werte, die es nicht ableiten kann, sind also die Accounts, die genannt werden sollen. Setze sie unter seo.x, und Blume gibt twitter:site (der Account deiner Website) und twitter:creator (der des Autors) aus. Das @ ist optional — acme und @acme funktionieren beide.

seo: {
  x: { handle: "@acme", creator: "@jane" },
}

Eine Seite kann ihren eigenen Autor angeben — genau das, was du für einen Gastbeitrag brauchst:

---
title: How we shipped it
seo:
  x:
    creator: "@guestauthor"
---

Eigene Tags

Für alles, wofür Blume keine Einstellung bietet, fügst du Tags unter seo.metatags hinzu, und jede Seite übernimmt sie — eigene Seiten und API-Referenzen eingeschlossen. Das eignet sich für Tokens zur Website-Verifizierung von Google, Bing oder Facebook, eine theme-color oder ein App-Banner:

seo: {
  metatags: {
    "google-site-verification": "abc123",
    "msvalidate.01": "def456",
    "theme-color": "#0b5fff",
    "apple-itunes-app": "app-id=123456789",
  },
}

Jeder Schlüssel ist der Name des Tags und jeder Wert sein Inhalt. Open-Graph-Familien (og:, fb:, article: und die übrigen) werden mit property gerendert, so wie das Protokoll sie benennt, alles andere mit name. Die Tags, die Blume selbst schreibt und die oben auf dieser Seite aufgelistet sind, kannst du hier nicht setzen, damit eine Seite nie zwei Werte für ein Tag enthält. Der Build nennt dir jeweils die zuständige Einstellung: og:image kommt aus seo.og oder dem seo.image einer Seite, robots aus dem seo.noindex einer Seite.

Überschreibungen pro Seite

Überschreibe jedes der anderen Tags pro Seite mit seo-Frontmatter:

---
title: Pricing
description: Plans and pricing for every team size.
seo:
  title: Plans and pricing
  canonical: https://acme.com/pricing
  noindex: false
---

Eine noindex-Seite fällt außerdem aus der Sitemap heraus und überspringt strukturierte Daten.