Ein Blog über Code, Hardware und Co

Programmieren und Entwickeln, Allgemein

Upload von HEIC-Dateien in WordPress Mediathek ermöglichen

Der Upload von Heic-Dateien in WordPress ist standardmäßig nicht möglich. Ich zeige Dir, wie es geht.
WordPress bietet eine umfangreiche Mediathek zur Verwaltung von Medien für die eigene Webseite an. Ebenso hat Apple mit HEIC ab iOS11 ein neues Bildformat eingeführt. Leider ist der Upload von HEIC-Dateien aktuell standardmäßig nicht vorgesehen. So klappt es trotzdem.

Das Problem: Upload von HEIC nicht möglich

Ab iOS 11 nehmen iPhones Bilder standardmäßig im HEIC-Format statt im JPG-Format auf. Apple hat sich für das neue Dateiformat entschieden, da es bei gleicher Qualität der Fotos erheblich weniger Speicherplatz benötigt.

Wenn man nun aber versucht, ein mit dem iPhone aufgenommenes Foto im HEIC-Format bei WordPress hochzuladen, erhält man in der Standardkonfiguration die folgende Fehlermeldung:

Dieser Dateityp ist aus Sicherheitsgründen leider nicht erlaubt.

Abbildung 1: Uploadfehler bei Bildern im HEIC-Format.

Die Lösung: Upload für die WordPress-Mediathek freigeben oder Files umwandeln

Das ist natürlich ärgerlich, wenn wir Bilder im HEIC-Format auf der eigenen Webseite mit WordPress-Basis verwenden möchten. Aber es gibt Lösungen, wie man die Medienbibliothek dazu bringen kann, auch Bilder im HEIC-Format zu akzeptieren.

ACHTUNG: Aktuell unterstützen nur Apple-Geräte die Darstellung von HEIC-Bildern. Daher kommt es bei der direkten Verwendung von HEIC-Bildern über WordPress zu der unschönen Situation, dass die Bilder u.U. nur auf Apple-Geräten angezeigt werden.
Trotzdem erkläre ich hier, wie der Upload funktioniert.

Ich empfehle dringendst, Variante 3 zu wählen – und die Bilder VOR dem Upload umzuwandeln.

Lösung 1: Manuelle Anpassung über FTP oder Konsole

Über den Upload-Mimes Filter

Was ist das denn? Der Upload-Mime Filter ist eine Funktion (geschrieben in PHP), die man einfach in der functions.php ergänzen kann und die dann der WordPress-Instanz zur Verfügung steht und genutzt wird.
Mit Hilfe des Upload-Mime-Filters steht uns die Möglichkeit einer selektiven Filterung und granularer Steuerung der erlaubten Upload-Dateitypen zur Verfügung.

Ergänze einfach die folgende Funktion am Ende Deiner functions.php:

add_filter( 'upload_mimes', 'my_mime_function', 1, 1 );
function my_mime_function( $mime_types ) {
  $mime_types['heic'] = 'image/heic';     // Adds heic mime-type
  return $mime_types;
}
Was macht diese Funktion?

Jedes File hat einen Mime-Type. Grob gesagt bestimmt dieser Mime-Type, den Dateityp. WordPress speichert die für den Upload erlaubten Mime-Types (und damit Dateitypen) in einem Array namens „$mime_types“.

Dieses Array können wir zur Laufzeit über die o.g. Funktion bearbeiten:

ZeileBedeutung
1Fügt den Filter „upload_mimes“ mit der Filterfunktion „my_mime_function“ hinzu
2Die Funktion „my_mime_function“, der das Array $mime_types übergeben wird
3Hinzufügen der Dateiendung .heic mit dem Mime-Type „image/heic“
4Rückgabe des (ergänzten) Arrays $mime_types
5Schließen der Funktion
Tabelle 1: Erklärung der Nutzung des Upload-Mime Filters.

Tipp: Auf die selbe Art und Weise kannst Du auch.

Holzhammermethode: Über die wp-config.php

Achtung: Ich rate definitiv von dieser Methode ab, da sie mit einem Flag sämtliche Dateiformate zum Upload erlaubt (allerdings nur für Administratoren).

Solltest Du trotzdem diese Variante wählen wollen, gehe mittels FTP oder in der Konsole auf dein WordPress-Root-Verzeichnis und suche nach der Datei wp-config.php.
Dann öffnest Du die Datei mit einem Editor oder direkt in der Konsole:

vi wp-config.php

fügst folgenden Code am Ende der Datei hinzu:

define( 'ALLOW_UNFILTERED_UPLOADS', true );

Und speicherst und schließt die Datei am Ende wieder (in der Konsole im VI-Editor mittels „wq!“.

Lösung 2: Anpassung mit Hilfe eines Plugins

Es gibt – wie fast immer für WordPress – eine ganze Reihe Plugins, die das Hinzufügen neuer Mime-Types für den Upload in die Mediathek bequem über das Admin Control Panel erlauben.
Mein Favorit ist hier z.B. WP Add Mime Types.

Das Plugin zeigt alle aktuell von WordPress zum Upload erlaubten Mime-Types an und bietet die bequeme Möglichkeit des Hinzufügens weiterer Dateiendungen:

Abbildung 2: Das Hinzufügen von erlaubten Mime-Types über das Plugin WP Add Mime Types.

Lösung 3: HEIC zu JPG konvertieren

Die mit Abstand beste Methode für das Verwenden von HEIC-Bildern in WordPress ist es, sie nicht zu verwenden.
Wieso? Ganz einfach. Das Format ist zwar sehr effizient, bisher aber nur wenig verbreitet. Bisher werden Bilder im HEIC-Format daher nur auf Apple-Geräten oder Windows PCs mit extra Software angezeigt. Android-Smartphones und herkömmliche PCs bleiben außen vor. Keine gute Lösung für eine Webseite.

Daher empfiehlt es sich, die Bilder vor dem Upload in WordPress in JPG umzuwandeln.

Manuelles Umwandeln mit GIMP

Gimp ist ein kostenlos verfügbares Bildbearbeitungsprogramm, das eine Vielzahl an Funktionen bereithält. Unter anderem kann man Bilder im HEIC-Format öffnen und geöffnete Bilder in anderen Formaten exportieren.

1. Gimp starten und HEIC-Bild öffnen

Zunächst Gimp installieren und starten, dann einfach das HEIC-Bild, das umgewandelt werden soll in Gimp öffnen.

2. Exportieren als …

Wähle im Menü von Gimp „Start“ -> „Exportieren als ..“

3. Dateiendung JPG eingeben und exportieren

Im folgenden Dialog einfach die Dateiendung des Bildes von HEIC nach JPG ändern und dann auf „Exportieren“ klicken. Das Bild wird nun in ein JPG-File konvertiert und gespeichert.

Umwandeln mehrerer Dateien

So weit, so gut. Wir können nun einzelne HEIC-Files in JPG und Co umwandeln. Aber was ist, wenn wir mehrere Bilder umwandeln müssen? Dann ist der manuelle Weg über Gimp umständlich und zeitaufwändig.

Für diesen Fall gibt es Onlinedienste, die uns das Konvertieren ermöglichen, beispielsweise:

Ich nutze in der Regel den Dienst von Apowersoft, der das Konvertieren von bis zu 30 Bildern in einem Rutsch ermöglicht.

Abbildung 4: Online-Converter von HEIC zu JPG.

Hintergrund: Was ist das HEIC Bildformat?

HEIC bzw. HEIF steht für High Efficiency Image File Format und ist ein Containerformat, welches Bilder und Videos enthalten kann und diese zugleich stark komprimiert.
Apple hat das Format nicht erfunden, aber seit iOS11 und mac OS High Sierra adaptiert bzw. integriert.
Das Format ermöglicht das Speichern von hochauflösenden Bildern und benötigt dabei bis zu 40% weniger Speicherplatz als z.B. das verbreitete JPEG-Format.

Quellen:
WordPress-Codex
Wikipedia

Schreibe eine Antwort