am trying to crop my thumbnail in my loop, am having some problems when i crop using codes some images appear either big in width or height here is my code Css

.imgholder {float:left;margin-right:20px; margin-left:20px;height:240px;width:240px;}

loop

<?php the_post_thumbnail( 'large' , array('class' => 'imgholder')); ?>

when i change the 'large' to 'thumbnail' from the above it works perfectly please help Thank you

am trying to crop my thumbnail in my loop, am having some problems when i crop using codes some images appear either big in width or height here is my code Css

.imgholder {float:left;margin-right:20px; margin-left:20px;height:240px;width:240px;}

loop

<?php the_post_thumbnail( 'large' , array('class' => 'imgholder')); ?>

when i change the 'large' to 'thumbnail' from the above it works perfectly please help Thank you

• post-thumbnails

2 Answers 2

Basically, when you are setting the thumbnail sizes you have a choice of how the thumbnails cropped in WordPress.

Soft Crop

The Soft Crop in WordPress is the same as what's commonly known as a Fit Crop and is what we'd normally think as a "pure resize". The entire image will be fit in a box of the dimensions you specify without cutting any of the image. So, if the shape of the image is not exactly the same as the shape of the box, then you will end up with blank space.

There are two ways that you can specify a hard crop. One of them is to navigate in the WordPress dashboard > Settings > Media and uncheck the choice of "Crop thumbnails to exact dimensions (normally thumbnails are proportional)". Keeping that unchecked is setting a soft crop.

Now, if you have added extra image sizes through your functions.php then you can use the add_image_size function and you can specify the soft crop with the FALSE attribute, like this.

add_image_size ('large', 240, 240, false);

Hard Crop

The Hard Crop will fill a box of whatever dimensions you specify and cut out any other parts of the image that do not fill in that box. Also, in this case, we have two ways that you can specify hard crop. One of them is to navigate in the WordPress dashboard > Settings > Media and check the choice for "Crop thumbnails to exact dimensions (normally thumbnails are proportional)". Keeping that checked is setting a hard crop.

In the case that you are specifying it in functions.php then it looks something like this :

add_image_size ('large', 240, 240, true);

Tips

• Namely correctly your custom images. In your question, you use the term large but these dimensions are not so large. If you use a lot of dimensions of images, I recommended you to be clear of the naming to avoid any confusion. In your case, I would use medium instead of large.
• To change these images that you have already uploaded, you should regenerate your thumbnails. Feel free and use this awesome plugin Regenerate Thumbnails. This plugin allows you to regenerate all thumbnail sizes for one or more images that have been uploaded to your Media Library.

Using the_post_thumbnail doesn't crop an image, it just displays whichever WP-registered image size you request. By default, when you upload an image to the Media Library, several sizes are generated. The thumbnail is usually set to crop to a square, but the large image size is not.

You could change your media settings to force-crop and force the Large image size to be square.

Or, you could add a whole new image size, so you can use the Large images wherever you like on your site and not have to have them cropped square, but this would also generate your new additional image size so you'll always have a larger square image to pull into your code.