How To Add Custom Image Size In WordPress Gallery

How To Add Custom Image Size In WordPress Gallery?

WordPress has its inbuilt feature to provide the different image sizes. And you can improve its working by adding any extra image size.

If you have noticed in your WordPress media library, there are different sizes of the image when you upload any. To add custom image size in WordPress media gallery, you have to add the code in your theme.

Though most of the WordPress themes have their own image sizes for the thumbnails, banner images etc. But still, if you want any new image size then follow the guide.

What To Do For Registering The Image Size In Your Theme?

The first thing is to check the code which adds the feature to support the image sizes.

Do you know how to add thumbnail in WordPress theme? Well, if you know the answer then the problem is solved.

The code to enable the thumbnail images allows the users to add images in the WordPress theme.

Let me show you the code.

add_theme_support( ‘post-thumbnails’ );

What’s the code to add another custom image size in your WordPress theme?

The above code is responsible for the thumbnail images. To add a custom image size, you have to use another WordPress function.

add_image_size();

There are many parameters which can be passed in this function.

Name :- Name of the image

Height :- Set the height of the image.

Width :- Set the width of the image.

Crop :- There are two types of crops.

  • Soft Crop
  • Hard Crop

You can also use an array to choose any part of the image to crop.

Let me show you the examples.

Soft Crop.

add_image_size( ‘thumbnail-image’, 180, 120 );

As you can see, the name, height and width are mentioned for the image.

Hard Crop.

add_image_size( ‘banner-image’, 920, 400, true );

It’s the hard crop. If the image you add is of the bigger size then it will get cropped to the size mentioned in the code.

If you want to crop the image from the top-left corner then you can use an array to set the value.

add_image_size( ‘sidebar-image’, 320, 200 array( ‘left’, ‘top’ ) );

It is also a part of the hard crop.

You can set any other value based on the part of the image you want to crop.

You can add as many custom image sizes as you want.

NOTE:- But it’s always recommended to remove all the extra image size codes from your WordPress theme which are not in use.

How To Show The Selective Image Size In Your Theme?

In the WordPress theme files, you can use the thumbnail code and the image name you have added in the above codes.

Let me show you an example.

<?php the_post_thumbnail( ‘banner-image’ );

You can even set new image size and use it with an array using this code. Make sure that you know the correct way to add custom code in WordPress theme.

Did You Come To Know How To Add Custom Image Size In WordPress Theme?

You should understand the basics of the theme development process and the theme support codes to enable the thumbnail.

After that, you can add any image size for your website. That image size would appear in your WordPress media library. I hope now you have come to know how to add custom image size in WordPress.

If you still have any doubt, feel free to clear it.

by Ravi Chahar

A WordPress Professional and the LinkedIn Influencer. A coder by passion and a blogger by choice. WordPress theme development is his forte. He is your WordPress guy who will teach you how to solve WordPress errors, WordPress security issues, design issues and what not.


Get Free Updates Into Your Inbox

Learn Everything Just Like I Did

SUBSCRIBE



4 comments

  1. Hello Ravi,

    A good tip again. Next time if someone asks me to share a blog where he can learn WordPress, I will surely refer him to your blog since you have been posting all the small and big stuff that are really needed.

    Great work.

    Adding custom image in WP gallery is important for many.

    1. Hey Atish,

      I am glad that you have found my blog an informative one.

      I am just trying to solve the problems of people who really want to know about WordPress. I hope this can help.

      Thanks for your support.

      Have a great day.

      ~Ravi

  2. Hello, Ravi!

    Excellent work, buddy!

    I am not too good in the technical side of the WordPress but always loves following such tips!

    And you’re doing an excellent job at providing the great technical help! ?

    I’ll definitely try that for my blog.

    ~ Adeel

    1. Hey Adeel,

      WordPress has many features which are yet to be revealed. You can learn more about it.

      And adding the custom image sizes are really a plus point for the WordPress developers. It depends on what kind of image size you want to use.

      Thanks for taking the time to drop some input.

      Have a great day.

      ~Ravi

Leave a Reply

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