WordPress Hack: Remove Width And Height Attributes From Images

Back in 2013, WordPress automatically added width and height attributes to every image element (i.e. every <img> tag) you inserted into a post. At the time, this often caused headaches: responsive themes relied on fluid CSS layouts, and a hard-coded width="600" height="400" on an image could fight with that fluid sizing, causing images to look stretched, squashed, or oddly cropped on different screen sizes. So a common “fix” floating around the WordPress community was to strip those attributes out entirely with a regex filter. This post originally shared that old hack. It is now outdated, and the original advice will actively hurt your site if you still use it. Read on for why, and for what to do instead.

Why This Hack Existed In 2013

Before responsive images (srcset, sizes) were standardized and widely supported, developers needed a way to let images scale fluidly inside flexible-width containers. A fixed width/height attribute baked into the HTML could conflict with a theme’s CSS, so removing those attributes via a preg_replace() filter was a popular workaround. Here’s the original code, kept for historical reference only:

The Old Approach — Don’t Use This Anymore

add_filter( 'post_thumbnail_html', 'remove_thumbnail_dimensions', 10 );
add_filter( 'image_send_to_editor', 'remove_thumbnail_dimensions', 10 );
add_filter( 'the_content', 'remove_thumbnail_dimensions', 10 );
function remove_thumbnail_dimensions( $html ) {
    $html = preg_replace( '/(width|height)="d*"s/', "", $html );
    return $html;
}

The filters it hooked into:

post_thumbnail_html — filters any post thumbnails
image_send_to_editor — filters the HTML when adding an image to the editor
the_content — removes the attributes from images output in post content

Genesis framework users added one more line to also catch images rendered by Genesis’s own image function:

// Genesis framework only
add_filter( 'genesis_get_image', 'remove_thumbnail_dimensions', 10 );

Why This Is Now Outdated — And Actively Counterproductive

Since WordPress 5.5 (released in 2020), WordPress automatically adds width and height attributes to images for a very specific, very good reason: preventing layout shift. When a browser knows an image’s dimensions ahead of time, it can reserve the correct amount of space in the page layout before the image file has even finished downloading. Without those dimensions, the browser doesn’t know how tall the image will be, so it renders the page, then suddenly shifts everything below the image down (or up) once the image loads. That jump is exactly what Cumulative Layout Shift (CLS) measures — one of Google’s Core Web Vitals, and a factor in page experience scoring used in search ranking. In other words, the regex hack above does the opposite of what you want today. Stripping width/height attributes:

Removes the layout information browsers need to reserve space for images
Increases CLS, making your pages feel janky as they load
Can hurt your Core Web Vitals scores, which factor into search ranking and page experience

If you applied this hack to a site years ago and forgot about it, it is worth removing the filter entirely.

The Correct Modern Approach

Keep the width and height HTML attributes WordPress adds. Do not strip them. Instead, solve the original “fluid layout” problem in CSS, where it belongs:

img {
  max-width: 100%;
  height: auto;
}

This small CSS rule gives you the best of both worlds:

The width/height HTML attributes stay in place, so the browser can calculate the image’s aspect ratio and reserve the correct space in the layout before it loads — preventing CLS.
max-width: 100% lets the image shrink to fit smaller containers or screens instead of overflowing.
height: auto lets the image’s height scale proportionally as its displayed width changes, so it never looks stretched or squashed.

Most modern WordPress themes already include this rule (or an equivalent) in their base stylesheet. If yours doesn’t, adding it to your theme’s stylesheet (or via the Additional CSS panel in the Customizer) is all you need — no PHP filter required.

FAQs

Will removing width/height attributes ever make sense?

No. With modern responsive CSS and the srcset/sizes attributes WordPress generates automatically, there is no longer a good reason to strip dimension attributes from images. Doing so only removes information browsers use to prevent layout shift.

What if I already applied this hack on my site?

Remove the add_filter() calls from your functions.php file (or disable the snippet/plugin that added them), then make sure your theme’s CSS includes an img { max-width: 100%; height: auto; } rule. Once removed, WordPress will resume adding width/height attributes to new and existing image markup automatically.

Does this affect my Core Web Vitals scores?

Yes. Cumulative Layout Shift (CLS) is one of the three Core Web Vitals metrics Google uses as a page experience signal. Images loading without reserved space are one of the most common causes of poor CLS scores, and Google’s own guidance recommends always including width and height attributes (or aspect-ratio CSS) on images.

Conclusion

What was a reasonable workaround in 2013 is a liability today. Let WordPress keep adding width and height attributes to your images, and handle responsive scaling in CSS with img { max-width: 100%; height: auto; } instead. It’s simpler than the old PHP filter, and it actively helps your Core Web Vitals rather than hurting them.

@ankurm