WordPress Dropdown image select

Question

I know this is much common and I did not find the right answer. So to show all possible image sizes I have done:

add_filter( 'image_size_names_choose', 'fashmag_image_sizes_choose' );
function fashmag_image_sizes_choose( $sizes ) {
  $image_sizes = get_intermediate_image_sizes();
  return $image_sizes;
}

This perfectly shows all image sizes but this puts the option value not name. So the generated HTML output

<select class="size" name="size" data-setting="size">
  <option value="0">thumbnail</option>
  <option value="1">medium</option>
  <option value="2">medium_large</option>
</select>

In my gallery shortcode instead of putting thumbnail it puts 0

[gallery link="file" size="0" ids="124,125,108,103"]

How can I correct this i.e. put thumbnail instead of 0?

Answer 1

Try:

<select class="size" name="size" data-setting="size">
    <option value="thumbnail">thumbnail</option>
    <option value="medium">medium</option>
    <option value="medium_large">medium_large</option>
</select>

Answer 2

The filter you are trying to use should return a nested array, not a single array. In your case:

add_filter( 'image_size_names_choose', 'fashmag_image_sizes_choose' );
function fashmag_image_sizes_choose( $sizes ) {
    // Get a list of custom image sizes
    $image_sizes = get_intermediate_image_sizes();
    // Create an array of them, in the array( 'slug', 'name' ) format
    foreach( $image_sizes as $size ){
        $custom_size[][0] = $size[0];
        $custom_size[][1] = $size[0];
    }
    // Merge the custom array with the original array
    return array_merge( $sizes, $custom_size );
}

Take a look at this documentation page for more information about how this filter works.