+7-499-70-300-44
заказать звонок
Заказать обратный звонок

Я свяжусь с Вами в течении 10 минут и отвечу на все Ваши вопросы.

Введите ваше имя *

Введите контактный телефон *

Введите контактный e-mail *

Спасибо за оставленную заявку
Ожидайте звонка

Подключаем Lazy Load к WordPress без плагина

ee36037bbffac213840f0999c8267562

1) Подключаем библиотек Jquery
2) Подключаем скрипт LazyLoad от http://www.appelsiini.net/projects/lazyload, например.
3) Добавляем код в файл function.php вашего шаблона.

/**
 * Takes a string and modifies any <img> tags within it by:
 * - Adding the class 'lazy'
 * - Removing the 'src' attribute
 * - Adding the 'data-original' attribute using the original 'src' value
 *
 * @param $content
 * @return string
 */
function themename_lazyload_modify_img_tags( $content ) {
  $content = mb_convert_encoding($content, 'HTML-ENTITIES', "UTF-8");

  // Get out if we don't have any content
  if ( empty($content) )
    return $content;

  $document = new DOMDocument();
  libxml_use_internal_errors(true);
  $document->loadHTML(utf8_decode($content));

  // Grab all image tags
  $imgs = $document->getElementsByTagName('img');

  // Loop through all image tags
  foreach ($imgs as $img) {

    $existing_class = $img->getAttribute('class');  // Store existing class (if the image has one applied)
    $src = $img->getAttribute('src');               // Store src attribute value

    // Add 'lazy' class and the existing class(es) to the image
    $img->setAttribute('class', "lazy $existing_class");

    // Add a 'data-original' attribute with our 'src' attribute value
    $img->setAttribute('data-original', $src);

    // Remove our src attribute
    $img->removeAttribute('src');

  }

  $html = $document->saveHTML();
  return $html;
}




add_filter( 'the_content', 'themename_enable_lazy_loading_the_content' );
/**
 * Modifies the content to enable lazy loading for all <img> tags
 *
 * @uses themename_lazyload_modify_img_tags()
 * @param $content
 * @return string
 */
function themename_enable_lazy_loading_the_content( $content ) {
  return themename_lazyload_modify_img_tags($content);
}

4. Добавляем JS

$("img.lazy").lazyload({
    threshold : 1500
});

Если используем Infiniti Scroll, то добавляем

$("img.lazy").lazyload({ 
      threshold : 1500
}).removeClass("lazy");
$(document).ajaxStop(function(){
    $("img.lazy").lazyload({ 
        threshold : 1500
    }).removeClass("lazy");
});

Альтернатива

add_filter (  'wp_get_attachment_image_attributes' ,  'wpse8170_add_lazyload_to_attachment_image' ,  10 ,  2  ); 
function wpse8170_add_lazyload_to_attachment_image ( $attr , $attachment )  { 
    $attr [ 'data-original' ]  = $attr [ 'src' ]; 
    $attr [ 'src' ]  =  'grey.gif' ; 
    return $attr ; 
}

Другие статьи

Заказать обратный звонок

Я свяжусь с Вами в течении 10 минут и отвечу на все Ваши вопросы.

Введите ваше имя *

Введите контактный телефон *

Введите контактный e-mail *

Расчет стоимости
Введите ваше имя и телефон.
Я лично перезвоню Вам для уточнения деталей,
необходимых для расчета стоимости проекта.

Введите ваше имя *

Введите контактный телефон *

Указать точное время звонка

или позвоните мне по телефону
+7-499-70-300-44
Расчет стоимости
Введите ваше имя и телефон.
Я лично перезвоню Вам для обсуждения деталей,
необходимых для расчета стоимости проекта.

Введите ваше имя *

Введите контактный телефон *

Введите адрес сайта, который нуждается в продвижении *

Указать точное время звонка

или позвоните нам по телефону
+7-499-70-300-44
Спасибо за оставленную заявку
Ожидайте звонка
Расчет стоимости
Введите ваше имя и телефон.
Я лично перезвоню Вам для уточнения деталей,
необходимых для расчета стоимости проекта.

Введите ваше имя *

Введите контактный телефон *

Указать точное время звонка

или позвоните мне по телефону
+7-499-70-300-44
Спасибо за оставленную заявку
Ожидайте звонка
Хочу так же
Введите ваше имя и телефон.
Я лично перезвоню Вам для уточнения деталей.

Введите ваше имя *

Введите контактный телефон *

Указать точное время звонка

или позвоните мне по телефону
+7-499-70-300-44
[contact-form-7 404 "Not Found"]
Спасибо за оставленную заявку
Ожидайте звонка
Заказ СЕО продвижения
Введите ваше имя и телефон.
Я лично свяжусь с Вами для обсуждения деталей.

Введите ваше имя *

Введите контактный телефон *

Введите ваш Скайп *

Спасибо за оставленную заявку
Ожидайте звонка