Zum Inhalt springen
Bilder

Bilder

Drei Wege, ein Bild in einen Beitrag zu bringen — mit Credit und expliziter KI-Kennzeichnung.

Reines Markdown

Ein relativer Pfad wird zur Build-Zeit optimiert und bekommt Rahmen/Radius der Prose-Darstellung. Es trägt keinen Caption oder Credit, der Build warnt und weist auf <Figure> hin:

![Ein weicher Farbverlauf](./sample.jpg)

<Figure> — Caption, Credit, KI-Status

.mdx-Beiträge können Komponenten nutzen. Jede <Figure> verlangt credit (Rechteinhaber / Quelle) und ein ai-Flag; caption ist optional. ai={true} zeigt ein “AI”-Badge, ai={false} zeigt nichts zusätzlich. Mit wide läuft das Bild über die Lesespalte hinaus.

import Figure from "astro-blog-theme/components/Figure.astro";
import shot from "./shot.png";

<Figure
  src={shot}
  alt="…"
  caption="Was hier zu sehen ist."
  credit="© 2026 Dein Name"
  creditHref="https://example.com"
  ai={false}
/>
credit und ai sind Pflicht — der Build warnt, wenn eines von beiden fehlt. Mit imageCredits: false in den Integrationsoptionen lässt sich die Warnung für reines Markdown global abschalten.

Rohes <Image>

Für volle Kontrolle direkt astro:assets nutzen (kein Caption-/Credit-Feld):

<Image src={shot} alt="…" width={600} />

Hero-Bild-Credit

heroImage nimmt dieselben Metadaten über das Frontmatter entgegen: heroCaption, heroCredit, heroCreditHref und heroAi. Der Build warnt, wenn heroImage ohne heroCredit / heroAi gesetzt ist.

heroImage: ./hero.jpg
heroAlt: "…"
heroCredit: "© 2026 Dein Name"
heroAi: false