Как Загрузить SVG в WordPress
Сегодня мы рассмотрим, как можно в WordPress разрешить загрузку SVG изображений, чтобы добавлять SVG через библиотеку файлов. Научимся добавлять и другие форматы, например, WEBP.
При попытке загрузить SVG в WordPress, вы увидите следующее предупреждение о невозможности добавления данного типа по соображениям безопасности.
Необходимо сделать, добавить следующую функцию в functions.php.
# Добавляем SVG в список разрешенных для загрузки файлов
add_filter('upload_mimes', 'svg_upload_allow');
function svg_upload_allow($mimes)
{
$mimes['svg'] = 'image/svg+xml';
return $mimes;
}
# Исправление MIME типа для SVG файлов
add_filter('wp_check_filetype_and_ext', 'fix_svg_mime_type', 10, 5);
function fix_svg_mime_type($data, $file, $filename, $mimes, $real_mime = '')
{
if (version_compare($GLOBALS['wp_version'], '5.1.0', '>='))
$dosvg = in_array($real_mime, ['image/svg', 'image/svg+xml']);
else
$dosvg = ('.svg' === strtolower(substr($filename, -4)));
if ($dosvg) {
if (current_user_can('manage_options')) {
$data['ext'] = 'svg';
$data['type'] = 'image/svg+xml';
} else {
$data['ext'] = $type_and_ext['type'] = false;
}
}
return $data;
}Если всё сделали верно, и обновили страницу, то на этот раз вы сможете загрузить SVG через библиотеку файлов.
Теперь ещё можно исправить получение ширины и высоты svg изображений:
add_filter('wp_get_attachment_image_src', 'fix_wp_get_attachment_image_svg', 10, 4);
function fix_wp_get_attachment_image_svg($image, $attachment_id, $size, $icon)
{
if (is_array($image) && preg_match('/\.svg$/i', $image[0]) && $image[1] <= 1) {
if (is_array($size)) {
$image[1] = $size[0];
$image[2] = $size[1];
} elseif (($xml = simplexml_load_file($image[0])) !== false) {
$attr = $xml->attributes();
$viewbox = explode(' ', $attr->viewBox);
$image[1] = isset($attr->width) && preg_match('/\d+/', $attr->width, $value) ? (int) $value[0] : (count($viewbox) == 4 ? (int) $viewbox[2] : null);
$image[2] = isset($attr->height) && preg_match('/\d+/', $attr->height, $value) ? (int) $value[0] : (count($viewbox) == 4 ? (int) $viewbox[3] : null);
} else {
$image[1] = $image[2] = null;
}
}
return $image;
}Итак, мы сегодня научились разрешать загрузку SVG, чтобы иметь возможность добавления SVG изображений через библиотеку файлов.
Надеюсь, вам понравилась данная информация. Если вам интересна тема web-разработки, то можете следить за выходом новых статей в Telegram.
Поделиться с друзьями: