Change Default MD Image Sizes With A Simple Filter

To display featured images in different parts of your layout, MD crops and scales your images in attempt to best match them to the page.

Sometimes you need to use your own image sizes to fit them into your new site layout and this new filter added in MD4.7.4.4 will allow you to easily change those dimensions.

First you need to find which image size your particular set of featured images use and then overwrite it in the filter through your child theme’s functions.php file.

Here is an array of the default featured image sizes by name in MD:

	$sizes = array(
		'md-full' => array(
			'width'  => 1118,
			'height' => 350
		),
		'md-banner' => array(
			'width'  => 600,
			'height' => 250
		),
		'md-image' => array(
			'width'  => 325,
			'height' => 425
		),
		'md-thumbnail' => array(
			'width'  => 80,
			'height' => 80
		)
	);

Once you determine which size you need to change, just plug the key you wish to overwrite into your own filter with the new image sizes. In the example below I’m going to overwrite the md-banner size:

/**
 * Overwrite default image sizes added by the MD theme.
 */

function md_child_theme_image_sizes( $sizes ) {

	$sizes['md-banner'] = array(
		'width' => 1000,
		'height' => 500
	);

	return $sizes;

}

add_filter( 'md_filter_image_sizes', 'md_child_theme_image_sizes' );

Leave a Comment