If you are creating a WordPress site for a user, you want to make sure everything is as easy as possible for them. One trick that can make things easier is to have images automatically resize when they are used for a featured image in WordPress. Resizing images may be easy for developers and graphic designers, but some end-users don’t have the skills or time to resize an image to fit perfectly in your design. Luckily, this is simple to set up.
add_theme_support( 'post-thumbnails' ); |
add_image_size($name, $width, $height, $cropBoolean); |
The add_image_size(); function has 4 parameters. $name is the name that you want to call your image with. $width is the width you want the image to crop to in pixels. $height is the height you want the image to crop to in pixels. $cropBoolean is a true or false parameter. If set to true the image will crop itself automatically.
In the example below, the name I use to call the cropped image is “featuredImageCropped”. The height and width are 250px and 200px respectively, and the image is set to crop.
add_image_size('featuredImageCropped', 250, 200, true); |
<?php the_post_thumbnail('featuredImageCropped'); ?> |
There you have it. Now when you add a featured image to a post, the image will not need to be resized or cropped beforehand. WordPress will do it for you!
Subscribe to RSS
Follow me on Twitter
I have used a multi featured image plugin in wordpress. but when i set the fearuted image (1 or 2 ) then it is automatically resizing according to the image original size. I want to resize all the images in 351*351. Please help me out ??
Reply
Hi Sachin,
Are you referring to a plugin that is giving you a problem? Unfortunately I don’t use a plugin for resizing featured images. All I can say is to maybe try a different plugin or try using the technique in this post.
Best of luck!
While making a website for a client, I stumbled upon this page. I made a template for WordPress from scratch and added the line to functions.php. It did not work until I added the following line above it.
add_theme_support( ‘post-thumbnails’ );
Reply
Hi Sound4Sites,
Thank you very much for your comment. That line of code is very important for custom sites and should have been included in this post originally. I just updated the post. Thanks and good eye!
What about step 3, should we place that in the functions.php ?
Reply
Hello,
Nope, place the line of code in step 3 wherever you would like the image to show up.
Hey Keith, great walkthrough! Only problem I’m having is the second line of code in step 2 and the code in step 3 aren’t appearing in the boxes. Where did they go??
(I’ve screengrabbed the problem, but I can’t attach an image to my comment)
Reply
Hi Steve,
Good catch, I wasn’t aware of that, but it’s fixed now.
Thanks!
Keith
@Keith,
Thanks for that Keith! I think I’m following your instructinos correctly, but my blog index thumnails are now resizing, not cropping, according to only one of the size values.
So, I’m trying to auto-crop the images to 300×179, but they’re resizing to 179×179.
Any ideas why that’s happening?
Hi Steve,
Are you sure that you put all of the code in correctly? Especially step 2? If you’re sure you did, try uploading the problem image again and see if that changes anything.
If you upload the image first and then put the code in your files you need to regenerate the thumbnail images by re-uploading them.
-Keith
thanks dude i am searching some plugins from many days to resize featured images.
You gave me full solution.
Reply
Great Abhay, glad to hear it!