How to create custom image sizes in Media Uploader

If you are using Media Uploader to deal with images in WordPress, you have probably seen numerous options for images. Between many, you are able to choose an image size which you can send to your article.

There are thumbnail, medium, large and full size options to choose from, but all those options have predefined values. So, if you’re using a custom theme, more often than not you are stuck with changing width and height for each image over and over again.

Actually, you don’t have to do that. There is a neat little function called add_image_size() which is a great tool for developers. And after this article, you will find it useful as well.

Let’s say your theme has a custom width and you want to easily embed images to fit in there perfectly. Let’s say that width is 666px (we won’t go into why you have set the width to this number, it’s your choice). To do that, you need to add extra radio button into Media Uploader. With the code below, you’ll be adding one more size which is the half size of the original one.

  1. Open your functions.php file
  2. Copy and paste this piece of code:
  3. function custom_image_sizes() {
    add_image_size( 'one-size', 333, 333, true );
    add_image_size( 'another-size', 666, 666, true );
    }
    
    add_action( 'init', 'custom_image_sizes' );
    
    function show_image_sizes($sizes) {
    $sizes['one-size'] = __( 'Custom Size 1’, 'isitwp' );
    $sizes['another-size'] = __( 'Custom Size 2’, 'isitwp' );
    return $sizes;
    }
    
    add_filter('image_size_names_choose', 'show_image_sizes');
  4. Save changes
  5. Try adding an image from your Media Uploader where you should see your new size options under the “Attachment Display Settings”

After this, you might be interested into regenerating additional image sizes and allowing authors to use them

START YOUR OWN BLOG

This guide is an introduction to mastering the art of blogging. It provides easy to follow steps to start, maintain, and grow your blog.

Read the guide

Leave a Reply

Your email address will not be published. Required fields are marked *