add_image_size() width not actually working

Question

I've been attempting to add an image size to my code, for an image that needs to be 708px wide. Height can be variable. I've added the code this way:

add_image_size( 'full-blog-width', 708 ); 
add_filter( 'image_size_names_choose', 'my_custom_sizes' );

function my_custom_sizes( $sizes ) {
    return array_merge( $sizes, array(
        'full-blog-width' => __( 'Full Blog Width' ),
    ) );
}

However, when I go to add the images in the media library, the width seems to max out at 474px with the height varied based on proportions. I've attempted hard cropping, but that doesn't seem to affect anything but the ratio in the end. Best I can tell, this 474 number comes from the is the width of the blog post container. Does the media library set a maximum size for the images based off the blog post CSS? Is there a way to override this?

Answer 1

After playing around a little more, the image does look like it's being resized by wordpress on upload to the 708 width, however, when inserted by the media library, the image is automatically scaled down to 474px which is the width of the text column.

This is correct. Themes define a global variable called "$content_width" which tells WordPress the width of the main displayable content area. WordPress will automatically put images into a container with this width, so as to not overflow the content area.

The resizing of images on upload is independent of this process. The image will be whatever sizes are defined for it, but it will scale into the space provided for it by the content width.

Answer 2

Try adding the custom image sizes using the after_setup_theme hook in WordPress.

Off the top of my head you would add something like this to functions.php

if(!function_exists('custom_after_theme_setup')):
  function custom_after_theme_setup(){
     // your image size code here
  }
  add_action('after_theme_setup', 'custom_after_theme_setup');
endif;

Codex: after_setup_theme