Миниатюры (featured images) — важный элемент оформления постов и страниц в WordPress. Они привлекают внимание, улучшают пользовательский опыт и помогают в SEO. Но ручное создание и управление миниатюрами может занять много времени, особенно если у вас большой сайт с тысячами записей. В этой статье разберем, как автоматизировать процесс создания и управления миниатюрами, используя плагины и код, чтобы сэкономить время и обеспечить единообразный стиль.
Почему важно автоматизировать создание миниатюр в WordPress
Автоматизация миниатюр помогает решить несколько задач:
- Автоматически создавать подходящие размеры изображений для разных целей — ленты, виджеты, карусели и т.д.
- Обновлять миниатюры при изменении настроек темы без необходимости вручную пересоздавать их.
- Экономить время при загрузке большого объема контента.
- Избегать ошибок и несоответствий в размере и качестве миниатюр.
Рассмотрим, как это реализовать на практике.
Настройка пользовательских размеров миниатюр в functions.php
WordPress по умолчанию создает несколько размеров изображений: thumbnail, medium, large. Но часто требуется добавить свои размеры под дизайн сайта.
Для этого в файле functions.php темы добавьте следующий код:
function wpdownload_add_custom_image_sizes() {
add_image_size('wpdownload-thumb-small', 150, 150, true); // Кроп по центру
add_image_size('wpdownload-thumb-medium', 300, 200, true); // Кроп по центру
add_image_size('wpdownload-thumb-large', 600, 400, false); // Масштабирование без обрезки
}
add_action('after_setup_theme', 'wpdownload_add_custom_image_sizes');Этот код добавит три новых размера миниатюр с разными параметрами обрезки. Параметр true означает жесткую обрезку, false — масштабирование по пропорциям.
Чтобы использовать эти размеры в шаблонах, вызовите:
the_post_thumbnail('wpdownload-thumb-small');или аналогично для других размеров.
Автоматическое назначение миниатюры из первого изображения в контенте
Если в записи не задана миниатюра, можно автоматически установить её из первого изображения внутри контента. Это полезно, когда редакторы забывают задавать featured image.
Добавьте в functions.php такой код:
function wpdownload_set_post_thumbnail_from_first_image($post_id) {
if (has_post_thumbnail($post_id)) {
return;
}
$post = get_post($post_id);
preg_match_all('/<img.+?src=["'](.+?)["'].*?>/i', $post->post_content, $matches);
if (!empty($matches[1][0])) {
$image_url = $matches[1][0];
$upload_dir = wp_upload_dir();
$image_path = str_replace($upload_dir['baseurl'], $upload_dir['basedir'], $image_url);
if (file_exists($image_path)) {
$attachment_id = wpdownload_media_sideload_image_to_media($image_url, $post_id);
if ($attachment_id) {
set_post_thumbnail($post_id, $attachment_id);
}
}
}
}
add_action('save_post', 'wpdownload_set_post_thumbnail_from_first_image');
function wpdownload_media_sideload_image_to_media($file, $post_id) {
require_once(ABSPATH . 'wp-admin/includes/image.php');
require_once(ABSPATH . 'wp-admin/includes/file.php');
require_once(ABSPATH . 'wp-admin/includes/media.php');
$media = media_sideload_image($file, $post_id, null, 'id');
if (is_wp_error($media)) {
return false;
}
return $media;
}Этот код при сохранении записи проверит наличие миниатюры, и если её нет, попробует выставить первую картинку из контента как миниатюру.
Плагины для автоматизации миниатюр
Если вы не хотите писать код, можно воспользоваться готовыми плагинами:
- Auto Post Thumbnail — автоматически генерирует миниатюру из первого изображения в записи.
- Regenerate Thumbnails — позволяет массово пересоздать все миниатюры после изменения размеров.
- Simple Image Sizes — удобный интерфейс для управления размерами изображений без кода.
Все эти плагины доступны в репозитории WordPress и легко настраиваются.
Пример использования Regenerate Thumbnails с WPDownload
После добавления новых размеров миниатюр в коде, чтобы применить их к ранее загруженным изображениям, нужно пересоздать миниатюры. Для этого установите и активируйте плагин Regenerate Thumbnails. Затем перейдите в Инструменты - Regenerate Thumbnails и запустите процесс.
Если хотите автоматизировать этот процесс, можно запустить регенерацию программно, используя следующий пример:
function wpdownload_auto_regenerate_thumbnails() {
if (class_exists('RegenerateThumbnails')) {
$regenerate = new RegenerateThumbnails();
$regenerate->regenerate_all();
}
}
// Вызовите эту функцию по крону или вручную
// wpdownload_auto_regenerate_thumbnails();Оптимизация работы с миниатюрами: советы и лучшие практики
Чтобы процесс работы с миниатюрами был максимально эффективным, учтите следующие рекомендации:
- Используйте WebP — современный формат сжатия изображений. Плагин Clearfy Pro может помочь с конвертацией и оптимизацией.
- Минимизируйте количество размеров — не создавайте слишком много вариаций, чтобы не нагружать сервер и базу данных.
- Настраивайте обрезку — выбирайте параметры обрезки в зависимости от дизайна, чтобы миниатюры выглядели аккуратно.
- Используйте кеширование — для ускорения загрузки страниц с большим количеством миниатюр.
Автоматизация добавления миниатюр в редактор Gutenberg
Для лучшей работы с миниатюрами в редакторе Gutenberg можно добавить пользовательский блок или расширить стандартный блок изображения, чтобы автоматически предлагать размеры с нужной обрезкой. Это требует глубокого знакомства с React и JavaScript, но значительно улучшит UX.
Пример простого добавления в functions.php фильтра для отображения новых размеров в медиа-библиотеке:
function wpdownload_custom_sizes_names($sizes) {
return array_merge($sizes, [
'wpdownload-thumb-small' => __('WPDownload Small Thumb'),
'wpdownload-thumb-medium' => __('WPDownload Medium Thumb'),
'wpdownload-thumb-large' => __('WPDownload Large Thumb'),
]);
}
add_filter('image_size_names_choose', 'wpdownload_custom_sizes_names');Так редакторы смогут выбирать нужный размер при вставке изображений в контент.
Выводы
Автоматизация создания и управления миниатюрами в WordPress — важный шаг для повышения производительности и удобства работы с сайтом. Используя добавление кастомных размеров, автоматическое назначение миниатюр из контента, а также проверенные плагины, вы сможете существенно упростить рутинные задачи и сделать свой сайт более привлекательным и быстрым.