Как на WordPress-сайте в качестве миниатюры вывести первую картинку из записи?

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

Как в WordPress установить первое добавленное изображение в качестве миниатюры?

Рассмотрим несколько способов, позволяющих решить задачу.

Способ 1. Плагин Auto Post Thumbnail

Бесплатный плагин Auto Post Thumbnail позволяет генерировать и устанавливать миниатюры из первого добавленного изображения в тексте для постов и страниц, включая записи пользовательских типов. Если первое изображение не найдено, плагин автоматически продолжит поиск до тех пор, пока в итоге миниатюра не будет создана.

Первым делом его нужно установить и активировать. Следует отметить, что плагин Auto Post Thumbnail “умеет” выводить в качестве миниатюры первое добавленное фото не только для новых статей, но также и для старых. Для новых публикаций он делает это в автоматическом режиме. Чтобы это сработало для уже опубликованных записей, необходимо активировать эту опцию. Поэтому нужно перейти в админ-раздел Настройки -> Auto Post Thumbnail и нажать кнопку Generate Thumbnails.

Страница настроек плагина Auto Post Thumbnail

В итоге плагин проверит все публикации и применит к ним свои алгоритмы.

Страница настроек плагина Auto Post Thumbnail

Следует отметить, что плагин не сработает, если в записи вообще не добавлена ни одна картинка.

Способ 2. Вручную

Этот способ предусматривает внесение специального PHP-кода в файл Вашей активной темы functions.php.

Если Вы не знаете, как редактировать functions.php, то в этом случае Вам поможет плагин ProFunctions.

Итак, в самый его конец необходимо добавить следующие строки:

function wpschool_first_post_img() {
    global $post, $posts;
    $first_image = '';
    ob_start();
    ob_end_clean();
    $output = preg_match_all( '/<img.+src=[\'"]([^\'"]+)[\'"].*>/i', $post->post_content, $matches );
    $first_image = $matches[1][0];
    if( empty( $first_image ) ){
        $first_image = "/wp-content/themes/НАЗВАНИЕ_ВАШЕЙ_ТЕМЫ/images/noimages.jpg";
    }
    return $first_image;
}

В коде нужно сделать некоторые изменения. Так, в строке $first_image = “/wp-content/themes/НАЗВАНИЕ_ВАШЕЙ_ТЕМЫ/images/noimages.jpg”; нужно указать полный путь к изображению, которое будет установлено как миниатюра в случае отсутствия изображений в публикации. Эту картинку нужно предварительно создать.

Чтобы приведенная функция была выполнена, ее нужно вызвать. Это необходимо сделать в тех файлах Вашей темы, где собственно и выводится на экран список записей сайта. Обычно это index.php, content.php, archive.php, category.php, single.php и пр. Вывод нашей функции должен осуществляться после определения цикла:

<?php if(have_posts()) : ?> <?php while(have_posts()) : the_post(); ?>

В итоге подключение функции будет иметь следующий вид:

<a href="<?php the_permalink() ?>" title="<?php the_title(); ?>">
<img src="<?php echo wpschool_first_post_img() ?>" alt="<?php the_title(); ?>" />
</a>

Теперь все записи в выведенном списке будут иметь кликабельные миниатюры, ведущие на страницу публикации. Исключением является вывод некликабельной миниатюры в самой записи. Для этого в файле single.php нужно (после определения цикла) вставить следующую строку:

<img src="<?php echo wpschool_first_post_img() ?>" alt="<?php the_title(); ?>" />

В итоге на Вашем сайте все записи будут содержать миниатюры.

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

Курс WordPress-разработчик
Если Вам понравилась статья — поделитесь с друзьями
Михаил Петров
Привет! Меня зовут Михаил Петров. Я копирайтер и занимаюсь этим с 2013 года. Скрупулезность и ответственность - моя фишка! Не могу делать как попало и добиваюсь, чтоб заказчик сказал минимум “неплохо”. За все время своей работы пришлось написать и отредактировать немало разной “текстовухи”, включая SEO-тексты, отзывы и прочую чушь. На сегодняшний день специализируюсь на написании информационных статей и руководств технического направления. Вижу смысл и светлое будущее в текстах для людей, а не для машин.
Обсуждение: 2
  1. Сурен

    здравствуйте, у меня шаблон generatepress и ваша инструкция вовсе не подходит к шаблону. выскакивает всякие ошибки. А проблема у меня в следующем:
    На моем сайте rianovost.ru картинки выводятся, но только те, которые предварительно загружаю в время создания записи это и отнимает время, и неудобно. Дело в том, что я пишу в ворде, оттуда через специальный плагин загружаю на сайт, в том числе картинки, которые я предварительно загрузил в ворд во время написания поста. Это очень удобно, в ворде много функции. И в самой записи все загружается один в дин. то есть пормахы на стороне врда или плагина исключается . Но на главной странице записи попадают, а вот картинки нет, по этому мне нужно, что выводился первая картинка из записи . Но это еще не все! Есть и другая проблема! Те картинки, которые выводились (Выводятся те картинки, которые предварительно загружаю в библиотеку) у них в постах присутствует описание , это описание по формату (шрифт,цвет, курсив и размер) но вот на главной странице подпись выводилась как обычный текст. И это жутко не красиво! И не только на главной , еще и когда поделюсь в соцсетях, вместе с заголовком “клеится” caption изображения! Подскажите пожалуйста, как делать, что предлагайте?

  2. Сурен

    Здравствуйте! У меня childtheme тема generatepress и там при добавлении записи есть возможность добавить изображение и это изображение появляется в анонсах. Но не всегда удобно добавить изображение таким образом, во первых это долго и во вторых перегружает хостинг. По этому я в записях вставлю изображение из других сайтов (copypaste),и дальше пишу свой текст, и когда сохраняю запись , в самой записи все отлично , но вывод записи на главной странице получается без изображении, но дело в том, что некоторые записи таким образом выводятся на главной с изображениями, а некоторые без изображении . Я не могу понять, в чем причина такой поведении , если отключена функция вывода изображении записи, тогда никакое изображение не должны выводится, но они выводятся на своё усмотрение, некоторые не выводятся, а некоторые выводятся на главной. Прошу подсказать, в чем дело?
    Например изображение этой записи не вышло на главную страницу https://www.rianovost.ru/belarus-buys-first-party-oil..
    А изображение этой записи вышло на главной
    https://www.rianovost.ru/sostoyalsya-telefonnyy-razgo..
    Такая же ситуация и с Open graph при “поделится” на соцсетях то выводится изображение, то нет, когда как)))
    В обеих случаях изображение не загрузил по форме “добавить изображение записи” А просто вставил в запись из других сайтов (copypaste)

Задать вопрос