Автоматическая оптимизация изображений в WordPress при загрузке

Оптимизация изображений — одна из ключевых задач для ускорения загрузки сайта и улучшения его SEO-показателей. В WordPress это часто делается вручную или с помощью плагинов, но можно настроить автоматическую оптимизацию, которая будет срабатывать при загрузке файлов в медиабиблиотеку. В этой статье разберём, как именно это реализовать с помощью кода и плагинов, рассмотрим примеры и полезные советы.

Почему важна автоматическая оптимизация изображений в WordPress

Большинство пользователей загружает изображения в оригинальном размере и качестве, что может значительно замедлять работу сайта. Автоматическая оптимизация позволяет:

• Уменьшить вес файлов без потери качества;
• Ускорить загрузку страниц;
• Снизить нагрузку на сервер и трафик;
• Повысить оценки в Google PageSpeed и других аналитических сервисах.

Ручное сжатие подходит для небольшого количества файлов, но при большом потоке контента автоматизация — необходимость.

Плагины для автоматической оптимизации изображений при загрузке

Для автоматической оптимизации изображений в WordPress существует множество плагинов. Вот несколько популярных и надёжных вариантов:

1. Smush

Плагин позволяет автоматически сжимать и оптимизировать изображения без потери качества. Работает с JPEG, PNG и GIF. В бесплатной версии доступна базовая оптимизация, в Pro — расширенные функции.

2. Imagify

Поддерживает автоматическую оптимизацию и конвертацию в формат WebP. Имеет удобный интерфейс и интеграцию с медиабиблиотекой.

3. ShortPixel

Обеспечивает мощное сжатие с минимальным качеством потерь. Поддерживает оптимизацию при загрузке, пакетную обработку и CDN.

Кроме того, на WPSHOP.ru вы найдёте плагины с дополнительными возможностями оптимизации изображений.

Как реализовать автоматическую оптимизацию изображений программно

Если вы хотите иметь полный контроль или не использовать сторонние решения, можно написать свой код, который будет оптимизировать изображения в момент их загрузки.

Хук для перехвата загрузки изображения

WordPress предоставляет хук wp_handle_upload, который срабатывает после загрузки файла. На его основе можно добавить функцию оптимизации.

add_filter('wp_handle_upload', 'wpfix_optimize_image_on_upload');

function wpfix_optimize_image_on_upload($upload) {
    $file = $upload['file'];
    $mime = mime_content_type($file);

    if (strpos($mime, 'image') !== false) {
        // Здесь вызов оптимизации
        wpfix_optimize_image($file);
    }

    return $upload;
}

Функция оптимизации изображения

В этом примере используем PHP-библиотеку Imagick для сжатия JPEG и PNG:

function wpfix_optimize_image($file) {
    if (!extension_loaded('imagick')) {
        return;
    }
    
    $image = new Imagick($file);
    $format = strtolower($image->getImageFormat());

    if (in_array($format, ['jpeg', 'jpg'])) {
        $image->setImageCompression(Imagick::COMPRESSION_JPEG);
        $image->setImageCompressionQuality(85); // качество 85%
        $image->stripImage(); // убрать метаданные
        $image->writeImage($file);
    } elseif ($format === 'png') {
        $image->setImageCompressionQuality(85);
        $image->stripImage();
        $image->writeImage($file);
    }

    $image->clear();
    $image->destroy();
}

Этот код уменьшит вес изображения, сохранив приемлемое качество. Для работы Imagick должен быть установлен на сервере.

Оптимизация изображений с конвертацией в WebP

Новый формат WebP значительно сокращает размер изображений при сохранении качества. Можно добавить конвертацию в WebP в момент загрузки:

function wpfix_convert_to_webp($file) {
    if (!extension_loaded('imagick')) {
        return;
    }

    $image = new Imagick($file);
    $webpFile = preg_replace('/\.(jpg|jpeg|png)$/i', '.webp', $file);
    
    $image->setImageFormat('webp');
    $image->setImageCompressionQuality(80);
    $image->writeImage($webpFile);

    $image->clear();
    $image->destroy();
}

add_filter('wp_handle_upload', function($upload) {
    $file = $upload['file'];
    $mime = mime_content_type($file);

    if (strpos($mime, 'image') !== false) {
        wpfix_convert_to_webp($file);
    }

    return $upload;
});

После такой обработки рядом с исходным файлом появится версия в WebP. Для вывода WebP на сайте можно использовать плагин или дополнительный код, который будет отдавать WebP браузерам, поддерживающим этот формат.

Как интегрировать автоматическую оптимизацию с плагинами WPSHOP

Если вы используете темы и плагины с WPSHOP.ru, например темы Root или плагины Clearfy Pro, можно дополнительно ускорить загрузку и оптимизацию изображений за счёт их встроенных настроек и возможностей.

Clearfy Pro, например, позволяет отключать загрузку неиспользуемых ресурсов и оптимизировать фронтенд, что хорошо сочетается с оптимизированными изображениями.

Рекомендуется протестировать совместимость автоматической оптимизации с используемыми плагинами, чтобы не было конфликтов.

Практические советы по автоматической оптимизации изображений

• Всегда делайте резервные копии перед массовой оптимизацией.
• Для больших сайтов рекомендуется использовать сторонние сервисы (API) оптимизации, чтобы снизить нагрузку на сервер.
• Проверяйте качество изображений после оптимизации, чтобы не было чрезмерной потери деталей.
• Используйте lazy load для отложенной загрузки, например, через встроенный в WordPress атрибут loading="lazy" или плагины.
• Регулярно обновляйте плагины и темы для поддержки современных форматов изображений и оптимизаций.

Заключение

Автоматическая оптимизация изображений при загрузке — важный элемент технической поддержки WordPress-сайта. Используя комбинацию плагинов и собственного кода, вы можете значительно ускорить работу сайта и улучшить пользовательский опыт. Примеры кода и рекомендации, приведённые в статье, помогут вам начать внедрять эти решения прямо сейчас.