WordPress как на ладони
rgbcode is looking for WordPress developers. Очень Удобный и Быстрый Хостинг для сайтов на WordPress. Пользуюсь сам и вам рекомендую!

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

Начал изучать 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
Александр
3.5 лет назад
картинки постовминиатюры
  • 0
    Andrew546

    Проверяйте наличие вложений-изображений у страницы (исключая при запросе картинку, установленную в качестве миниатюры). Далее работайте с 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, который выводите там, где нужно и когда нужно.

    3.5 лет назад #
    Александр 3.5 лет назад

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

    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();?>
    Александр 3.5 лет назад

    Ага,вроде получилось.В 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 3.5 лет назад

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

    Александр 3.5 лет назад

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

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

    Andrew 3.5 лет назад

    потому что и вызывается адрес.
    Функция для формирования 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

    Александр 3.5 лет назад

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

     <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 3.5 лет назад

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

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

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

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

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

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