указать размер изображения для предварительного просмотра сообщения (не уменьшать изображение)

На главной странице моего блога у меня есть раздел в заголовке с миниатюрами сообщений (140x170px), ссылающимися на определенные категории. Ниже в рамках цикла блога у меня также есть предварительный просмотр сообщений – изображение 440x265px и первый абзац или около того контента.

Мне интересно, как я могу указать размер изображения предварительного просмотра, не влияя на: а) миниатюры сообщений и б) размер изображения, которое будет отображаться при просмотре полного сообщения.

Заголовок миниатюры:

<div class="ootd-stream"> <?php $new_query = new WP_Query( 'cat=your_category_id&showposts=2' ); if( $new_query->have_posts() ): while( $new_query->have_posts ): $new_query->the_post(); the_post_thumbnail(); endwhile; endif; wp_reset_query(); ?> <p>outfit of the day</p> </div><!-- end ootd-stream --> 

Loop:

 <div id="blog"> <div class="preview"> <?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?> <div class="post-image"> <img src="http://placehold.it/440x265" alt="cait barker post image" /> </div><!-- end blog-image --> <div class="post"> <h2><?php the_title() ;?></h2> <span class="post-preview"> <?php the_excerpt('read more...'); ?> <?php endwhile; else: ?> <p>Sorry, no posts to list</p> <?php endif; ?> </span><!-- end post-preivew --> <p class="post-meta"><span style="font-family: amatic;">>></span>&nbsp;Posted on <?php the_date('Md-y'); ?>&nbsp;<span style="font-family: amatic;">>></span>&nbsp;<?php the_tags('tags: ', ', ', '<br />'); ?></p><!-- end post-meta --> </div><!-- end post --> </div><!-- end preview --> </div><!-- end blog --> 

Это возможно? Каков наилучший способ достичь этого?

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

Пример:

Зарегистрируйте размер пользовательского изображения (functions.php)

 if ( function_exists( 'add_image_size' ) ) { add_image_size( 'custom-image', 440, 265, true ); //(cropped) } 

Получите пользовательский размер изображения (functions.php)

 function get_custom_image(){ global $post, $posts; $args = array( 'post_type' => 'attachment', 'numberposts' => 1, 'post_status' => null, 'post_parent' => $post->ID ); $attachments = get_posts( $args ); if ( $attachments ) { foreach ( $attachments as $attachment ) { $found = wp_get_attachment_image( $attachment->ID, 'custom-image' ); preg_match( '@src="([^"]+)"@' , $found , $match ); $img = $match[1]; return $img; } }else{ echo 'image_not_available_path_.jpg'; } } 

Использование внутренней петли

 <div class="post-image"> <img src="<?PHP get_custom_image(); ?>" alt="cait barker post image" /> </div><!-- end blog-image --> 

Код не полностью протестирован, вам нужно немного его изменить для своих нужд.

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

1.режимеровать собственный размер изображения (functions.php)

 if ( function_exists( 'add_image_size' ) ) { add_image_size( 'custom-image', 440, 265, true ); //(hard cropped) } 

2.get изображение в пользовательском размере изображения, за исключением признака изображения post (functions.php)

 function ravs_get_custom_image( $featured_img ){ global $post, $posts; $args = array( 'post_type' => 'attachment', 'numberposts' => 1, 'post_status' => null, 'post_parent' => $post->ID, 'exclude' => $featured_img ); $attachments = get_posts( $args ); if ( $attachments ) { foreach ( $attachments as $attachment ) { $img = wp_get_attachment_image( $attachment->ID, 'custom-image' ); return $img; } }else{ echo 'Please attach images to your post'; } } 

Код может выглядеть так:

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

  //using in loop <div class="post-image"> <?php echo ravs_get_custom_image( get_post_thumbnail_id () ); ?> </div><!-- end blog-image --> 

4.output может выглядеть так:

 <div class="post-image"> <img width="440" height="265" src="http://localhost/wooplay.com/wp-content/uploads/2010/01/homepage-image-440x265.jpg" class="attachment-custom-image" alt="homepage-image"> </div><!-- end blog-image --> 

Важные ссылки:

  1. get_posts ()

  2. get_post_thumbnaiul_id ()

  3. wp_get_attachment_image ()