How to Check if Custom Image Size Exists in WordPress
When working on a custom WP Theme last night, I’m looking into how to check if custom image size exists in WordPress posts or pages. Since WordPress version 2.9, the core introduce and add support for ‘auto image size’ for each WordPress posts. Without relying on third party thumbnail re-sizer such as Timthumb, user now can upload images into the write post panel and the WordPress core will auto create your available add_image_size() set image size. learn more about add_image_size() here.
You can grabbed your existing ‘image size’ by using the_post_thumbnail() anywhere in your template, provide if the ‘image size’ existed in the first place. WordPress core already include default ‘image size’ when you uploaded any images into your media or attachment settings. This include ‘image size’ for thumbnail, medium, large and full. The following image size can be showed with below code.
the_post_thumbnail('thumbnail'); // Thumbnail (default 150px x 150px max)
the_post_thumbnail('medium');// Medium resolution (default 300px x 300px max)
the_post_thumbnail('large');// Large resolution (default 640px x 640px max)
the_post_thumbnail('full'); // Full resolution (original size uploaded)
But what if you have a different add_image_size() that you want to use instead of the default one. You want to grabbed your own custom image size first before WordPress core kick in and use the closest available image size by default. Here’s how you can accomplished this:
First open your functions.php and check for your custom image size, it will look something like this
add_image_size( 'my-thumbnail', 100, 100, true ); //hard crop 100x100
And now in your template post loop, you can grabbed your ‘custom image size’ first before resolving to default ‘thumbnail’ by adding similar code below.
<?php
$the_thumbnail_src = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), "my-thumbnail" );
$thumbnail_src = $the_thumbnail_src[0];
//change this to exact WxH of your custom image size
$check_thumb = strpos($thumbnail_src, '100x100');
// if custom image size exist
if( $check_thumb ):
echo the_post_thumbnail('my-thumbnail');
else:
echo the_post_thumbnail('thumbnail'); // if not, use default thumbnail
endif;
?>
That’s all, its easy right? Now you can check if your own set of custom image size exist or not before WordPress core use the default or closest ‘image size’.
If you want to regenerate your own set of custom image size, you can try Ajax Thumbnail Rebuild which can help you re-build your featured images and existing or new ‘image size’.
Great post. One alternative suggestion would be to use the width and height returned by wp_get_attachment_image_src(). Along with the SRC value as the first [0] item in the returned array, the image width and height are stored in [1] and [2] respectively, so you could do a simple comparison, like:
This would be a better way of handling the use cases mentioned in the comments where a height or width might be unknown, but where for display purposes you want to make sure you have an image of a specific size. Of course, you could set the “>=” to “==” if you need to make a direct comparison. I suspect this would also have slightly better performance, as you’re not running a function (strpos) on the value.
RyanPublic CommentUserGreat post. One alternative suggestion would be to use the width and height returned by wp_get_attachment_image_src(). Along with the SRC value as the first [0] item in the returned array, the image width and height are stored in [1] and [2] respectively, so you could do a simple comparison, like: This would be a better way of handling the use cases mentioned in the comments where a height or width might be unknown, but where for display purposes you want to make sure you have an image of a specific size. Of course, you could set the ">=" to "==" if you need to make a direct comparison. I suspect this would also have slightly better performance, as you're not running a function (strpos) on the value.thx for the input Ryan, yes this will do too…
Richie KSMember of DEZZAIN.COMAdministratorthx for the input Ryan, yes this will do too...The desktop view is superB but my site images not displaying when anybody is opens it in mobile and some text is also overlapping. So, i am unable to use the responsive feature of this theme.
AakashPublic CommentUserThe desktop view is superB but my site images not displaying when anybody is opens it in mobile and some text is also overlapping. So, i am unable to use the responsive feature of this theme. www.mefashionagency.inhttp://www.mefashionagency.in
This is too specific to be useful in any case where you are allowing a flexible height or width and are cropping the image through WordPress.
When doing that, you can’t check the height and width of the image against the static definition, so this check then fails.
Gee WhizPublic CommentUserThis is too specific to be useful in any case where you are allowing a flexible height or width and are cropping the image through Wordpress. When doing that, you can't check the height and width of the image against the static definition, so this check then fails.yeap but with the hard cropped method, newly uploaded image with set_image() 300×300 hard-crop true will get cropped to 300×300 exact so it may not passed for previous uploaded featured image per-say.
Richie KSMember of DEZZAIN.COMAdministratoryeap but with the hard cropped method, newly uploaded image with set_image() 300x300 hard-crop true will get cropped to 300x300 exact so it may not passed for previous uploaded featured image per-say.