Thumbnail Cropping with add_image_size?

0 Views

I want my thumbnails on a particular page to be 300px × 100px, exactly. Currently, images shrink until they hit the 300 pixel or 100 pixel mark. How do I get the image to crop to exactly 300 × 100 (preferably without image distortion). 

// functions.php:
if ( function_exists( 'add_image_size' ) ) add_theme_support( 'post-thumbnails' );

if ( function_exists( 'add_image_size' ) ) { 
    add_image_size( 'post-thumb', 620, 207, true );
    add_image_size( 'home-thumb', 220, 180, true );
    add_image_size( 'index-thumb', 300, 100, true );
}
// index.php:
if ( has_post_thumbnail()) the_post_thumbnail('index-thumb');
Post Views: 0

Related posts

Leave a Reply

3 comments

  1. Refer to the add_image_size() Codex entry:

    <?php add_image_size( $name, $width, $height, $crop ); ?>

    The $crop parameter is the key:

    (boolean) (optional) Crop the image or not. False – Soft proportional crop mode ; True – Hard crop mode.

    Default: false

    That is:

    • False (default): box-resize – (resize image against the constraining dimension)
    • True: hard-crop – crop the image exactly to the specified dimensions

    Thus your code should work:

    // Add Theme support
add_theme_support( 'post-thumbnails' );

// Register custom image sizes
add_image_size( 'post-thumb', 620, 207, true );
add_image_size( 'home-thumb', 220, 180, true );
add_image_size( 'index-thumb', 300, 100, true );

    If you find that your images are not being rendered/displayed properly, there are a couple of things to verify:

    • For images added prior to implementation of these custom image sizes, you will need to regenerate the thumbnails for those images
    • Image sizes will not be generated for images that are not at least as large as the specified dimensions of a given image size. Thus, ensure that your images are at least as large as your largest-specified hard-crop image size. (Box-resized images are not as constrained, and only need to be at least as large as the smallest dimension of a given image size.)

  2. Take a look to this plugin

    • it creates unlimited image sizes (cropped and not)
    • it adds sizes on media select field
    • it adds css filtering and animations
    • it can manage watermarks

  3. Try to Change the “ture” paramater to “false” .
    You can also remove the “if” statements on the functions php if they are not needed for something else…