R logo

WordPress Custom Image Sizes

The standard WordPress image sizes—thumbnail, medium, large and full-size—will not suit every project. Sometimes we need more flexibility, and sometimes we need to ensure that non-tech authors face as few options as possible, to keep things from going haywire.

In my case I wanted my client to be able to define whether they were uploading a portrait or a landscape image, because we needed to restrict the respective maximum height or width of the images—portrait would be 500px high and landscape 935px wide. This would allow a good display in our fluid layout.

WordPress has its own codex explaining how to do this, and there are various other helpful articles out there like these from Lime Canvas, WP Mayor and this one from Tuts+.

My portrait declaration,

add_image_size( 'portrait', 0, 500 );

worked as expected–the image was 500px high and the width set itself.

My landscape declaration,

add_image_size( 'landscape', 935, 0 );

failed miserably. Every time I tried to upload a landscape image, the Image Size drop-down in the media manager would list landscape as being 474px wide, despite the 935 requirement. After playing around with various sizes, I realised that 474 was a common factor in every failure.

Ducking out of my child theme and looking at twentyfourteen’s functions.php file revealed one mention of this cursed number:

if ( ! isset( $content_width ) ) { $content_width = 474; }

Back in the child theme I added:

if ( ! isset( $content_width ) ) { $content_width = ''; }

That did it—the landscape images were now 935px wide.

Now I had to simplify things. Presenting the client with a list of the four standard sizes plus portrait and landscape was somewhat overwhelming.

Using WP Mayor’s tips in another post, I unset all sizes except portrait and landscape. Now every time the client uploads an image he is only presented with two sizes: Portrait and landscape. Job done.