Remove Image Size Attributes for Responsive Images in WordPress

WordPress, by default, will add the width and height attributes to image elements. These attributes will override CSS width and height properties. Making images with these dimension attributes responsive is a bit of a hassle, or in some cases cannot be done at all.

Strip Image Dimension Attributes from Inserted Images

Stripping out the image size attributes will make sure that you will have complete control over the image size in CSS. You can use the following code to remove these attributes:

Just be aware that this code will only strip the site attributes from image tags when an image is a featured image or when an image is added to a post. Existing images that have been uploaded to a post will be unaffected.

Remove width and height attributes via JavaScript

For existing posts, you will have to go and remove the width and height attributes manually, or you can resort to using a bit of jQuery to solve the problem:

It is very likely that you may want to scope the jQuery selector for your specific use-case, but this will do the trick quite nicely. If you are working on a non-WordPress project, this solution will work as long as jQuery is loaded.

Plugin Solution for Stripping Image Size Attributes

If you aren’t the coding type, or prefer to use a plugin and not add the code to your project, just install the Image Size Attributes Remover plugin.

2 thoughts on “Remove Image Size Attributes for Responsive Images in WordPress”

Leave a Reply

Your email address will not be published. Required fields are marked *