For anyone else looking for an automated solution to ensure all images throughout your WordPress site have the appropriate width
and height
attributes set, the following plugin will take care of it for you: Specify Image Dimensions.
You can take a look at the source code and add it in your own functions.php
as an alternative, like so:
add_action( 'plugins_loaded', 'factmaven_spcimg_buffer', 10, 1 );
function factmaven_spcimg_buffer() { // Enable output buffering for our function
ob_start( 'factmaven_spcimg_specify_image_dimensions' );
}
function factmaven_spcimg_specify_image_dimensions( $content ) { // Automatically insert width and height attributes
if ( is_admin() && ( ! defined( 'DOING_AJAX' ) || ! DOING_AJAX ) ) { // Don't run the function in the admin panel
return $content;
}
preg_match_all( '/<img[^>]+>/i', $content, $images );
if ( count( $images ) < 1 ) { // Don't change content if there are no images
return $content;
}
foreach ( $images[0] as $image ) {
preg_match_all( '/(src|alt|title|class|id|width|height)=("[^"]*")/i', $image, $img );
if ( !in_array( 'src', $img[1] ) ) {
continue;
}
if ( !in_array( 'width', $img[1] ) || !in_array( 'height', $img[1] ) ) {
$src = $img[2][array_search( 'src', $img[1] )];
$alt = in_array( 'alt', $img[1] ) ? ' alt=' . $img[2][array_search( 'alt', $img[1] )] : '';
$title = in_array( 'title', $img[1] ) ? ' title=' . $img[2][array_search( 'title', $img[1] )] : '';
$class = in_array( 'class', $img[1] ) ? ' class=' . $img[2][array_search( 'class', $img[1] )] : '';
$id = in_array( 'id', $img[1] ) ? ' id=' . $img[2][array_search( 'id', $img[1] )] : '';
list( $width, $height, $type, $attr ) = getimagesize( str_replace( "\"", "" , $src ) );
$image_tag = sprintf( '<img src=%s%s%s%s%s width="%d" height="%d" />', $src, $alt, $title, $class, $id, $width, $height );
$content = str_replace( $image, $image_tag, $content );
}
}
return $content;
}