How to Add Bootstrap Responsive Image Classes in WordPress
If you have a Bootstrap based theme and would like to make sure any image inserted with the “Add Media” button has the correct responsive image class – you can easily do that with a few simple lines of code in your theme’s functions.php file.
Bootstrap 3 uses the class img-responsive while Bootstrap 4 and Bootstrap 5 use the class img-fluid. Assuming you would like to add it for Bootstrap 4+ – here is the code snippet needed to add in the needed class:
/**
* Add support for responsive images
* @params $classes (array)
*
*/
add_filter( 'get_image_tag_class', 'sdac_get_image_tag_class' );
function sdac_get_image_tag_class($classes) {
return $classes . ' img-fluid';
}
Once you have that in place, go to any post or page and insert a new image. Note the code will now include the correct Bootstrap class in there so all your images will be responsive.