Sizing thumbnails with custom post types

All your images are coming a custom post type (a featured image) ?

Check into http://codex.wordpress.org/Function_Reference/add_image_size

You can set as many image sizes as you want by adding them to your functions.php file. What size do you need?

x

Yes you put that in your functions PHP file, you can essentially add as many sizes as you would like. The "true" should hard crop to the image size you've mentioned.

How you display the featured image will depend on what image upload you're using. If using the default wordpress featured image box you should be able to display it with

if ( has_post_thumbnail() ) { 
        the_post_thumbnail( 'your-custom-size' ); 
    }

If you're using Advanced Custom Fields for the image upload you're going to want to use something a little different.

First define the sizes we talked about

/**
 * Add automatic image sizes
 */
if ( function_exists( 'add_image_size' ) ) { 
    add_image_size( 'photos', 228, 148, true ); //(cropped)
}

Then something like this should get you started

$attachment_id = get_field('your-custom-field-id');
    $size = "photos"; // (thumbnail, medium, large, full or custom size photos we mentioned above)
    $image = wp_get_attachment_image_src( $attachment_id, $size );

To display it finally

    <img alt="Image of <?php the_title(); ?>" src="<?php echo $image[0]; ?>" />

I haven't tested it myself (at work) but theoretically something like this should display the image in a custom meta box.

Try it out and see if it works

Ok, I'm still learning PHP but where does that second part of code go? And then when I display it will I still need to use "the_field( )" or is that what the "$attachment_id" does?

I have it coded as this:

''' <div class="large-12 columns">

    <?php if ( have_posts() ) : 

        $attachment_id = get_field('photo');
        $size = "photos"; // (thumbnail, medium, large, full or custom size photos)
        $image = wp_get_attachment_image_src( $attachment_id, $size );
    ?>

            <a href="<?php the_field( 'photo' ); ?>" class="photos" rel="lightbox" title="<?php the_field( 'photo_description' ); ?>" >
            <img alt="Image of <?php the_title(); ?>" src="<?php echo $image['photo']; ?>" /></a>

    <?php endif; ?>

</div>

''' But it does not show the image on the page, only in the lightbox.

Right now it is local. Nothing shows up.

That gives me a broken image icon.

I tried that too, it displays the image but is still does not resize it. I must have something wrong in the php somewhere.

Ok. I have the ''' /**

• Add automatic image sizes */ if ( function_exists( 'add_image_size' ) ) { add_image_size( 'photos', 228, 148, true ); //(cropped) }''' in my functions.php And '''<?php if ( have_posts() ) :

  $attachment_id = get_field('photo');
  $size = "photos"; // (thumbnail, medium, large, full or custom size photos)
  $image = wp_get_attachment_image_src( $attachment_id, $size );
  

  ?>

      <a href="<?php the_field( 'photo' ); ?>" class="photos" rel="lightbox" title="<?php the_field( 'photo_description' ); ?>" >
      <img alt="Image of <?php the_title(); ?>" src="<?php echo $image['photo']; ?>" /></a>
  

  <?php endif; ?> ''' on the page with my images. The image still does not show up. Am I missing something?