Probably not the best title description but here we go. One of my custom post types is for youtube videos which I take the thumb from youtube and upload it as a thumbnail for the post. Now it's easy enough to download the image from youtube and use media_handle_sideload() to upload it as an attachment for the post and set thumbnail sizes for it be cropped to but youtube video images come with excess black bars at the top and bottom. So I need a way to crop them out.

So I have a custom thumbnail size that crops all thumbs to a width of 224px called 'post-thumbnail'.

I get and process the thumb like so from a front end post.

$vid_url = $_POST['video_url'];
$video_id = getVideoId($vid_url);
if ($video_id) {
   $video_response = wp_remote_retrieve_response_code(wp_remote_request($vid_url));
   if ($video_response == 200) {
      $video_url = $vid_url;
      $video_image_url = 'http://img.youtube.com/vi/'.$video_id.'/hqdefault.jpg';
      $tmp = download_url($video_image_url);
      $file_array = array(
                    'name' => basename( $video_image_url ),
                    'tmp_name' => $tmp
$pid = wp_insert_post($new_post);
$vid_thumb = media_handle_sideload( $file_array, $pid );

Now this gives me a thumb of 224px/168px so now what I need to do is crop the thumb to 224px/120px knocking off 24px from the top and bottom. Any ideas?

  • Since your only looking at 24px diff, just hardcrop using CSS.
    – Wyck
    Commented Feb 12, 2013 at 1:47
  • That's easy enough to do but when you're displaying 40 or 50 on a page load it's more efficient to crop them to exact dimensions to save on page load. Commented Feb 12, 2013 at 1:52
  • 1
    Don't have time for a full answer (and I'm not sure it is the answer), but what about: image_make_intermediate_size() ? I think you could run it after you've sideloaded the image. Commented Feb 12, 2013 at 3:06
  • Can't this be solved with CSS?
    – brasofilo
    Commented Feb 12, 2013 at 4:02
  • Cropping 24 pixels out of 40 images via CSS will make load time difference between: 1 - 2.8 KB depending on the data in the image, it's not going to kill your server.
    – Wyck
    Commented Feb 12, 2013 at 4:55

1 Answer 1


media_handle_sideload handles the uploads in the same way the normal upload does. That means, when you upload a remote image (YouTube thumbnails in your case) it will automatically create the thumbnails of sizes registered using add_image_size.

So, what you need to do is create a thumbnail of desired size and call it in your loop.

function my_setup() {
    //Support Thumbnails
    add_theme_support( 'post-thumbnails' );

    //Add Thumbnail Sizes
    add_image_size( 'youtube', 224, 120, true );
add_action( 'after_setup_theme', 'my_setup' );

And then in your loop;

if ( '' != get_the_post_thumbnail() ) {
    the_post_thumbnail( 'youtube' );

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

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