WordPress: как исправить отсутствие изображения в превью и постах

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

Почему в WordPress не показываются изображения превью? Основные причины

Отсутствие изображений в превью записей может быть связано с несколькими факторами. Рассмотрим самые распространённые:

• Не установлены миниатюры для записей. Даже если вы добавили картинки в пост, для отображения в списках нужен специальный размер — миниатюра записи (featured image). Если её нет, картинка не покажется.
• В теме не вызвана функция поддержки миниатюр. В functions.php вашего шаблона должна быть строка add_theme_support('post-thumbnails');. Без неё миниатюры не будут работать.
• В шаблоне вывода записей нет вызова функции для показа миниатюр. Например, в файлах index.php, archive.php, или в шаблонах блоков отсутствует вызов the_post_thumbnail().
• Проблемы с размерами изображений. Если миниатюра установлена, но изображение не генерируется нужного размера из-за отсутствия соответствующих размеров в настройках темы или плагинов.
• Кэширование и оптимизация. Плагины кеширования или оптимизации изображений иногда препятствуют правильному отображению картинок.

Добавляем поддержку миниатюр в тему WordPress

Для начала убедимся, что в вашей теме подключена поддержка миниатюр. Откройте файл functions.php и добавьте следующий код, если его там нет:

function wpsnippets_add_theme_support() {
    add_theme_support('post-thumbnails');
    // Можно добавить дополнительные размеры миниатюр
    add_image_size('wpsnippets-thumb', 300, 200, true); // обрезка по центру
}
add_action('after_setup_theme', 'wpsnippets_add_theme_support');

Эта функция активирует поддержку миниатюр и добавляет новый размер wpsnippets-thumb, который можно использовать для вывода изображений нужного формата.

Вывод миниатюры в шаблонах записей

Чтобы вывести миниатюру в списке записей или на странице поста, убедитесь, что в нужном месте шаблона есть вызов функции:

if (has_post_thumbnail()) {
    the_post_thumbnail('wpsnippets-thumb', ['alt' => get_the_title(), 'class' => 'wpsnippets-post-thumb']);
} else {
    // Можно вывести заглушку, если миниатюры нет
    echo '<img src="' . get_template_directory_uri() . '/images/no-image.png" alt="Нет изображения" class="wpsnippets-post-thumb" />';
}

Этот код проверяет наличие миниатюры и выводит её в нужном размере. Если миниатюра отсутствует, выводит запасное изображение-заглушку.

Особенности для Gutenberg и блоков

Если вы используете редактор блоков Gutenberg, миниатюры также можно выводить через блоки или вставлять в шаблоны блоков. Для тем, поддерживающих Full Site Editing, нужно убедиться, что в шаблонах используется блок Post Featured Image.

Проверка и регенерация миниатюр

Если изображения загружены, а миниатюры не отображаются или выглядят плохо, возможно, нужно пересоздать миниатюры. Для этого используйте популярный плагин Regenerate Thumbnails. Он позволяет быстро восстановить все размеры изображений.

Использование плагинов для улучшения отображения изображений

Для расширенного управления миниатюрами и автоматизации можно использовать плагины. Например:

• Clearfy Pro — оптимизирует работу сайта, в том числе управление изображениями и кэширование. Подробнее на wpshop.ru.
• ABC Pagination — помогает с пагинацией и выводом постов, где можно настроить отображение миниатюр.
• WPStories — если вы хотите вывести изображения в формате историй (stories), этот плагин отлично подходит.

Решение проблемы с кэшированием изображений в WordPress

Иногда изображения не отображаются из-за кэширования на стороне сервера, браузера или CDN. Для устранения этого:

• Очистите кэш плагинов, например, WP Rocket, W3 Total Cache или Clearfy Pro.
• Отключите временно кэширование, чтобы проверить, исчезает ли проблема.
• Проверьте правильность URL изображений. Иногда при смене домена или протокола (HTTP/HTTPS) ссылки ломаются.
• Используйте инструменты разработчика браузера (F12), чтобы проверить ошибки загрузки картинок.

Пример функции для автоматической подстановки заглушки, если миниатюры нет

Добавьте этот код в functions.php, чтобы автоматически выводить запасное изображение, когда у записи нет миниатюры:

function wpsnippets_get_post_thumbnail_or_placeholder($post_id, $size = 'wpsnippets-thumb') {
    if (has_post_thumbnail($post_id)) {
        return get_the_post_thumbnail($post_id, $size, ['alt' => get_the_title($post_id)]);
    } else {
        $placeholder_url = get_template_directory_uri() . '/images/no-image.png';
        return '<img src="' . esc_url($placeholder_url) . '" alt="Нет изображения" class="wpsnippets-post-thumb" />';
    }
}

// Использование в шаблоне
echo wpsnippets_get_post_thumbnail_or_placeholder(get_the_ID());

Заключение по теме

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

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