Add Custom Image Sizes to the WordPress Editor Dropdown

You registered a new image size in WordPress with add_image_size(), regenerated the thumbnails, and it still does not show up when you insert an image. Registering a size only makes WordPress create the files. The size dropdown in the editor shows only the sizes that are listed in the image_size_names_choose filter.

This snippet does both in one place: you list each size once, with its name, width, height and crop setting, and it is created on upload and offered in the editor.

The snippet

<?php
/**
 * Register custom image sizes and show them in the image size dropdown of the WordPress editor.
 */

// ===== Config =====
function dpc_image_sizes_config(): array {
	$sizes = array(
		// 'slug' => array( 'Name in the dropdown', width, height, crop ),
		'dpc-product-main' => array( 'Product main', 1440, 800, true ),
		'dpc-sidebar'      => array( 'Sidebar', 440, 200, true ),
		'dpc-wide'         => array( 'Wide (no crop)', 1600, 0, false ),
	);
	// ===== End of config =====

	return (array) apply_filters( 'dpc_image_sizes_config', $sizes );
}

add_action( 'after_setup_theme', 'dpc_register_image_sizes', 20 );

function dpc_register_image_sizes() {
	foreach ( dpc_image_sizes_config() as $slug => $size ) {
		add_image_size( $slug, (int) $size[1], (int) $size[2], (bool) $size[3] );
	}
}

// Names for the size dropdown in the block editor, the media modal and page builders.
add_filter( 'image_size_names_choose', 'dpc_image_size_names' );

function dpc_image_size_names( $names ) {
	foreach ( dpc_image_sizes_config() as $slug => $size ) {
		$names[ $slug ] = $size[0];
	}
	return $names;
}

How it works

add_image_size() tells WordPress to create a copy of every new upload at that size. Crop true cuts the image to the exact width and height, false only resizes it. A height of 0 keeps the proportions.
image_size_names_choose holds the list of sizes the editor offers. The block editor’s Image block, the media modal and builders such as Oxygen read it. The snippet adds your sizes with the names from the config.
Both parts read the same config, so the slug in the dropdown always matches a registered size. One example in the older version of this post registered product-main but added sidebar-thumb to the dropdown, which then pointed at a size that did not exist.
The new names have a dpc- prefix so they cannot clash with sizes from your theme or plugins.

Add it with Scripts Organizer

In Scripts Organizer go to Code Blocks → Add New and give the block a name. Set Trigger location to Everywhere, tick PHP under Script location, paste the code into the PHP editor, edit the config and publish. Leave Action/Hook empty.

The older version of this post said Admin only. The block editor uploads images through the REST API, which is not part of wp-admin, so a size registered only in wp-admin is not created for those uploads. Everywhere covers wp-admin, REST and front-end uploads.

The same code also works unchanged in a small plugin or an mu-plugin.

Customise it

Add, remove or rename sizes in the config. The first value is the name in the dropdown, then width, height and crop.
Crop from a different point: use an array instead of true, for example array( 'center', 'top' ).
Fewer copies per upload: see Disable WordPress default Image Sizes.

Gotchas

Existing images do not get the new sizes until you regenerate them, for example with wp media regenerate or the Regenerate Thumbnails plugin.
WordPress never upscales. If the uploaded image is smaller than the size, no file is created and the size is missing from the dropdown for that image. With crop on, both the width and the height must be large enough.
Every size adds a file to each upload. Register only the sizes your design uses.
If you remove a size later, the files already created stay in the uploads folder.

In the Scripts Organizer library Import it with one click from Scripts Organizer.