Title: Help with code
Last modified: October 25, 2021

---

# Help with code

 *  Resolved [Tony Franco](https://wordpress.org/support/users/tony-franco/)
 * (@tony-franco)
 * [4 years, 7 months ago](https://wordpress.org/support/topic/help-with-code-21/)
 * Dear Sir,
 * Thank you by your plugin! It works very well!
 * Please, i have a doubt concerning adding attribute to img tag. Sorry by asking
   you this, but maybe you could help me.
 * I´m having difficult to set the attribute loading=”eager” for a section that 
   contains 4 images been loaded. These images are above the fold, so for these 
   images i want to avoid the lazying load.
 * At wordpress recomendation, it is said to use loading=”eager” to download immediately
   the image. How could i add this attribute to these img tags?
 * Thanks and Regards,
    Tony

Viewing 4 replies - 1 through 4 (of 4 total)

 *  Plugin Author [yasir129](https://wordpress.org/support/users/yasir129/)
 * (@yasir129)
 * [4 years, 7 months ago](https://wordpress.org/support/topic/help-with-code-21/#post-15011258)
 * Hi,
    It depends on how are you adding those images and what are you using to 
   lazy load the images. If you are using custom code then you can easily add eager
   attribute into the image tag and if you are using a plugin to lazy load images
   then you can exclude the above-the-fold images using the plugin’s setting.
 *  Thread Starter [Tony Franco](https://wordpress.org/support/users/tony-franco/)
 * (@tony-franco)
 * [4 years, 7 months ago](https://wordpress.org/support/topic/help-with-code-21/#post-15011891)
 * Hi [@yasir129](https://wordpress.org/support/users/yasir129/)
 * Thank you by your return!
 * Images are been displayed by a plugin, and it hasn´t the option to set attributes
   for images. What i did is to create a div called (#destaque) and inside of it
   putted the shortcode that display the posts with these images.
 * To lazy load images i´m using this code:
 * add_filter(‘the_content’,’new_content’, 998);
    function new_content($content){
   $content = str_replace(‘<img’,'<img loading=”lazy”‘, $content); return $content;}
 * For the above the fold, i tried this, but didn´t work:
 * add_filter(‘the_content’,’outro_content’, 999);
    function outro_content($content){
   foreach ($content->getElementsById(‘destaque’) as $img) { $img = str_replace(‘
   lazy’, ‘eager’, $content); } return $content; }
 * Regards,
    Tony
 *  Plugin Author [yasir129](https://wordpress.org/support/users/yasir129/)
 * (@yasir129)
 * [4 years, 7 months ago](https://wordpress.org/support/topic/help-with-code-21/#post-15018474)
 * In foreach loop $content->getElementsById(“destaque”) won’t work as getElementsById
   is not a PHP function.
 * You may look at these links for more info:
    [https://wphelp.blog/how-to-selectively-disable-lazy-load/](https://wphelp.blog/how-to-selectively-disable-lazy-load/)
 * [https://developer.wordpress.org/reference/functions/wp_img_tag_add_loading_attr/](https://developer.wordpress.org/reference/functions/wp_img_tag_add_loading_attr/)
    -  This reply was modified 4 years, 7 months ago by [yasir129](https://wordpress.org/support/users/yasir129/).
 *  Thread Starter [Tony Franco](https://wordpress.org/support/users/tony-franco/)
 * (@tony-franco)
 * [4 years, 7 months ago](https://wordpress.org/support/topic/help-with-code-21/#post-15019771)
 * Hi [@yasir129](https://wordpress.org/support/users/yasir129/)
 * Thank you very much by your return and solution!
 * I have difficulties, but i´m learning a little every day.
 * After visiting the first link, i have applied this code for my home page: (4 
   images above the fold)
 *     ```
       function add_responsive_class($content){
       	if (is_page('ID OF HOME')) {
       		$content = mb_convert_encoding($content, 'HTML-ENTITIES', "UTF-8");
       		$document = new DOMDocument();
       		libxml_use_internal_errors(true);
       		$document->loadHTML(utf8_decode($content));
       		$imgA = $document->getElementsByTagName('img')->item(0);
       		$imgB = $document->getElementsByTagName('img')->item(1);
       		$imgC = $document->getElementsByTagName('img')->item(2);
       		$imgD = $document->getElementsByTagName('img')->item(3);
       		$imgA->setAttribute('loading', 'eager');
       		$imgB->setAttribute('loading', 'eager');
       		$imgC->setAttribute('loading', 'eager');
       		$imgD->setAttribute('loading', 'eager');
   
       		$html = $document->saveHTML($document->documentElement);
       		//$html = $document->saveHTML();
       		return $html;
       	} else {
       		return $content;
       	}
       }
       add_filter ('the_content', 'add_responsive_class', 999);
       ```
   
 * IT´S WORKING!!!
 * For posts, the first image, the code:
 *     ```
       function add_responsive_class_2($content){
       	if (is_single()) {
       		$content = mb_convert_encoding($content, 'HTML-ENTITIES', "UTF-8");
       		$document = new DOMDocument();
       		libxml_use_internal_errors(true);
       		$document->loadHTML(utf8_decode($content));
       		$imgA = $document->getElementsByTagName('img')->item(0);
       		//$imgA->setAttribute('loading', 'eager');
       		$imgA->removeAttribute('loading');
   
       		$html = $document->saveHTML($document->documentElement);
       		//$html = $document->saveHTML();
       		return $html;
       	} else {
       		return $content;
       	}
       }
       add_filter ('the_content', 'add_responsive_class_2', 998);
       ```
   
 * I will be testing all the functions, but it looks like that all is ok.
 * If you have some suggestion, please say.
 * Thanks and Best Regards,
    Tony

Viewing 4 replies - 1 through 4 (of 4 total)

The topic ‘Help with code’ is closed to new replies.

 * ![](https://s.w.org/plugins/geopattern-icon/specify-missing-image-dimensions.
   svg)
 * [Specify Missing Image Dimensions](https://wordpress.org/plugins/specify-missing-image-dimensions/)
 * [Frequently Asked Questions](https://wordpress.org/plugins/specify-missing-image-dimensions/#faq)
 * [Support Threads](https://wordpress.org/support/plugin/specify-missing-image-dimensions/)
 * [Active Topics](https://wordpress.org/support/plugin/specify-missing-image-dimensions/active/)
 * [Unresolved Topics](https://wordpress.org/support/plugin/specify-missing-image-dimensions/unresolved/)
 * [Reviews](https://wordpress.org/support/plugin/specify-missing-image-dimensions/reviews/)

 * 4 replies
 * 2 participants
 * Last reply from: [Tony Franco](https://wordpress.org/support/users/tony-franco/)
 * Last activity: [4 years, 7 months ago](https://wordpress.org/support/topic/help-with-code-21/#post-15019771)
 * Status: resolved