WordPress как на ладони
Недорогой хостинг для сайтов на WordPress: wordpress.jino.ru Получай пассивный доход от сайта с помощью браузерных PUSH уведомлений

Миниатюры и картинки постов

Начал изучать WordPress. Сверстал тему оформления на bootstrap 4.Сейчас "воюю" с выводом постов на главной,в категориях и архивах.

Чего пытаюсь добиться:

В functions.php добавил

function history_default_thumbnail() {
	if ( has_post_thumbnail() ):
		the_post_thumbnail();
	else:
		print '<img class="img-fluid" src="'. get_bloginfo('template_directory'). '/images/no_image.jpg' . '" alt="no image" />';
	endif;
}

В основной цикл вставил вызов этой функции

<?php history_default_thumbnail(); ?>

Эта миниатюра выводится в любом случае,есть картинка в статье или нету,плюс к этому выводится и миниатюра и загруженная картинка.
Как решить,без плагинов:

  1. Если картинки в статье есть,то на главной,в категориях и архивах выводится загруженная картинка вместо миниатюры.
  2. Если картинки отсутствуют,то выводится миниатюра по-умолчанию.
  3. Убрать одновременный вывод и миниатюры и картинки.

В итоге получить такой вывод:

Признаюсь что в рнр я не очень и движок последний раз юзал во 2-й версии.

0
Александр
месяц назад
  • 0
    Andrew378 america-xix.ru

    Проверяйте наличие вложений-изображений у страницы (исключая при запросе картинку, установленную в качестве миниатюры). Далее работайте с ID вложения.

    Что-то типа:

    $attached_media = get_posts (array (
    							'post_type' => 'attachment',
    							'posts_per_page' => 1,
    							'post_mime_type' => 'image',
    							'post_parent' => get_the_ID(),
    							'exclude'     => get_post_thumbnail_id(),
    							));
    
    $attached_media = array_shift ($attached_media);
    
    $image =  wp_get_attachment_image( $attached_media->ID, *нужный размер*, $icon, $attr );

    Функция wp_get_attachment_image получит HTML код картинки в теге img, который выводите там, где нужно и когда нужно.

    Александр месяц назад

    Я так понимаю что это надо добавить сюда

    function history_default_thumbnail() {
    	if ( has_post_thumbnail() ):
    		the_post_thumbnail();
    	else:
    		print '<img class="img-fluid" src="'. get_bloginfo('template_directory'). '/images/no_image.jpg' . '" alt="no image" />';
    	endif;
    }
    

    Правильно? И что вместо

    <?php history_default_thumbnail(); ?>

    надо вот так

    <?php wp_get_attachment_image();?>
    Александр месяц назад

    Ага,вроде получилось.В index.php,search.php,category.php,archive.php добавил

    <?php
    $args = array(
    	'post_type'   => 'attachment',
    	'numberposts' => -1,
    	'post_status' => null,
    	'post_parent' => $post->ID,
    	'exclude'     => get_post_thumbnail_id()
    	);
    $attachments = get_posts( $args );
    if ( $attachments ) :
    	foreach ( $attachments as $attachment ) {
    		echo the_attachment_link( $attachment->ID, false );
    	};
    else:
       print '<img class="img img-fluid" src="'. get_bloginfo('template_directory'). '/images/no_image.jpg' . '" alt="no image" />';
    endif;
    ?>

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

    Andrew месяц назад

    вместо функции the_attachment_link используйте функцию the_permalink.

    Александр месяц назад

    вместо функции the_attachment_link используйте функцию the_permalink.

    вместо картинки выводится ее адрес

    Andrew месяц назад

    потому что и вызывается адрес.
    Функция для формирования html кода вложенной картинки - wp_get_attachment_image( $attachment->ID, $size, $icon, $attr )

    т.е. строку echo the_attachment_link( $attachment->ID, false ); нужно заменить на echo wp_get_attachment_image( $attachment->ID, $size, $icon, $attr );

    здесь переменная $size - зарегистрированное название размера (thumbnail, medium, large, full ....), либо массив с заданными размерами (array (width, height)). Назначение остальных параметров - по ссылке в ответе.

    Если хотите залинковать картинку, то оберните полученный img в тег a

    Александр месяц назад

    Ну что ж,все получилось как и требовалось.Огромное спасибо за подсказки в решении вопроса.В процессе решения заодно решил вопрос автоматического добавления класса для картинок (для адаптивности).В итоге вот такое готовое решение:

     <a class="full-post" href="<?php the_permalink();?>">
    <?php
    $args = array(
    	'post_type'   => 'attachment',
    	'numberposts' => 1,
    	'post_status' => null,
    	'post_parent' => $post->ID,
    	'exclude'     => get_post_thumbnail_id()
    	);
    $attachments = get_posts( $args );
    if ( $attachments ) :
    	foreach ( $attachments as $attachment ) {
    		echo wp_get_attachment_image( $attachment->ID, false );
    	};
    else:
       print '<img class="img img-fluid" src="'. get_bloginfo('template_directory'). '/images/no_image.jpg' . '" alt="no image" />';
    endif;
    ?></a>

    Чтобы к загружаемым картинкам автоматически добавлялся класс bootstrap v4 типа img-fluid,в functions.php добавил:

    function add_image_responsive_class($content) {
       global $post;
       $pattern ="/<img(.*?)class=\"(.*?)\"(.*?)>/i";
       $replacement = '<img$1class="$2 img-fluid"$3>';
       $content = preg_replace($pattern, $replacement, $content);
       return $content;
    }
    add_filter('the_content', 'add_image_responsive_class');

    Ну вот как-то так.

    Andrew месяц назад

    атрибуты к изображению добавляются через параметр $args, передаваемый в функцию в виде массива.

    в данном случае вызов функции будет выглядеть так:

    wp_get_attachment_image( $attachment->ID, 'full', false, array ("class" => "img-fluid"))

    Массив может содержать абсолютно любые атрибуты, которые требуется добавить в тег img (alt, title, itemprop, loading, data-* и т.д.)

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

    Комментировать
На вопросы могут отвечать только зарегистрированные пользователи. Вход . Регистрация