Kennst du das? Eine von dir gewählte SVG lässt sich nicht in WordPress in die Mediathek hochladen? Das ist ärgerlich, doch das ist kein Problem. Wir zeigen dir wie man in WordPress SVG Dateien ohne Fehler hochlädt.
Warum SVG?
SVG-Dateien (Scalable Vector Graphics) sind super, denn sie sparen bei der richtigen Verwendung immens an Ladegeschwindigkeit. Gleichzeitig lassen Sie sich SVG-Bilder beliebig skalieren, da die Dateien aus Vektoren bestehen und nicht aus Pixeln wie herkömmliche JPG-, PNG- oder GIF-Bilder. Das Dateiformat wird vom W3C-Konsortium empfohlen. Aus diesen Gründen sollte man, wo immer möglich und sinnvoll, mit SVG-Dateien arbeiten.
Mehr zu SVG-Dateien
Alle gängigen Browser unterstützen in der Zwischenzeit die Anzeige von SVG-Dateien. Einem ungehinderten Einsatz steht daher nicht mehr im Wege, vorausgesetzt WordPress verweigert nicht den Upload der SVG-Datei.
WordPress für SVG vorbereiten
Bevor du in WordPress SVG-Dateien ohne Probleme hochladen kannst, müssen innerhalb von WordPress Vorbereitungen getroffen werden, damit eine SVG-Datei zum Upload überhaupt zugelassen wird.
Gehe in die functions.php deines Child-Themes. Gehe hierzu als angemeldeter Administrator im WordPress Backend zu folgendem Pfad im Backend-Menü (links):
Design > Editor
Hier angekommen klickst du in der rechten Seitenleiste auf functions.php und wartest bis die Seite mit der Datei geladen wurde. Nun fügst du am Ende der Datei folgende Zeilen hinzu:
function add_mimes( $mimes ) {
$mimes['svg'] = 'image/svg+xml';
return $mimes;
}
add_action( 'upload_mimes', 'add_mimes' );
SVG überprüfen und ggf. vorbereiten
Nun nachdem wir WordPress vorbereitet haben, überprüfen wir unsere SVG-Datei und bereiten sie ggf. für den Upload vor. Öffne hierzu die gewünschte SVG-Datei und öffne sie in einem Text-Editor deiner Wahl.
Wichtig ist, dass innerhalb der SVG-Datei diese Zeile als erstes im Code steht:
<?xml version="1.0" encoding="utf-8"?>
Falls diese Zeile nicht im Code der SVG-Datei steht, füge diese ganz am Anfang vor dem restlichen Code hinzu.
Manchmal stehen vor dem Code eine oder mehrere Zeilen als Kommentar. Falls du einen Kommentar zu Beginn der Datei erkennst, entferne diesen. Denn auch der Kommentar kann den Upload der SVG-Datei in die WordPress Mediathek verhindern.
SVG-Datei in WordPress hochladen
Nachdem du nun WordPress vorbereitet hast und die SVG und überprüft und ggf. bearbeitet hast, lade die Vektor-Datei nun in die Mediathek hoch. Nun sollte es fehlerfrei funktionieren. Falls nicht, hinterlasse uns einen Kommentar oder schicke uns eine Nachricht.
