Default Sizes

By default, WordPress has four sizes that you can choose from when displaying your images. They are:

1. Thumbnail (150×150)
2. Medium (300×300)
3. Large (1024×1024)
4. Full Size (Whatever the image dimensions are)

That’s great that they give us choices, but what if we want a different size? I really wanted my images to be the same width as my content, so I went searching for a way to easily do that. It just so happens that WordPress has an option in the admin panel for changing the default sizes. Just go to Settings>Media and you can adjust sizes to your hearts content. I set my large size at 560×1024 (560 being the width of my main content area). If you want your image to always match the width of your content, make sure you set Max Height significantly larger than Max Width. That will keep pictures that are longer vertically from being trimmed smaller than the content width.

Custom Sizes

If we need more sizes, we can use the following code:

/**
 * Adds custom image sizes
 *
 * WordPress will automatically create a copy of every new image with
 * these dimensions.
 */
function prefix_theme_setup() {
    add_image_size( 'custom-size', 800, 400, true ); // ("true" tells WordPress to crop the image in addition to resizing)
}
add_action( 'after_setup_theme', 'prefix_theme_setup' );

/**
 * Adds custom image names
 *
 * Assigns human friendly names to the image sizes and allows
 * these sizes to be selected in the WordPress dashboard.
 */
function prefix_custom_sizes( $sizes ) {
    return array_merge( $sizes, array(
        'custom-size' => __( 'Custom Size' ),
    ) );
}
add_filter( 'image_size_names_choose', 'prefix_custom_sizes' );