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

Оптимизация изображений – важный этап ускорения загрузки сайта и повышения его позиций в поисковой выдаче. Один из эффективных…


Практическое руководство

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

Как работает конвертация изображений в WebP при загрузке?

Для автоматической конвертации используется фильтр wp_handle_upload, который перехватывает загружаемые изображения и преобразует их в формат WebP с помощью библиотек ImageMagick или GD.

Основные шаги работы кода:

  • Проверка типа файла (JPEG, PNG, GIF);
  • Использование wp_get_image_editor() для редактирования;
  • Сохранение изображения в формате WebP;
  • Заменяется оригинальный путь и URL на WebP-файл;
  • Оригинал (JPEG/PNG/GIF) удаляется.

Собственно сам код который это делает.

add_filter( 'wp_handle_upload', 'wpturbo_handle_upload_convert_to_webp' );

function wpturbo_handle_upload_convert_to_webp( $upload ) {
if ( $upload['type'] == 'image/jpeg' || $upload['type'] == 'image/png' || $upload['type'] == 'image/gif' ) {
$file_path = $upload['file'];

// Check if ImageMagick or GD is available
if ( extension_loaded( 'imagick' ) || extension_loaded( 'gd' ) ) {
$image_editor = wp_get_image_editor( $file_path );
if ( ! is_wp_error( $image_editor ) ) {
$file_info = pathinfo( $file_path );
$dirname = $file_info['dirname'];
$filename = $file_info['filename'];

// Create a new file path for the WebP image
$new_file_path = $dirname . '/' . $filename . '.webp';

// Attempt to save the image in WebP format
$saved_image = $image_editor->save( $new_file_path, 'image/webp' );
if ( ! is_wp_error( $saved_image ) && file_exists( $saved_image['path'] ) ) {
// Success: replace the uploaded image with the WebP image
$upload['file'] = $saved_image['path'];
$upload['url'] = str_replace( basename( $upload['url'] ), basename( $saved_image['path'] ), $upload['url'] );
$upload['type'] = 'image/webp';

// Optionally remove the original image
@unlink( $file_path );
}
}
}
}

return $upload;
}

Преимущества использования WebP на сайте

WebP — современный формат изображений от Google, обеспечивающий более высокую степень сжатия без потери качества.

Преимущества:

  • Уменьшение размера файлов на 25-35%;
  • Быстрая загрузка страниц;
  • Улучшение показателей Core Web Vitals;
  • Поддержка анимации (альтернатива GIF);
  • SEO-эффект: ускорение сайта способствует росту позиций.

Почему стоит реализовать автоматическую конвертацию?

Конвертация вручную отнимает много времени. Данный подход:

  • Работает на уровне загрузки в админке WordPress;
  • Не требует дополнительных плагинов;
  • Поддерживает базовые форматы (JPEG, PNG, GIF);
  • Совместим с популярными библиотеками обработки изображений.

Технические требования для работы

ТребованиеОписание
PHP расширениеimagick или gd
WordPress функцияwp_get_image_editor
Поддержка хостингаВозможность изменять файлы (chmod 755)

Как внедрить на свой сайт

  • Откройте файл functions.php вашей темы;
image
image
  • Вставьте предложенный код;
image
  • Убедитесь, что на сервере активирован ImageMagick или GD;
  • Загрузите изображение через админку WordPress и проверьте результат.

Заключение

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

Почему стоит выбрать меня

Индивидуальный подход

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

Внимание к деталям

Каждый элемент дизайна продуман до мелочей, чтобы ваш сайт был не только красивым, но и удобным

Соблюдение сроков

Я понимаю, как важно время для вашего бизнеса, поэтому всегда соблюдаю дедлайны

Полный цикл услуг

Технические задачи выполняю лично. По согласованию подключаю партнёров — дизайнеров и SEO-специалиста. Оцениваю объём и сроки до начала работ, остаюсь вашим основным контактным лицом.

Опыт работы с WordPress

Основную техническую работу выполняю лично: разрабатываю и дорабатываю WordPress, Elementor и WooCommerce. При необходимости подключаю партнёров по дизайну и SEO. До начала работы согласую объём, стоимость и сроки.

Прозрачность и честность

Я работаю открыто и честно. Вы всегда будете в курсе этапов работы и сможете вносить правки на любом этапе

Работаю лично, подключаю партнёров

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

Подробнее обо мне →

Обсудить проект

картинка

Отвечу на ваши вопросы

  • Сроки и стоимость выполнения работ;
  • Что влияет на стоимость;
  • Как проходит каждый этап;
  • Возможно ли разбить оплату на части;
  • На каких платформах разрабатываются сайты;
  • Возможны ли доработки после запуска

Выберите удобный способ для связи: