Remove srcset in  WordPress

How to remove all [srcset] attributes from images in WordPress.

Since version 4.4 WordPress has shipped with built-in responsive images. This feature will automatically add srcset size variations to all CMS controlled images.

Since WordPress 4.4, native responsive images is supported by including srcset and sizes attributes to the image markup it generates.

While srcset does have its uses, but sometimes it ends up creating more problems than it solves depending on the page and layout you’re working with.

Disable Responsive Images in WordPress

To completely disable the responsive images feature in WordPress with a single line of code:

/**
 * Disable Responsive Images
 */
add_filter( 'wp_calculate_image_srcset', '__return_false' );

That’s it, nothing more is needed. Surprisingly there are many other articles online covering the same topic, yet very few mention this simple approach.

Origins & Purpose of srcset

The srcset attribute was added to the HTML specification as a way to serve up different image sizes to a broad range of screen sizes, resolutions, and devices.

In theory, it’s a good thing, but in practice it can often create more problems than it solves. Using it can lead to an overly complex layout with many potential issues, where you find yourself pulling at strings when issues occur. When combined with @media queries, it can lead to unexpected behavior from having too many variations in layout.

More Details

Related Articles

Meet the Author

Kevin Leary, WordPress Consultant

I'm a custom WordPress web developer and analytics consultant in Boston, MA with 16 years of experience building websites and applications. View a portfolio of my work or request an estimate for your next project.