Add new data attribute into get_image_tag function

Mate, did you solve this? I have the same problem and trying to solve it.

My code:

//Add fancybox class
define(“IMAGE_FILETYPE”, “(bmp|gif|jpeg|jpg|png)”, true);

function add_fancyboxlazyloading($string) {
$pattern = ‘/<a(.*?)href=”(.*?).(bmp|gif|jpeg|jpg|png)”(.*?)><img (.*?) /’;
$replacement = ‘<a$1href=”$2.$3″ class=\’fancybox\’><img src=”#” data-orignal=”$2″ class=”lazy” ‘;
return preg_replace($pattern, $replacement, $string);
}

add_filter(‘the_content’, ‘add_fancyboxlazyloading’);

Trying to get this string:
<img src=”loading.gif” data-orignal=”https://localhost/wp-content/uploads/2011/10/aw2011&#8243; class=”lazy” alt=”” title=”021700_Summer_Desserts_2011_Sleekster_lid” width=”560″ height=”595″ class=”alignnone size-medium wp-image-1208″ />

The solution:

//Fancybox and Lazy load support
function add_fancybox_lazyload($content) {
global $post;
$pattern =”/<a(.*?)href=(‘|\”)(.*?).(bmp|gif|jpeg|jpg|png)(‘|\”)(.*?)>/i”;
$replacement = ‘<a$1href=$2$3.$4$5 class=”fancybox”>’;
$content = preg_replace($pattern, $replacement, $content);

$search = ‘/src\=\”([^\s]+(?=\.(jpg))\.\2)\”/’;
$content = replacer($content, $search, ‘/src/’, ‘data-original’);
$search = ‘/img\ class\=\”/’;
$content = replacer($content, $search, ‘/class\=\”/’, ‘class=”lazy ‘);
$search = ‘/alt/’;
$content = replacer($content, $search, ‘/alt/’, ‘src=”grey.gif”‘);

return $content;
}

function replacer($src, $search, $find, $replace){
preg_match_all($search, $src, $result, PREG_OFFSET_CAPTURE);
foreach($result[0] as $entry){
$org = $entry[0];
$rep = preg_replace($find, $replace, $entry[0]);
$org = “/” .str_replace(array(“=”,”:”,”/”,”.”,”-“,”_”,'”‘,”‘”,” “), array(“\=”,”\:”,”\/”,”\.”,”\-“,”\_”,’\”‘,”\'”,”\ “), $org). “/”;
$src = preg_replace($org, $rep, $src);
}
return $src;
}

add_filter(‘the_content’, ‘add_fancybox_lazyload’);

Hey this is awesome, I have been looking for this for a while.
Just one tip,

In this line:
$search = '/src\=\"([^\s]+(?=\.(jpg))\.\2)\"/';

I think the other image formats should be introduced, so my suggestion is:
$search = '/src\=\"([^\s]+(?=\.(bmp|gif|jpeg|jpg|png))\.\2)\"/';

A problem I am experiencing with alex20hz code is that it replaces every text where ‘alt’ is written with the src=”…”.

How can I solve this?

hei alvaro, you got a response in wp.se ??

Sorry, I don’t understand what you mean. I asked there too but there is no response yet..

I see it now, thanks! Let me test it and if it works I’ll also post it here’

Thanks to Pedro ghandi that answered my question here: https://wordpress.stackexchange.com/questions/60792/replace-image-attributes-for-lazyload-plugin-data-src

Here is my final code:

function add_lazyload($content) {
     $dom = new DOMDocument();
     @$dom->loadHTML($content);

     foreach ($dom->getElementsByTagName('img') as $node) {
         $oldsrc = $node->getAttribute('src');
         $node->setAttribute("data-original", $oldsrc );
         $newsrc = ''.get_template_directory_uri().'/library/images/nothing.gif';
         $node->setAttribute("src", $newsrc);
     }
     $newHtml = $dom->saveHtml();
     return $newHtml;
}

add_filter('the_content', 'add_lazyload');

This inside functions.php

Thanks!