Responsive class to all the images in the content


I have used this function to add a responsive class to all the images in content but this breaks the html structure of the website. This wraps the content with :
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" ""><body> the content goes here (output from the_content();) </body></html>

function add_responsive_class($content)
    $content = mb_convert_encoding($content, 'HTML-ENTITIES', "UTF-8");
    if (!empty($content)) {
        $document = new DOMDocument();

        $imgs = $document->getElementsByTagName('img');
        foreach ($imgs as $img) {
            $classes = $img->getAttribute('class');
            $img->setAttribute('class', $classes . ' img-fluid');

        $html = $document->saveHTML();
        return $html;
add_filter('the_content', 'add_responsive_class');
add_filter('acf_the_content', 'add_responsive_class');

Can i know why? any alternative solution for this?

Latheesh V M Villa 3 months 0 Answers 9 views 0

Leave an answer