How To Add Custom Image Size In WordPress Gallery?

How To Add Custom Image Size In WordPress Gallery?
Like Tweet Pin it Share Share Email

How To Add Custom Image Size In WordPress Gallery?

how to add custom image size in WordPress

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.

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.

Comments (0)

Leave a Reply

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