Change thumbnail crop position in WordPress

I get many complaints about wordpress thumbnail (aka post featured image in wordpress 3) crop position lately. Many of my clients tell that they need top part of the image as thumbnail rather than the useless middle part. That’s why i dived into the core and got the solution for cropping top part of the thumbnails.

Here i will show you how to change crop behaviour of wordpress.

Cropping function is called image_resize and it is located in media.php.

Step1. Open media.php file under wp-includes folder.
Step2. Find the function named “image_resize_dimensions” (Around line 309). Unfortunately this function is not pluggable and doesn’t use any hooks so we will edit it directly. Find the lines:

$s_x = floor( ($orig_w - $crop_w) / 2 );
$s_y = floor( ($orig_h - $crop_h) / 2 );

Step3. Those two variables define the start point of crop that will be used. Here is a sample image that will be cropped with those variables shown:

Step4. If you want top of part of the image as post featured image then $s_y value must remain zero. So we change that line to:

$s_y = 0; //floor( ($orig_h - $crop_h) / 2 );

Step5. Save the file and upload it to wp-includes folder.

Last Step. A post image is cropped at the first time it is uploaded. To update thumbnails you need this great plugin called Regenerate Thumbnails. This plugin takes post thumbnails and crops them again using your latest media settings. After you install it click on the “Regenerate All Thumbnails” button under tools. It will automatically crop all the post thumbnails again. This will take a minute or two depending on your server and number of posts you have. After the regeneration is complete all your thumbnails will be cropped from top.

Please like & share:

Shailan.com Staff

Shailan.com is a design blog about WordPress and web design. We regularly write about wordpress, plugins, themes, web design resources, php, css, jquery, adsense and more.. If you want to get notified about our posts, be sure to subscribe to our feed or follow us on facebook.

You may also like...

23 Responses

  1. Jackson says:

    This is great, was looking all over for a solution to my thumbnail issue. Thanks!

  2. Thanks!!
    it really helps :)

  3. Steven says:

    Bravo… thx u

  4. MagisMedia says:

    This is one of the most helfpul tips I have EVER gotten by doing an Internet search. Thank you so much! It has saved me so much time! (P.S. my site is still in the design phase.)

  5. Jordan Haddow says:

    Only thing that sucks about this method is it will disappear the moment the media.php file is updated. The media file is a pain in the but and something that I think really needs work too. Hopefully the developers will be able to give it some attention soon.

  6. MaierWerx says:

    Very helpful… thank you!

  1. November 23, 2010

    […] Shailan.com You might like these posts as well:WebDog Featured on WordPress.org!9 Fatal SEO Mistakes […]

  2. March 30, 2011

    […] upload to /wp-includes/media.php. Thanks to @mattsay for the […]

  3. June 6, 2011

    […] Po dokončení regenerace budete mít všechny náhledy oříznuty shora. Článek převzat od shailan.com, rád bych mu touto cestou poděkoval za dobrou práci! Sám sem se s tímto problémem také […]

  4. September 20, 2011

    […] How to change post thumbnail crop position in wordpress – Featured … WP crops thumbnails from the middle. What if you needed top parts of your images? http://shailan.com/781/how-to- .. […]

  5. July 16, 2014

    […] Some people have looked at this and felt that there was no way to override the $s_y = floor( ($orig_h – $crop_h) / 2 ); line without hacking core. Well, that’s iffy, but if you scroll up above, you’ll see something that lets you basically ‘short-circuit’ the function in question: […]

Leave a Reply

Your email address will not be published.

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>