How to access the html content of the page?

  • I am trying to replace the img tags of the dom before it is printed, for that I need to access the html of the page but the_content filter does not work for me.

    This is my last code I tried but it doesn’t do anything at all:

    Update: I tried the get image_tag filter supposedly suitable for this task but it doesn’t change anything anyway, it doesn’t work

    function image_tag($html, $id, $alt, $title) {
	return preg_replace(array(
			'/'.str_replace('//','//',get_bloginfo('url')).'/i',
			'/s+width="d+"/i',
			'/s+height="d+"/i',
			'/alt=""/i'
		),
		array(
			'',
			'',
			'',
			'alt="' . $title . '"'
		),
		$html);
}
add_filter('get_image_tag', 'image_tag', 0, 4);
    function change_html($the_content) {
    
$post = new DOMDocument();
    $post->loadHTML($the_content);
    $imgs = $post->getElementsByTagName('img');

  
    foreach( $imgs as $img ) {

 
        if( $img->hasAttribute('data-src') ) continue;
        if( $img->parentNode->tagName == 'noscript' ) continue;

        $clone = $img->cloneNode();

        $src = $img->getAttribute('src');
        $img->removeAttribute('src');   
        $img->setAttribute('data-src', $src);

        $width = $img->getAttribute('width');
        $img->removeAttribute('width');
        $img->setAttribute('data-width', $width);

        $height = $img->getAttribute('height');
        $img->removeAttribute('height');
        $img->setAttribute('data-height', $height);

        $imgClass = $img->getAttribute('class');
        $img->setAttribute('class', $imgClass . ' fs-img');

        $no_script = $post->createElement('noscript');
        $no_script->appendChild($clone);
        $img->parentNode->insertBefore($no_script, $img);
        

        
    };

     return $post->saveHTML();
 }

 add_filter('the_content', 'change_html');
    • This topic was modified 2 years, 7 months ago by ashop59.
Viewing 1 replies (of 1 total)

  • @ashop59 When I add your code (second example) to the top of my functions.php file, it works as expected, and I see the class names and other properties changed in the images. You may want to check and make sure there isn’t some other custom code interfering with your code or that the priority of the filter is high enough. If you look at the documentation for add_filter(), you’ll see that you can pass a third parameter for priority. Try setting that to a high number (9999) or a low number (1) and see if that makes a difference.

    If that doesn’t work, try switching your theme to a default theme for testing (I tested with Twenty Twenty) and disable your plugins one by one to see if you can determine if a plugin is making a difference.

    Also, I’d recommend adding the following check to the top of your function to ensure that the replacement is only performed on a query for the main post pages (if that’s indeed what you’re trying to accomplish)

    if ( ! ( is_singular() && in_the_loop() && is_main_query() ) ) {
		return;	
	}
Viewing 1 replies (of 1 total)
  • The topic ‘How to access the html content of the page?’ is closed to new replies.