---
title: "Content-Modell und Medien"
description: "Wie eine Website Inhalte und Layout trennt, woran Editor, API und Agenten ihre Änderungen prüfen und wie Medien funktionieren."
canonical: "https://atelier201.com/docs/de/platform/content-model"
updated: "2026-11-06"
---

# Content-Modell und Medien

Jede Website ist ein Astro-Projekt. Änderungen des Inhabers werden in typisierten
Content-Dateien gespeichert, das Layout bleibt im Code. Eine Seite liest die
Inhalte aus und setzt sie ins Layout. Den Firmennamen, einen Preis oder
Öffnungszeiten enthält sie selbst nie.

Das **Content-Modell** ist die Liste der Content-Typen und ihrer Felder. Es wird
an einer Stelle in `src/content.config.ts` des Projekts definiert (mit einem
Zod-Schema pro Typ). Bei jedem Build wird es als JSON Schemas exportiert. Der
Editor, die REST API, MCP und die CLI prüfen jede Änderung anhand dieses Modells.
Ein Wert, der nicht zum Schema passt, wird mit Angabe des Feldnamens abgelehnt;
geschrieben wird nichts.

Das Modell stammt aus dem letzten Build. Führe einmal einen neuen Build aus,
bevor du das Content-Modell ausliest.

## Collections und Singletons

Eine **Collection** enthält mehrere Einträge, jeweils in einer eigenen Datei.
Der Dateiname ist der Slug des Eintrags: Kleinbuchstaben, Ziffern und
Bindestriche. Ein **Singleton** ist ein einzelnes JSON-Dokument an einem festen
Pfad.

Das Atelier201-Starterprojekt enthält folgende Beispiele:

| Name           | Typ                  | Inhalt                                                                                                                                                                             |
| -------------- | -------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| `business`     | Singleton            | Name, Claim, Beschreibung, Telefonnummer, E-Mail-Adresse, Adresse, Öffnungszeiten, Social-Media-Links, rechtliche Angaben, Buchungs- und Kartenlinks sowie die Sprache der Website |
| `theme`        | Singleton            | Vier Markenfarben, Eckenradius, Schriftartenpaar und heller, dunkler oder automatischer Modus                                                                                      |
| `navigation`   | Singleton            | Links im Header und Footer sowie der Call-to-Action-Button                                                                                                                         |
| `integrations` | Singleton            | Google-Analytics-ID, Plausible-Domain und Code, der im Head oder am Ende des Bodys eingefügt wird                                                                                  |
| `services`     | Collection, JSON     | Leistungen mit Name, Beschreibung, Preis, Reihenfolge und Bild                                                                                                                     |
| `blog`         | Collection, Markdown | Beiträge mit Titel, Beschreibung, Datum, Autor, Titelbild, Tags, den zugehörigen Leistungen (eine Relation zu `services` über den Slug) und einem Entwurfsstatus                   |

Das Starterprojekt ist ein Grundgerüst: Es enthält diese beiden Collections als
Beispiele und gibt nicht vor, wie ein Unternehmen aussehen soll. Eine Website
kann nicht benötigte Collections löschen und eigene hinzufügen, etwa für ein
Team, eine Speisekarte oder Veranstaltungen.

Eine **Content-Collection** besteht aus Markdown: Feldern im Frontmatter und
einem Textkörper. Eine **Daten-Collection** besteht aus JSON ohne Textkörper.

Ein neuer Eintrag, der über die API oder MCP erstellt wird, ist zunächst ein
Entwurf, wenn seine Collection ein Entwurfsfeld enthält. So kann eine Person
entscheiden, ob sie ihn veröffentlichen möchte.

## Inhalte ändern, ohne das Layout zu beschädigen

Für Texte, Einträge und Unternehmensangaben solltest du die Content-Aufrufe
verwenden, nicht Dateien direkt bearbeiten:

| Aufgabe               | REST                                                                 | MCP                 | CLI                        |
| --------------------- | -------------------------------------------------------------------- | ------------------- | -------------------------- |
| Modell auslesen       | [Content-Modell auslesen](/docs/api/content/model)                   | `get_content_model` | `atelier201 content model` |
| Eintrag schreiben     | [Eintrag erstellen oder aktualisieren](/docs/api/content/save-entry) | `save_entry`        | `atelier201 content save`  |
| Einzelnen Text ändern | [Einzelnes Feld ändern](/docs/api/content/set-field)                 | `set_field`         | `atelier201 content set`   |

Verwende Datei-Aufrufe nur, um Code zu ändern: ein Layout, eine Komponente
oder das Content-Modell selbst. Um ein Feld hinzuzufügen, ergänze es in
`src/content.config.ts` mit `.default()` oder `.optional()`, damit bestehende
Einträge gültig bleiben.

## Inline-Bearbeitung: `data-atelier201-field`

Der Inhaber klickt auf der Seite auf einen kurzen Text und bearbeitet ihn direkt
an Ort und Stelle. Das funktioniert, weil der Text die Adresse des Feldes
enthält, aus dem er stammt:

```html
<h1 data-atelier201-field="business:/name">Morning Crumb Bakery</h1>
<time data-atelier201-field="business:/hours/2/close">15:00</time>
```

Die Adresse hat das Format `<singleton>:<JSON pointer>`: `business`, `theme`
oder `navigation`, gefolgt von einem Doppelpunkt und einem [RFC 6901](https://www.rfc-editor.org/rfc/rfc6901)-Pointer
in die Datei dieses Singletons. Dieselbe Adresse funktioniert mit `set_field`
und `atelier201 content set`.

Beachte beim Bearbeiten einer Komponente folgende Regeln:

- Setze das Attribut auf ein Element, dessen gesamter Text genau diesem Feld
  entspricht und das sonst nichts enthält. Atelier201 ersetzt den Text des
  Elements. Bei „Ruf uns an: 555 0100“ sollte nur die Nummer in einem `span`
  stehen.
- Verschiebe das Attribut mit dem Element, wenn du dessen Stil änderst, und
  füge es überall dort hinzu, wo du ein Singleton-Feld an einer neuen Stelle
  anzeigst.
- Verwende es nicht für Text, der aus mehreren Feldern zusammengesetzt ist,
  umgewandelten Text (etwa ein formatiertes Datum), Markdown-Textkörper oder
  Collection-Einträge. Ein Eintrag auf einer Seite erhält stattdessen auf seinem
  Container `data-atelier201-entry="<collection>/<slug>"`.

## Die Website bleibt statisch

Eine für Atelier201 erstellte Website ist eine statische Astro-Website: ohne
Serveradapter, serverseitiges Rendering, clientseitiges Framework oder Anfragen
an andere Origins zur Laufzeit (einschließlich Schriftarten, Analytics-Tags und
eingebetteter Karten). Sie verwendet eine Sprache, die in `business.locale`
festgelegt ist. Ihre Abhängigkeiten sind `astro` und `@astrojs/mdx` (standardmäßig
deaktiviert, bis `mdx()` zur Konfiguration hinzugefügt wird), da der Build ohne
Netzwerkzugriff ausgeführt wird. Die `AGENTS.md` des Starterprojekts führt diese
Regeln für Agenten auf, die den Code bearbeiten.

## Medien

Lade ein Bild, ein PDF oder ein kurzes Video auf die Website hoch und verweise
anschließend im Content darauf mit `/media/<filename>`, zum Beispiel im Feld
`coverImage` eines Blogbeitrags.

- Jede Datei darf 20 MB groß sein. Bei Uploads über MCP werden Dateien in
  Base64 codiert und sind auf 5 MB begrenzt.
- Gib Bildern einen `alt`-Text für Menschen, die sie nicht sehen können.
- Medien werden auf den Speicherplatz des Plans angerechnet: 100 MB bei einem
  Entwurf und 5 GB bei einer Site.
- Hochgeladene Dateien werden ab dem nächsten Build eingebunden. Beim Löschen
  werden sie aus späteren Builds entfernt. Bereits veröffentlichte Builds
  enthalten weiterhin ihre Kopie, bis eine neuere Veröffentlichung sie ersetzt.
