Discover in this tutorial how to get and display all image sizes of a WordPress installation without plugins.
When you upload an image to WordPress 4 versions of different sizes are created by default:
- Medium large (internal management)
The problem is that sometimes you don’t know how many image sizes a WordPress installation has, since both themes and plugins can register custom sizes.
That’s why in this tutorial you are going to learn how to get a list of all the image sizes of a WordPress installation.
Let’s take a look at it:
Steps to display all image sizes of a WordPress installation using a shortcode
1. Create the shortcode
First you are going to encapsulate the sizes obtained inside a shortcode to be able to display the listing wherever you want.
Add the following code at the end of functions.php or in your functionality plugin:
With this code you create a shortcode that allows you to display a list of all the image sizes of the WordPress installation using the
To get the list of images you use two WordPress functions:
The first one gets the image sizes created by WordPress and the second one gets the custom sizes created by themes and plugins.
In addition to merging all sizes into a single listing, it also shows the dimensions of each thumbnail (width x height). For example, something like this:
- thumbnail = 150 x 150 pixels
- medium = 300 x 300 pixels
- medium_large = 768 x 0 pixels
- large = 1024 x 1024 pixels
- 1536×1536 = 1536 x 1536 pixels
- 2048×2048 = 2048 x 2048 pixels
- sidebar-featured-thumb = 70 x 60 pixels
- featured-image = 800 x 400 pixels
- header-hero = 1600 x 800 pixels
- gb-block-post-grid-landscape = 600 x 400 pixels
- gb-block-post-grid-square = 600 x 600 pixels
To be able to see the ones in your WordPress installation you only have one step left.
2. Insert the shortcode where you want
The advantage of shortcodes is that you can insert them anywhere on the website.
[image_size] where you want it to be displayed.
- If you are using the classic editor, use the HTML tab to enter the shortcode.
- If you are already using the block editor, you can add it to the normal paragraph block, the HTML block or the shortcode block. All of them will render the content correctly.
This would be an example of the listing that the shortcode would display:
Once you know all the image sizes of an installation you can decide if you want to remove some or if you want them to be displayed in the image and gallery block as well.
Now you know how to get all the image sizes of a WordPress installation to decide if you need all of them or not.
Any questions? Let me know in the comments.
And if you want to give me any suggestion for future tutorials, leave it in the contact form. Advantages of being a subscriber. 😉