В WordPress по умолчанию при загрузке изображений создаются несколько копий с разными размерами: миниатюра, средний, большой и оригинал. Однако иногда стандартные настройки размеров не подходят под дизайн сайта, и возникает необходимость изменить размеры изображений без установки дополнительных плагинов. В этой статье подробно разберём, как это сделать правильно, с примерами кода и советами по оптимизации.
Почему важно контролировать размеры изображений в WordPress
Правильные размеры изображений позволяют улучшить скорость загрузки сайта, уменьшить нагрузку на сервер и повысить качество отображения контента. Если изображения слишком большие, страница будет загружаться дольше, а если маленькие — качество ухудшится, особенно на ретина-экранах.
WordPress автоматически создаёт копии изображений заданных размеров, но их параметры можно настроить под свои задачи. Изменение размера изображений вручную через код позволяет гибко управлять медиафайлами без лишних плагинов.
Настройка размеров изображений через functions.php
Для начала нужно задать новые размеры для стандартных форматов изображений. Это делается с помощью функции set_post_thumbnail_size() и add_image_size(). Например, добавим кастомный размер:
function wpweb_set_custom_image_sizes() {
set_post_thumbnail_size( 150, 150, true ); // миниатюра
add_image_size( 'wpweb-custom-large', 800, 600, true ); // кастомный размер с обрезкой
}
add_action( 'after_setup_theme', 'wpweb_set_custom_image_sizes' );Здесь set_post_thumbnail_size меняет размер миниатюры, а add_image_size добавляет новый размер с названием wpweb-custom-large. Параметры — ширина, высота, и обрезка (true — жёсткая обрезка).
Как применить новые размеры в шаблонах
Чтобы использовать новый размер изображения в шаблонах, вызываем функцию the_post_thumbnail() с заданным именем размера:
if ( has_post_thumbnail() ) {
the_post_thumbnail( 'wpweb-custom-large' );
}Это выведет изображение с размерами 800x600 пикселей, обрезанное по центру.
Как изменить размеры изображений, уже загруженных в библиотеку
Изменение кода не повлияет на уже загруженные изображения — для них нужно пересоздать миниатюры. Для этого можно использовать встроенную команду WP-CLI:
wp media regenerate --yesЕсли WP-CLI недоступен, можно воспользоваться плагином Regenerate Thumbnails. Хотя мы избегаем плагинов, в некоторых случаях это самый простой способ обновить размеры.
Удаление ненужных размеров изображений для оптимизации
WordPress создаёт много дополнительных размеров, которые не всегда нужны. Их можно отключить, удалив соответствующие размеры:
function wpweb_remove_default_image_sizes( $sizes ) {
unset( $sizes['medium_large'] );
unset( $sizes['large'] );
return $sizes;
}
add_filter( 'intermediate_image_sizes_advanced', 'wpweb_remove_default_image_sizes' );Это уменьшит количество копий изображений при загрузке и сэкономит место на сервере.
Пример функции для изменения и удаления размеров
function wpweb_modify_image_sizes() {
// Устанавливаем свои размеры
set_post_thumbnail_size( 120, 120, true );
add_image_size( 'wpweb-medium', 400, 300, false );
}
add_action( 'after_setup_theme', 'wpweb_modify_image_sizes' );
function wpweb_disable_extra_sizes( $sizes ) {
unset( $sizes['medium_large'] );
unset( $sizes['1536x1536'] );
unset( $sizes['2048x2048'] );
return $sizes;
}
add_filter( 'intermediate_image_sizes_advanced', 'wpweb_disable_extra_sizes' );Советы по оптимизации изображений без плагинов
1. Используйте функции PHP GD или Imagick для сжатия изображений при загрузке.
2. Задавайте правильные размеры для <img> в HTML, чтобы браузер подгружал оптимальный вариант.
3. Внедрите lazy loading — в WordPress 5.5+ он включён по умолчанию через атрибут loading="lazy".
Пример добавления lazy loading к миниатюрам:
function wpweb_add_lazy_loading( $attr ) {
$attr['loading'] = 'lazy';
return $attr;
}
add_filter( 'wp_get_attachment_image_attributes', 'wpweb_add_lazy_loading' );Использование плагина Clearfy для управления размерами изображений
Если требуется более удобный интерфейс, можно использовать плагин Clearfy. Он позволяет отключать ненужные размеры и оптимизировать загрузку без ручного кода.
Но если вы хотите минимизировать количество плагинов, описанные выше решения отлично справятся с задачей.
Итог
Изменять размеры изображений в WordPress без плагинов — реально и удобно. Главное — правильно задать новые размеры в functions.php, удалить ненужные размеры и пересоздать миниатюры для старых загрузок. Это улучшит производительность сайта и качество отображения контента. Используйте приведённые в статье примеры кода, чтобы быстро и безопасно управлять изображениями.