Medienbibliothek

Die Medienbibliothek speichert wiederverwendbare Bilder, Dokumente, Videos und Audio. Redakteure können Dateien einmal hochladen, sie aus Inhaltsfeldern und Portable Text auswählen und sehen, welche Inhaltseinträge auf ein lokales Medienelement verweisen.

Medienbibliothek öffnen

Wählen Sie Media in der Admin-Seitenleiste. Die Hauptbibliothek enthält Ordner und Dateien, die keinem Ordner zugeordnet wurden. Wählen Sie einen Ordner, um seine Dateien zu durchsuchen, oder wechseln Sie zwischen Raster- und Listenansicht.

Wenn die Website externe Medienanbieter hat, erscheint jeder Anbieter als weitere Quelle. Die Fähigkeiten der Anbieter variieren: Eine Quelle kann das Durchsuchen und Auswählen unterstützen, aber nicht Ordner, lokale Bildbearbeitung oder Löschung.

Dateien hochladen

Aus der Bibliothek hochladen

Uploads beginnen, sobald Dateien hinzugefügt werden. Neue lokale Dateien landen in der Hauptbibliothek, auch wenn ein anderer Ordner vor dem Upload geöffnet war.

Beim Bearbeiten von Inhalten hochladen

Bild-, Datei-, Galerie- und Portable-Text-Bildfelder verwenden einen Medienwähler. Öffnen Sie das Feld, wählen Sie Upload files und wählen oder ziehen Sie Dateien. Ein abgeschlossener Upload wird Teil der aktuellen Auswahl; fehlgeschlagene Uploads bleiben sichtbar, damit Sie sie wiederholen oder entfernen können.

Für eine Galerie überprüfen Sie Selected media und verwenden Sie die Verschiebe-Steuerelemente, um die Reihenfolge festzulegen, bevor Sie Add images wählen. Für ein einzelnes Bild oder eine Datei wählen Sie Select oder Insert image nach Abschluss des Uploads.

Akzeptierte Dateien und Größenlimit

Die lokale Medienbibliothek akzeptiert standardmäßig diese Dateigruppen:

• PNG-, JPEG-, GIF-, WebP- und AVIF-Bilder;
• gängige Videoformate wie MP4, WebM und QuickTime-Video;
• gängige Audioformate wie MP3, WAV und Ogg-Audio; und
• PDF-Dokumente.

SVG ist von der Standard-Upload-Liste ausgeschlossen, da SVG-Dateien aktive Inhalte enthalten können. Ein Bild- oder Dateifeld kann seine eigene Liste akzeptierter Dateitypen definieren, wenn das Inhaltsmodell eine engere Auswahl oder ein anderes Format benötigt. EmDash identifiziert jede Datei anhand ihres Medientyps, einem Label wie image/png oder application/pdf, und prüft die Feldliste erneut, wenn der Inhalt gespeichert wird. Das Ändern des Dateiauswählers des Browsers umgeht diese Serverprüfung nicht.

Das standardmäßige Maximum beträgt 50 MB pro Datei. Site-Entwickler können es mit maxUploadSize ändern. Ein Anbieter kann ein zusätzliches Format- oder Größenlimit auferlegen und meldet diesen Fehler in der Upload-Zeile.

Dateien finden und organisieren

Die Suche findet teilweise Dateinamen. Der Typfilter beschränkt die Ergebnisse auf Bilder, Dokumente, Video oder Audio. Eine Dateinamensuche durchsucht die gesamte lokale Bibliothek, auch wenn ein Ordner geöffnet ist; das Durchsuchen eines Ordners ohne Suche zeigt nur die diesem Ordner zugewiesenen Dateien.

Redakteure können Add new folder in der Hauptbibliothek wählen. Verschieben Sie eine lokale Datei, indem Sie ihre Karte oder Zeile auf einen sichtbaren Ordner ziehen, oder öffnen Sie die Datei, ändern Sie Location und wählen Sie Save. Verwenden Sie Main library als Speicherort, um eine Datei aus ihrem aktuellen Ordner zu entfernen.

Autoren können lokale Dateien verschieben, die sie hochgeladen haben. Redakteure können jede lokale Datei verschieben. Elemente externer Anbieter können nicht Medienbibliothek-Ordnern zugewiesen werden.

Das Löschen eines Ordners verschiebt seine Dateien zurück in die Hauptbibliothek. Es löscht nicht die Dateien, ändert nicht ihre URLs und entfernt nicht ihre Inhaltsreferenzen.

Medien für Inhalte auswählen

Portable-Text-Bilder

Platzieren Sie den Cursor in einem Portable-Text-Feld, öffnen Sie das Blockmenü und wählen Sie Image. Wählen oder laden Sie ein Bild hoch, dann wählen Sie Insert image. Wählen Sie danach den Bildblock, um Alt-Text, eine Beschriftung, Anzeigeabmessungen und Ausrichtung hinzuzufügen.

Bild- und Dateifelder

Wählen Sie die Feldaktion, wie Select image oder Select file, dann wählen Sie ein Element und bestätigen Sie die Auswahl. Die MIME-Typ-Regeln eines Feldes begrenzen, welche Bibliothekelemente und Medienquellen angezeigt werden.

Das featured_image-Feld des Blog-Templates speichert den ausgewählten Medienwert mit dem Beitrag. Das Speichern des Eintrags speichert diese Referenz im Entwurf; das Veröffentlichen macht sie für öffentliche Inhaltsabfragen verfügbar.

Galeriefelder

Wählen Sie ein oder mehrere Bilder, ordnen Sie sie unter Selected media an und bestätigen Sie. Eine Galerie behält ihre eigene Reihenfolge und pro Bild Alt-Text und Beschriftung, auch wenn mehrere Positionen auf Medienbibliothek-Elemente verweisen.

Ein in Inhalten verwendetes Bild bearbeiten

Ein ausgewähltes lokales Bild bietet Aktionen mit unterschiedlichem Umfang:

• Replace wählt ein anderes Medienbibliothek-Element für dieses Feld, diesen Block oder diese Galerieposition. Andere Einträge, die das ursprüngliche Element verwenden, ändern sich nicht.
• Edit asset öffnet das zugrundeliegende Medienbibliothek-Element. Metadatenänderungen und destruktive Bildänderungen können andere Verwendungen dieses Elements beeinflussen.
• Remove löscht diese Inhaltsreferenz. Das Medienbibliothek-Element bleibt verfügbar.

Wenn Edit asset eine beschnittene Kopie erstellt, wählt der Picker die neue Kopie für die aktuelle Verwendung. Portable-Text- und Galeriebilder behalten den Alt-Text, die Beschriftung, das Layout und die Position dieser Verwendung. Wenn Edit asset das Original ersetzt, bleibt die Medien-ID gleich, sodass jede Verwendung dieses Elements das geänderte Bild erhält.

Bilder externer Anbieter und Dateifelder bieten Replace und Remove, öffnen aber nicht den lokalen Asset-Editor.

Ein lokales Bild ersetzen

Replace image lädt neue Bytes hinter einem bestehenden Medienbibliothek-Element hoch. Verwenden Sie es, wenn jeder Ort, der auf das Element verweist, eine neue Version des Bildes zeigen soll.

Die Aktion ist für fertige JPEG-, PNG- und WebP-Elemente verfügbar. Autoren können Bilder ersetzen, die sie hochgeladen haben; Redakteure können jedes lokale Bild ersetzen.

EmDash behält die Medien-ID, den Dateinamen, die URL, den Alt-Text, die Beschriftung und den Ordner. Bestehende Inhaltsreferenzen funktionieren daher weiterhin und zeigen den Ersatz. Der Ersatz löscht den gespeicherten Fokuspunkt, da seine Koordinaten möglicherweise nicht das neue Bild beschreiben.

Verwenden Sie stattdessen Replace im Content-Editor, wenn nur ein Feld oder Bildblock geändert werden soll.

Fokuspunkt setzen

Ein Fokuspunkt markiert den Teil eines Bildes, der sichtbar bleiben soll, wenn ein Layout das Bild beschneidet, um ein Quadrat, Querformat, Hochformat oder eine andere feste Form zu füllen.

Wählen Sie Reset, um den benutzerdefinierten Punkt zu entfernen. Wenn Sie ein Bild für ein Feld oder eine Galerie auswählen, kopiert EmDash den aktuellen Fokuspunkt des Assets in diesen Inhaltswert. Inhalte, die das Bild bereits verwenden, behalten ihren gespeicherten Punkt, bis Sie das Bild erneut auswählen. Das Öffnen von Edit asset aus einem Inhaltsfeld aktualisiert diese aktuelle Verwendung mit dem Punkt, den Sie speichern.

Ein lokales Bild beschneiden

Das Beschneiden ist für fertige JPEG-, PNG- und WebP-Bilder verfügbar, die von EmDash gespeichert werden. Bilder externer Anbieter können im lokalen Asset-Editor nicht beschnitten werden.

Replace original ist nur mit dem Seitenverhältnis Original verfügbar. Verwenden Sie Create cropped copy für Freeform und die anderen Verhältnisse. Eine beschnittene Kopie bleibt im selben Ordner wie ihre Quelle und erhält einen eindeutigen Dateinamen.

Das Beschneiden eines animierten WebP erstellt ein statisches WebP. Das beschnittene Ergebnis behält die Animation nicht.

Sehen, wo eine Datei verwendet wird

Öffnen Sie eine lokale Datei und wählen Sie Used in, um Inhaltseinträge aufzulisten, die darauf verweisen. Jedes Ergebnis benennt die Collection und die Felder, die die Referenz enthalten, und kann den Eintrag zur Bearbeitung öffnen. Gelöschte Einträge werden in der Liste identifiziert.

Die Mediennutzungsverfolgung muss aktiv sein, bevor diese Liste vollständig sein kann. Ein Administrator aktiviert sie einmalig für die Website:

Einmal aktiviert, kann die Mediennutzungsverfolgung nicht deaktiviert werden. Neue Inhaltsänderungen werden verfolgt, nachdem die Erfassung aktiv wird; der Hintergrundscan fügt Referenzen von bereits existierenden Einträgen hinzu.

Wenn die Used in-Ansicht meldet, dass die Indizierung läuft, veraltet, teilweise oder fehlgeschlagen ist, behandeln Sie die Ergebnisse als unvollständig. Ein Administrator kann zu Media usage tracking zurückkehren, um den aktuellen Status und die Wiederherstellungsanleitung zu erhalten.

Ein Bild in einem Template rendern

Bildfelder geben einen Medienwert anstelle einer einfachen URL zurück. Rendern Sie diesen Wert mit Image aus emdash/ui, damit lokale und anbietergestützte Bilder die entsprechende URL, Abmessungen, Fokuspunkt, responsive Varianten und Low-Quality-Platzhalter verwenden:

---
import { getEmDashEntry } from "emdash";
import { Image } from "emdash/ui";

const { entry: post, error } = await getEmDashEntry("posts", Astro.params.slug);
if (error) return new Response("Unable to load post", { status: 500 });
if (!post) return Astro.redirect("/404");
---

{post.data.featured_image && (
  <Image image={post.data.featured_image} width={1200} height={675} priority />
)}

Verwenden Sie priority nur für das Hauptbild, das oben auf der Seite sichtbar ist. Es fordert eager Loading an und gibt dem Browser einen hohen Fetch-Priority-Hinweis. Andere Bilder sollten den Standard des Lazy-Loading der Komponente beibehalten.

Wenn das Feld ein Dunkelmodus-Gegenstück hat, rendert Image beide Quellen und wählt eine basierend auf dem Farbschema des Besuchers. Siehe Dunkelmodus-Bilder für die Feld- und Template-Einrichtung.

Das Template erhält die mit der Inhaltsreferenz gespeicherten Medienmetadaten ohne eine weitere Medienbibliothek-Abfrage. Wenn eine benutzerdefinierte Integration die neuesten Metadaten des Anbieters benötigt, fordern Sie dieses Element explizit an und vermeiden Sie eine Anbieter-Suche pro Bild auf einer Collection-Seite. Die Feldtyp-Referenz beschreibt gespeicherte Datei- und Bildwerte.

Speicher und Anbieter konfigurieren

Die lokale Bibliothek speichert Dateien über den konfigurierten Speicheradapter der Website. Node.js-Websites können lokalen Speicher oder S3-kompatiblen Speicher verwenden; Cloudflare-Websites verwenden üblicherweise ein R2-Binding. Der Adapter bestimmt, wo Bytes gespeichert werden, während die Medienbibliothek den gleichen Autorenworkflow beibehält. Siehe Medienspeicher für Konfigurations- und Produktionspersistenz-Anforderungen.

Cloudflare Images und Cloudflare Stream können als externe Medienanbieter registriert werden. Sie erscheinen als Quellen im Picker, und Image versteht anbietergestützte Bildwerte. Anbieterelemente werden weiterhin von diesem Dienst verwaltet, sodass lokale Ordner, Fokuspunkte, Beschneidung und Ersetzung für diese Elemente im EmDash-Asset-Editor nicht verfügbar sind.

Medien sicher löschen

Öffnen Sie eine Datei in der Medienbibliothek, wählen Sie Delete und bestätigen Sie die permanente Löschung. Autoren können lokale Dateien löschen, die sie hochgeladen haben; Redakteure können jede lokale Datei löschen. Ein Anbieterelement wird nur dann von seinem Anbieter gelöscht, wenn diese Quelle die Löschung unterstützt und der aktuelle Benutzer die Berechtigung hat.

Für automatisierte Uploads und Medienverwaltung siehe die Medienendpunkt-Referenz oder die CLI-Medienbefehle. Fahren Sie mit Mit Inhalten arbeiten fort, um Einträge zu veröffentlichen, die die ausgewählten Medien verwenden.