Take the 2-minute tour ×
WordPress Development Stack Exchange is a question and answer site for WordPress developers and administrators. It's 100% free, no registration required.

I would like to have two different sized featured images on my homepage. I currently have all featured images set to 280x200. I would like to have SOME posts on the home page display a larger 620x200 image and others the 280x200. I'm not sure how to accomplish this. I realize I can specify a custom image size in my functions file like add_image_size( 'large-image', 620, 200, true );. However, I'm not sure how to get my homepage to know which image to display?

I have no idea if this is an optimal approach or not but I was thinking of making a custom field called 'large-featured' and having the homepage check to see if large-featured custom field value is set to true. Upon true use large-image custom size and upon no custom field value set use wordpress default featured size.

I'm not good at php coding so a little help here would be awesome. I'm pretty good and figuring things out with a little direction. Thanks for your assistance. Much appreciated.

My site in question is: http://www.fighterstyle.com

share|improve this question

7 Answers 7

A featured image is saved as an attachment ID, you can use the get_post_thumbnail function as a shortcut to grabbing other sizes like this:

echo get_the_post_thumbnail($post->ID, 'the first image size');
echo get_the_post_thumbnail($post->ID, 'the other image size');
share|improve this answer
    
How does this help me? I need to have two different featured image sizes on the homepage not 1 size... –  Chad Fonger Aug 31 '12 at 19:25
    
Because now you know how to show the featured image at any arbitrary size, you can simply do it twice specifying a different image each time –  Tom J Nowell Sep 2 '12 at 20:35
    
If you would like two different images at different size, rather than the featured image at 2 sizes ( not the same thing ) please modify your question and I will ammend my answer –  Tom J Nowell Sep 2 '12 at 20:36

Look in the functions.php of the theme you are using and you can easily change:

// Enable post thumbnails
add_theme_support('post-thumbnails');
set_post_thumbnail_size(620, 200, true);

I also used another function on one of my sites

$i = 0
foreach(...){
  if($i == 0){
     echo '<img width="400" src="...">';
  }else{
     echo '<img width="200" src="...">';
  $i++
}
share|improve this answer
    
Could you explain bit more what this does? I really don't understand. I need two different featured images sizes for the homepage. –  Chad Fonger Aug 31 '12 at 19:27

Your idea of using a custom field sounds good to me. You can then access this data using the get_post_meta function as described in the codex, and use that to pass the values of the size.

As to what values to pass, instead of passing hard coded sizes, it's better if you define the desired sizes in the Settings -> media screen, and then you can use the WP keywords thumbnail, medium, large or full when calling the get_the_post_thumbnail function

share|improve this answer

With get_post_thumbnail() you have the ability to insert a featured image in your theme. the_post_thumbnail( $size, $attr ); holds to parameter 1. The size of your image and the ID.

If you would like to have 2 image sizes of featured images on your home page you could do it like this:

if(is_front_page(){  // only on frontpage
 if ( has_post_thumbnail() ) { // check if the post has a Post Thumbnail assigned to it.
  the_post_thumbnail($post->ID, array(320,320));
 } 

}else if(is_page()){
  if ( has_post_thumbnail() ) {
      the_post_thumbnail($post->ID, array(120,120));
  }
}
share|improve this answer

First, I think you have to add new size if it not implement yet:

add_image_size( 'feature_name', 320, 200, true/false );

The media uploader will create the images in the currect size from now.

If you have old images it will not regenerate the images to the new size, use AJAX Thumbnail Rebuild plugin.

Now you can call:

echo get_the_post_thumbnail( $post_id, 'feature_name');
share|improve this answer

I suggest you to get the url of the thumbnail image instead of the thumbnail image which is already resized when you set it as featured image...

<?php
// check if the post has a Post Thumbnail assigned to it.
if ( has_post_thumbnail() ) {
$image = wp_get_attachment_url( get_post_thumbnail_id(get_the_ID()) );
//$image = wp_get_attachment_image_src( get_post_thumbnail_id(get_the_ID())); this gets the thumbnail image which is resized.
}?>
<img src="<?php echo $image;?>"/>
share|improve this answer
    
Why do this instead of using size parameters as suggested in other answers? How do you avoid distorting the image when you force those dimensions? –  s_ha_dum Jun 27 '13 at 13:12
    
the $image will store the url of your orignal image not distorted, if you want to use the orignal image without distortion just use the <img src="<?php echo $image;?>". –  Yamu Dec 18 '13 at 11:32
    
But as written you are forcing the image to a height and width which is likely to lead to distortion. Of course, if you do something different, that won't happen but that doesn't explain this answer. –  s_ha_dum Dec 18 '13 at 14:43

Create custom field - large_featured. If the value = 1 the large standard size will be displayed. Else - medium.

$large_featured = get_post_meta( $post->ID, 'large_featured', true );
if(!empty($large_featured) && $large_featured == '1') {
    the_post_thumbnail('large');
} else {
    the_post_thumbnail('medium');
}

You can create additional image sizes specifically for your homepage by adding this in functions.php:

add_image_size( 'homepage-large', 620, 620);
share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.