Bilder und andere Mediendateien sind ein wichtiger Bestandteil jeder Webseite von WordPress. Um sie effektiv nutzen zu können, ist es hilfreich, die Funktionsweise der WordPress-Medienbibliothek genau zu kennen.
Diese praktische WordPress-Funktion ermöglicht es dir, deine Bilder und andere Medien im Laufe der Zeit zu speichern und zu verwalten. Mit etwas Insiderwissen und ein paar einfachen Tricks kannst du deine Webseite über deine Mediathek verbessern.
In dieser umfassenden Anleitung führen wir dich durch alles, was es über die WordPress-Medienbibliothek zu wissen gibt, einschließlich des Importierens und Herunterladens von Inhalten. Wir werden auch über Bildbearbeitung, langfristige Dateiverwaltung und vier Hacks zum Einbinden fortgeschrittener Funktionen berichten.
Lasst uns loslegen!
Eine Einführung in die WordPress Medienbibliothek
Im Kern ist deine WordPress Media Library genau das, was der Name schon sagt: ein Katalog aller Mediendateien, die du auf deine Webseite hochgeladen hast:
WordPress ist in der Lage, eine Vielzahl von Medientypen zu hosten:
- Bilder (.jpg, .jpeg, .png, .gif und .ico).
- Audiodateien (.mp3, .m4a, .ogg und .wav).
- Videos (.mp4, .m4v, .mov, .wmv, .avi, .mpg, .ogv, .3gp und .3g2).
- PDFs.
- Word-Dokumente.
- Excel-Tabellen.
- PowerPoint-Präsentationen.
- Adobe Photoshop Dokumente.
Es hat auch einige eingeschränkte Fotobearbeitungsmöglichkeiten, so dass du direkt von deinem Dashboard aus die nötigen Anpassungen vornehmen kannst.
Leider unterstützt WordPress noch keine Webp-Bilder von Haus aus.
Um auf deine Medienbibliothek zuzugreifen, klicke einfach jederzeit auf Medien in deiner Admin-Sidebar:
Hier gibt es ein paar grundlegende Optionen.
Zunächst kannst du festlegen, ob du deine Dateien in einer Listen- oder Gitteransicht sehen möchtest, indem du auf die entsprechenden Symbole klickst:
Du kannst deine Dateien auch über die Drop-Down-Menüs filtern:
Das erste Menü ermöglicht es dir, deine Medien nach Medientyp anzuzeigen, während das zweite Menü den Inhalt deiner Bibliothek nach den Daten filtert, an denen sie hochgeladen wurden.
Du kannst auch die Suchleiste benutzen, um bestimmte Dateien nach Namen zu suchen:
Schließlich gibt es auch noch einen Bulk Select Button. Mit dieser Funktion kannst du mehrere Dateien auf einmal aus deiner WordPress-Installation löschen:
Dies deckt alle systemeigenen Funktionen ab, die in der WordPress Medienbibliothek zur Verfügung stehen.
Wie ihr später sehen werdet, gibt es viele Modifikationen, die ihr vornehmen könnt, um es zu verbessern. Zuerst müssen wir jedoch besprechen, wie man Dateien zu WordPress hinzufügt.
Wie du Dateien zu deiner WordPress Medienbibliothek hinzufügst
Es gibt ein paar verschiedene Möglichkeiten, wie du Dateien (z. B. das Favicon deiner Seite) zu deiner WordPress Medienbibliothek hinzufügen kannst. Die erste ist, zu Media > Add New zu navigieren:
Hier kannst du Dateien hochladen, die auf deinem Computer oder einem anderen Gerät gespeichert sind:
Du kannst auch Medien direkt aus dem WordPress-Editor hinzufügen. Beginne im Block-Editor mit dem Hinzufügen des entsprechenden Blocks für den Medientyp, den du einbinden möchtest:
In dem resultierenden Platzhalter wähle Upload und wähle eine Datei von deinem Computer:
Alternativ kannst du die Datei einfach per Drag & Drop von deinem Desktop in den entsprechenden Block ziehen.
Im Classic Editor musst du auf die Schaltfläche Add Media klicken:
Navigiere dann zum Reiter Upload und wähle eine Datei von deinem Computer aus:
Du kannst auch jederzeit Dateien von deinem Desktop direkt in den Editor ziehen und ablegen.
In einigen Fällen kann es vorkommen, dass du Mediendateien manuell per FTP auf deine WordPress Webseite hochladen musst. Du kannst dies mit einem Client wie FileZilla tun.
Sobald du dich mit deinem Server verbunden hast, navigiere zu wp-content > uploads:
Lade Dateien in dieses Verzeichnis hoch, um sie zu deiner Medienbibliothek hinzuzufügen.
Herunterladen von Inhalten aus der WordPress Medienbibliothek
Unter bestimmten Umständen kann es sein, dass du Dateien aus deiner Medienbibliothek auf deinen Computer herunterladen musst. WordPress ermöglicht es dir, dies direkt zu tun, indem du zu Tools > Export navigierst:
Wähle dann die Option Media. Wenn du nur Dateien benötigst, die innerhalb eines bestimmten Zeitrahmens hochgeladen wurden, kannst du die Dropdown-Menüs verwenden, um deine Anfrage zu spezifizieren:
Klicke schließlich auf die Schaltfläche Download Export File. Dadurch werden die entsprechenden Mediendateien auf deinen Computer heruntergeladen.
Wie man Bilder in der WordPress Medienbibliothek bearbeitet
Wie wir bereits erwähnt haben, hat WordPress ein paar native Bildbearbeitungsfunktionen. Um auf diese zuzugreifen, navigiere zu deiner WordPress Medienbibliothek und wähle die Datei aus, die du bearbeiten möchtest. Klicke dann auf die Schaltfläche Bild bearbeiten:
Dadurch wird der Bildeditor geöffnet:
Es gibt fünf grundlegende Bearbeitungen, die du vornehmen kannst:
Beschneiden ermöglicht es dir, Teile des Bildes auszuschneiden:
Wenn du das Bild drehst, wird es entweder gegen den Uhrzeigersinn oder im Uhrzeigersinn um 90 Grad gedreht:
Wenn du das Bild umdrehst, wird es entweder vertikal oder horizontal gespiegelt:
Die anderen drei Einstellungen befinden sich in der Sidebar. Mit der ersten kannst du die Größe des Bildes ändern, indem du es skalierst. Gib einfach deine gewünschte Höhe oder Breite ein, und das andere Feld wird automatisch ausgefüllt. Klicke dann auf die Schaltfläche Skalieren:
Es ist wichtig zu beachten, dass die Größenänderung von Bildern in WordPress manchmal die Qualität negativ beeinflussen kann.
Außerdem kannst du nur große Bilder nehmen und sie verkleinern. Du kannst Bilder nicht auf eine größere Größe skalieren!
Um dein Bild so zuzuschneiden, dass es ein bestimmtes Seitenverhältnis oder bestimmte Abmessungen hat, kannst du die Felder Seitenverhältnis und Auswahl unter Bildausschnitt benutzen:
Wenn du schließlich das vorhandene Miniaturbild beibehalten möchtest, kannst du dies über die Miniaturbildeinstellungen tun. Wähle einfach das Optionsfeld für die Version deines Bildes aus, an der du Änderungen vornehmen möchtest:
Die Standard-Bildbearbeitung von WordPress ist nützlich, aber begrenzt. Es wird keine Software ersetzen, die du für umfangreichere Modifikationen verwenden könntest, besonders wenn du eine Webseite oder ein Fotoblog betreibst.
WordPress Medienbibliothek Fehler verstehen
Leider treten bei WordPress Fehler auf. Und die WordPress Medienbibliothek ist da keine Ausnahme.
Ein Problem, das häufig auftritt, ist ein nicht spezifizierter „HTTP-Fehler“, der auftreten kann, wenn du eine neue Datei aus dem Editor heraus hochlädst:
Normalerweise kannst du einfach warten, bis dieser Fehler verschwunden ist und deinen Upload nach ein paar Minuten erneut versuchen. Wenn der HTTP-Fehler wieder auftritt, kann es sein, dass deine WordPress-Sitzung abgelaufen ist. Du musst dich erneut einloggen und dann deinen Upload erneut versuchen.
Ein weiteres Problem, mit dem einige Benutzer konfrontiert werden, ist, dass die Medienbibliothek nicht geladen werden kann. Dies ist oft auf einen Konflikt mit deinen Plugins und/oder deinem Theme zurückzuführen. Um diesen Fehler zu beheben, versuche alle deine Plugins zu deaktivieren und zu einem WordPress Standard Theme zu wechseln.
Wenn deine Mediathek wieder richtig lädt, musst du den Plugin-Konflikt weiter beheben, um das Problem dauerhaft zu lösen.
Manchmal kannst du den Fehler „Upload: Failed to Write File to Disk“ Fehler, wenn du deine Dateien über die Medienbibliothek hochlädst. Normalerweise tritt dieses Problem auf, wenn dein Upload-Verzeichnis auf „Not Writable“ gesetzt ist. Du kannst die Berechtigungen deines Dateisystems über das Site Health Tool von WordPress überprüfen.
Langfristige Verwaltung der Mediathek
Bis jetzt haben wir uns bei der Medienbibliothek ausschließlich auf die nativen Funktionen von WordPress konzentriert. Wenn du diese Funktion jedoch mit der Zeit benutzt, wirst du wahrscheinlich auf einige Probleme stoßen, die Hilfe von externen Lösungen erfordern.
Je mehr Dateien du zum Beispiel hinzufügst, desto unordentlicher wird deine WordPress-Medienbibliothek werden. Abgesehen von den Such- und Filteroptionen, die zu Beginn dieses Beitrags besprochen wurden, bietet WordPress nicht viel Hilfe beim Umgang mit unruhigen Medienmengen.
Es gibt jedoch ein paar Plugins, die es dir ermöglichen, deine Mediendateien in Ordnern anzuordnen.
Das WordPress Media Library Folders Plugin ist die beliebteste Option:
Mit diesem Plugin kannst du nicht nur Ordner für Mediendateien erstellen, sondern es integriert sich auch in MaxGalleria, so dass du Bildergalerien direkt aus der Medienbibliothek erstellen kannst:
Ein Upgrade auf WordPress Media Library Folders Pro bietet zusätzliche Integration mit dem NextGEN Gallery Plugin und Advanced Custom Fields. Es ermöglicht es dir auch, Kategorien und Tags zu erstellen, um deine Dateien weiter zu organisieren.
Eine weitere Funktionalität, die WordPress fehlt, ist die Möglichkeit, Mediendateien durch neue Versionen zu ersetzen. Da diese Arten von Dateien ziemlich groß sein können, möchtest du nicht einfach immer wieder neue hinzufügen, wenn du deinen Inhalt aktualisieren musst.
Das bedeutet, dass du, nachdem du eine neue Datei hochgeladen hast, die alte Version suchen und es löschen musst. Du kannst dir etwas Zeit sparen, indem du alte Bilder direkt mit Enable Media Replace ersetzst:
Mit diesem Plugin kannst du auch alle Links ersetzen, die auf die alte Datei zeigen. Dies ist hilfreich, um kaputte Medien auf deiner Webseite zu vermeiden.
Real Media Library ist ein weiterer Ordner- und Dateimanager, den du dir ansehen solltest, um deine Dateiverwaltung zum Kinderspiel zu machen.
Mit diesem Plugin kannst du eine Vielzahl von Dateien wie Bilder, Videos und Dokumente direkt in WordPress verwalten. Gut zu wissen: Real Media Library ist in 12 Sprachen verfügbar. Wenn dir die kostenlose Version nicht ausreichen sollte, bieten sie auch eine PRO-Version mit mehr Funktionen an.
4 Handy WordPress Medienbibliothek Hacks
Die WordPress Mediathek kann die meisten der üblichen Anforderungen eines Webseiten-Administrators erfüllen. WordPress stellt jedoch eine Reihe von Funktionen und Features zur Verfügung, die es den Benutzern ermöglichen, bestimmte Funktionen der Mediathek zu erweitern, ohne die Verwendung von Plugins von Drittanbietern. Tauchen wir mit vier praktischen Beispielen in diese Funktionen und Hooks ein.
1. Benutzerdefinierte Metadaten zu den Beitragsarten für Anhänge hinzufügen
edes Mal, wenn du eine Mediendatei hochlädst, generiert WordPress einen Attachment-Posttyp.
Genau wie jeder andere Beitragstyp werden Anhänge in der wp_posts-Tabelle registriert, und ihre jeweiligen Metadaten findest du in der wp_postmeta-Tabelle in deiner Datenbank:
Die wp_posts-Tabelle speichert Daten, die post_content (Beschreibung des Anhangs), post_excerpt (Beschriftung des Anhangs), post_author, post_title, post_status und post_mime_type beinhalten.
Die wp_postmeta-Tabelle speichert jede Art von Metadaten, wie z.B. die URL der angehängten Datei, Bildabmessungen und Mime-Typen, sowie Metadaten des Exchangeable Image File Format (EXIF) und des International Press Telecommunications Council (IPTC).
Gelegentlich kann es erforderlich sein, benutzerdefinierte Metadaten zu Anhängen hinzuzufügen, z. B. den Namen des Autors eines Dokuments, eine zugehörige URL oder den Ort, an dem ein Foto aufgenommen wurde. Das Hinzufügen von Metafeldern zu Anhängen ist etwas anders als das Hinzufügen von Metafeldern zu Beiträgen und erfordert spezielle Haken und Funktionen.
Zuerst musst du alle notwendigen benutzerdefinierten Felder auf dem Bildschirm „Medien bearbeiten“ hinzufügen. Du kannst diese Aufgabe erledigen, indem du die verfügbaren Felder für Dateianhänge durch den Filter attachment_fields_to_edit in wp-admin/includes/media.php filterst:
function media_hacks_field_to_edit( $form_fields, $post ){
// https://codex.wordpress.org/Function_Reference/wp_get_metadata
$media_author = get_post_meta( $post->ID, 'media_author', true );
$form_fields['media_author'] = array(
'value' => $media_author ? $media_author : '',
'label' => __( 'Author' )
);
return $form_fields;
}
add_filter( 'fields_to_edit', 'media_hacks_field_to_edit', 10, 2 );Die Funktion hat zwei Argumente: das $form_fields-Array von Formularfeldern und das $post-Objekt. Zuerst holt get_post_meta den existierenden ‚media_author‚-Wert, dann wird ein ‚media_author‚-Element zum $form_fields-Array hinzugefügt.
Schließlich gibt der Callback $form_fields zurück (siehe den Code auf Gist).
Dadurch wird auf der Seite „Medien bearbeiten“ ein neues Feld angezeigt, auf das du zugreifen kannst, indem du das entsprechende Bild aus deiner Medienbibliothek auswählst und auf den Link „Mehr Details bearbeiten“ klickst:
Auf dem resultierenden Bildschirm siehst du unten dein neues benutzerdefiniertes Metadatenfeld:
Der nächste Schritt ist das Speichern der Benutzereingaben. Dies kannst du erreichen, indem du eine neue Funktion in die edit_attachment-Aktion einhängst:
function media_hacks_edit_attachment( $id ){
if ( isset( $_REQUEST['attachments'][$id]['media_author'] ) ) {
$media_author = $_REQUEST['attachments'][$id]['media_author'];
update_post_meta( $id, 'media_author', $media_author );
}
}
add_action( 'edit_attachment', 'media_hacks_edit_attachment' );
Diese Funktion behält nur ein Argument: die $attachment_id der aktuellen Mediendatei. Zuerst prüft die Funktion, ob ein gültiger Wert für das benutzerdefinierte Metafeld gesendet wurde. Dann registriert es den Wert dank der update_post_meta-Funktion (siehe den Code auf Gist).
Jetzt kannst du den ‚media_author‚-Wert dank der get_post_meta-Funktion abrufen (siehe den Code auf Gist):
$media_author = get_post_meta( $post->ID, 'media_author', true );Danach kannst du es überall im Frontend anzeigen lassen.
2. EXIF- und IPTC-Metadaten im Bildschirm „Medien bearbeiten“ anzeigen
WordPress speichert automatisch erweiterte Metadaten für JPEG- und TIFF-Mime-Typen. Jetzt, da du weißt, wie man über die media.php Felder zum Edit Media Screen hinzufügt, kannst du diese Daten anzeigen.
Um diese Aufgabe zu erledigen, musst du die erste Callback-Funktion wie folgt ändern:
function media_hacks_fields_to_edit( $form_fields, $post ){
// get post mime type
$type = get_post_mime_type( $post->ID );
// get the attachment path
$path = get_attached_file( $post->ID );
// get image metadata
$metadata = wp_read_image_metadata( $path );
if( 'image/jpeg' == $type ){
if( $metadata ) {
$exif_data = array(
'aperture' => 'Aperture',
'camera' => 'Camera',
'created_timestamp' => 'Timestamp',
'focal_length' => 'Focal Length',
'iso' => 'ISO',
'shutter_speed' => 'Exposure Time',
'orientation' => 'Orientation' );
foreach ( $exif_data as $key => $value ) {
$exif = $metadata[$key];
$form_fields[$key] = array(
'value' => $exif ? $exif : '',
'label' => __( $value ),
'input' => 'html',
'html' => "ID][$exif]' value='" . $exif . "' />
);
}
}
}
return $form_fields;
}
add_filter( 'fields_to_edit', 'media_hacks_fields_to_edit', 10, 2 );Dieses Snippet benutzt die folgenden WordPress Funktionen:
- get_post_mime_type liefert den Mime-Typ eines Attachments basierend auf der ID.
- get_attached_file liefert den Pfad der angehängten Datei basierend auf der ID.
- wp_read_image_metadata liefert EXIF- oder IPTC-Metadaten, falls verfügbar.
Wenn der Bild-Mime-Typ „image/jpeg“ ist, und wenn Metadaten existieren, dann wird ein Array mit den erforderlichen Metadaten deklariert und ein Formularfeld für jedes Element im Array erstellt:
Die Formularfelder in diesem Beispiel sind etwas komplexer, da wir einen Wert für das ‚html‚-Formular-Element setzen (siehe den Code auf Gist). Du brauchst die EXIF- und IPCT-Metadaten nicht zu speichern, da WordPress sie beim Hochladen von Bildern automatisch in der wp_postmeta-Tabelle speichert.
3. Erweiterte Metadaten im Frontend anzeigen
All diese Informationen für dich selbst im Backend zu haben, ist nützlich. Wenn du jedoch auch erweiterte Metadaten für deine Mediendateien im Frontend anzeigen lassen willst, musst du noch ein wenig mehr basteln.
Dazu kannst du diese Informationen mit einem the_content-Filter in wp-admin/includes/post.php an die Attachmentbeschreibung anhängen, etwa so:
function media_hacks_the_content( $content ){
global $post;
if( is_attachment() && 'image/jpeg' == get_post_mime_type( $post->ID ) ) {
$fields = wp_get_attachment_metadata( $post->ID );
$meta = $fields['image_meta'];
if( ! empty( $meta['camera'] ) ){
$custom_content = "
<ul>
<li>Camera: {$meta['camera']}</li>
<li>Created timestamp: {$meta['created_timestamp']}</li>
<li>Aperture: {$meta['aperture']}</li>
<li>Focal length: {$meta['focal_length']}</li>
<li>ISO: {$meta['iso']}</li>
<li>Shutter speed: {$meta['shutter_speed']}</li>
<li>Orientation: {$meta['orientation']}</li>
</ul>";
$content .= $custom_content;
}
}
return $content;
}
add_filter( 'the_content', 'media_hacks_the_content' );Hier wird die Funktion wp_get_attachment_metadata aufgerufen. Wenn der aktuelle Beitragstyp „attachment“ ist und wenn der aktuelle Mime-Typ „image/jpeg“ ist, dann werden die verfügbaren Bild-Metadaten abgerufen und verwendet, um eine ungeordnete Liste von Feldern zu erstellen, die an den Beitragsinhalt angehängt wird.
Die Callback-Funktion gibt $content zurück (siehe diesen Code auf Gist):
Oben siehst du den neuen Attachment-Post mit den Metadaten, die an die Beschreibung angehängt sind.
4. Ein Fotoarchiv veröffentlichen
WordPress zeigt von Haus aus keine Archive mit Anhängen an. Dies geschieht, weil die has_archive-Option des Attachment-Post-Typs auf false gesetzt ist.
Außerdem, während der standardmäßige post_status Parameter des $query Objekts auf „publish“ gesetzt ist, ist der standardmäßige Attachment post_status auf „inherit“ gesetzt. Das bedeutet, dass keine Attachments in Archiven angezeigt werden, es sei denn, wir setzen die Abfrage post_status explizit auf „inherit“ oder „any“ (siehe WP_Query-Typ-Parameter für weitere Informationen).
Um Bildarchive anzuzeigen, musst du zwei Funktionen definieren. Die erste Funktion filtert die Argumente eines bestimmten Beitragstyps und setzt die Eigenschaft „attachment has_archive“ auf „true„:
function media_hacks_register_post_type_args( $args, $post_type ){
if( $post_type == 'attachment' ){
$args['has_archive'] = true;
}
return $args;
}
add_filter( 'register_post_type_args', 'media_hacks_register_post_type_args', 10, 2 );Die zweite Funktion setzt benutzerdefinierte Werte für die Abfragevariablen post_mime_type und post_status:
function media_hacks_pre_get_posts( $query ){
if ( !is_admin() && $query->is_main_query() ) {
if( is_post_type_archive('attachment') ){
$query->set('post_mime_type', 'image/jpeg');
$query->set( 'post_status', 'inherit' );
}
}
}
add_action( 'pre_get_posts', 'media_hacks_pre_get_posts' );
Die Funktion ist mit dem pre_get_posts Action Hook verbunden, der nach der Erstellung der Abfrage, aber vor ihrer Ausführung ausgelöst wird. Das $query-Objekt wird per Referenz übergeben, nicht per Wert, was bedeutet, dass jede Änderung an der aktuellen Instanz von $query sich auf das ursprüngliche $query-Objekt auswirkt.
Aus diesem Grund ist es wichtig zu überprüfen, welche Query du ändern wirst (siehe diesen Code auf Gist). Wenn du dann https://yourdomain.com/?post_type=attachment in deinen Browser eingibst, solltest du ein Archiv mit JPEG-Bildern sehen:
Der vollständige Code für all diese Hacks ist als Plugin in einem öffentlichen Gist verfügbar, auf den wir durch diesen Abschnitt verlinkt haben. Du kannst es als .zip-Datei herunterladen und auf deine WordPress Webseite hochladen, um alle vier dieser Hacks zu implementieren, ohne deine Dateien manuell bearbeiten zu müssen.
Zusammenfassung
Bilder, Videos, Audiodateien und Dokumente können für die Nutzer deiner Webseite sehr wertvoll sein. Die WordPress Mediathek ist unentbehrlich, um diese Dateien hochzuladen, zu veröffentlichen und sogar zu modifizieren, um den Bedürfnissen deiner Inhalte gerecht zu werden.
Hast du weitere Fragen zur WordPress Mediathek? Lass es uns in der Sektion Kommentare unten wissen!
Carlo is a passionate lover of webdesign and front-end development. He has been playing with WordPress for more than 20 years, also in collaboration with Italian and European universities and educational institutions. He has written hundreds of articles and guides about WordPress, published both on Italian and international websites, as well as on printed magazines. You can find him on LinkedIn.
Schreibe einen Kommentar