Изменить вывод WordPress get_image_tag?
В соответствии с jQuery.lazyload любые изображения, которые я хотел бы «лениво», должны иметь src атрибут заменен на data-original,
Я предполагаю, что могу сделать это с помощью WordPress get_image_tag фильтр, но я застрял на том, как на самом деле сделать это.
function image_src( $id, $alt, $title, $align, $size ) {
$html = '<img data-orginial="' . esc_attr($img_src) . '"/>';
return $html;
}
add_filter( 'get_image_tag', 'image_src', 10, 5 );
Для ленивой работы lazy класс также должен быть размещен на IMG, который мне удалось получить с помощью WordPress get_image_tag_class фильтр
function image_class( $classes ) {
return $classes . ' lazy';
}
add_filter( 'get_image_tag_class', 'image_class' );
Любые мысли о том, как я могу изменить вывод IMG, чтобы заменить data-orginial вместо src?
Решение
Богатые-
Я столкнулся с той же проблемой и пошел по тому же пути, что и вы, пытаясь использовать get_image_tag с плохими результатами. Поэтому я предложил обходной путь JS — комментарии к коду должны показать вам, как это работает:
function() {
// To get lazy loading working on blog post
// 1- Assign all image source paths into a sourcePath variable
var sourcePath = $("figure").find("img").attr("src");
// 2- Nullify source paths, move path to data-original attribute and add lazy-load class to img
$("figure").find("img").attr({
"src" : " ",
"data-original" : sourcePath
}).addClass("lazy-load");
// 3- Applies lazy-loading jQuery plugin to image elements
$("img.lazy-load").lazyload({
effect : "fadeIn"});
}
Другие решения
Вам нужно будет заменить src часть
function image_src( $id, $alt, $title, $align, $size ) {
if( ! is_admin() ) $html = str_replace("img src=","img data-original=",$html);
return $html;
}
add_filter( 'get_image_tag', 'image_src', 10, 5 );
Возможно, вам придется настроить его так, чтобы он соответствовал оригиналу <img> Настройки.
Редактировать: добавлено предложение Натха.