Как разрешить поддержку SVG в WordPress

Последнее обновление Июл 12, 2021

Содержание

Вы хотите загрузить изображения SVG на свой сайт WordPress? WordPress по умолчанию не позволяет загружать файлы SVG через загрузчик мультимедиа. В этой статье мы покажем, как разрешить загрузку изображения SVG в WordPress.

SVG (масштабируемая векторная графика) определяет векторную графику в формате XML. Другими словами, SVG определяет графику в формате XML. Графика файлов SVG НЕ теряет качества при увеличении или изменении размера. Кроме того, размер файла SVG невелик, и поэтому они популярны в настоящее время.

Что касается WordPress, если вы попытаетесь загрузить изображение SVG из загрузчика мультимедиа, вы получите сообщение об ошибке типа «Извините, этот тип файла не разрешен по соображениям безопасности».

Это связано с тем, что тип MIME SVG не добавляется в типы MIME по умолчанию, разрешенные для загрузки в WordPress. Чтобы получить список всех типов MIME по умолчанию, можно использовать метод get_allowed_mime_types(). Эта функция возвращает массив типов MIME.

При этом давайте посмотрим, как добавить поддержку WordPress для файла SVG.

Разрешить загрузку файла SVG

Чтобы добавить поддержку изображения SVG, мы используем фильтр, upload_mimesкоторый позволяет изменять список допустимых расширений файлов WordPress. Расширение файлов SVG – image / svg + xml. Итак, вам нужно разместить приведенный ниже код в файле functions.php.

function add_svg_mime_types($mimes) {
    $mimes['svg'] = 'image/svg+xml';
    return $mimes;
}
add_filter('upload_mimes', 'add_svg_mime_types');

Используя upload_mimesфильтр, мы также можем ограничить конкретный формат файла для загрузки в WordPress. Допустим, мы не хотим разрешать файлы mp4. В этом случае мы должны добавить приведенный ниже код в файл functions.php.

function remove_mime_types($mimes) {
    unset($mimes['video/mp4']);
}
add_filter('upload_mimes', 'remove_mime_types');

Итак, добавив приведенный выше небольшой фрагмент кода, вы разрешите загружать изображения SVG в медиа-библиотеку. Однако после загрузки SVG, если вы перейдете на страницу со списком, вы не увидите эскиз своего файла SVG.

Чтобы отобразить миниатюру SVG на странице списка, нам нужно добавить правило CSS, которое может подключаться к панели инструментов WordPress.

function admin_custom_css() {
    echo "<style>table.media .column-title .media-icon img[src='.svg']{
        width: 100%;
        height: auto;
    }</style>";
}
 
add_action( 'admin_head', 'admin_custom_css' );

После добавления приведенного выше кода в файл functions.php вы увидите эскиз SVG.

Статьи по Теме

Источник записи: artisansweb.net