Lesefortschritt:

SVG-Upload zur WordPress-Mediathek freischalten

28. Januar 2021 | functions.php, Mediathek, WordPress

Dieser Beitrag beinhaltet 488 Wörter. – Geschätzte Lesezeit: ca. 3 Minuten.

Besonders wenn es um Logo-Grafiken geht, trifft man als WebentwicklerIn irgendwann auf SVG-Files. Doch dieses Dateiformat lässt sich ohne Eingriff nicht ohne weiteres in die WordPress-Mediathek hochladen. Von Haus aus möchte die nur gängigere Bildformate zulassen. Dieser Tipp schafft Abhilfe.

Der folgende Code muss in der functions.php (Design/Theme-Editor) untergebracht werden:

// SVG-Upload erlauben
function svgimg_types($file_types){
   $new_filetypes = array();
   $new_filetypes['svg'] = 'image/svg+xml';
   $file_types = array_merge($file_types, $new_filetypes );
   return $file_types;
}
add_action('upload_mimes', 'svgimg_types');
// SVG in der Mediathek anzeigen 
function svg_media_thumbnails($response, $attachment, $meta){
    if($response['type'] === 'image' && $response['subtype'] === 'svg+xml' && class_exists('SimpleXMLElement'))
    {
        try {
            $path = get_attached_file($attachment->ID);
            if(@file_exists($path))
            {
                $svg = new SimpleXMLElement(@file_get_contents($path));
                $src = $response['url'];
                $width = (int) $svg['width'];
                $height = (int) $svg['height'];
                //Media Gallerie
                $response['image'] = compact( 'src', 'width', 'height' );
                $response['thumb'] = compact( 'src', 'width', 'height' );
                //Media Einzelbild
                $response['sizes']['full'] = array(
                    'height'        => $height,
                    'width'         => $width,
                    'url'           => $src,
                    'orientation'   => $height > $width ? 'portrait' : 'landscape',
                );
            }
        }
        catch(Exception $e){}
    }
    return $response;
}
add_filter('wp_prepare_attachment_for_js', 'svg_media_thumbnails', 10, 3);

Der Code besteht eigentlich aus zwei Teilen:

  1. Zunächst wird der Upload der SVG-Files zugelassen (Zeilen 2-8)
  2. Anschliessend wird die Mediathek veranlasst, die SVG-Dateien auch anzuzeigen (Zeilen 10-37)

Damit sollte Ihre WordPress-Installation auch SVG verarbeiten können.

Werbung

Werbung

 

Kostenlose WordPress- und Divi-Tricks im Abo

Wir schicken Ihnen sporadisch (weniger als 10x jährlich) neue Tricks für Wordpress und das Divi-Theme, aber auch hilfreiche CSS- und HTML-Codes frei Haus.

Füllen Sie zur Anmeldung das folgende Formular aus. Angaben mit * sind Pflichtangaben.






Vielen Dank.

Pin It on Pinterest

Share This