WordPress.org

Српски

Преузми Вордпрес
WordPress.org

Plugin Directory

Додатак LazyLoad – одложено учитавање слика, видео снимака и iframe-ова

Додатак LazyLoad – одложено учитавање слика, видео снимака и iframe-ова

Аутор: WP Media
Преузми

Опис

LazyLoad је најбољи бесплатни додатак за одложено учитавање слика, видео снимака и iframe-ова на Вордпресу. Укратко, LazyLoad приказује слике, видео снимке и iframe-ове на страници тек када постану видљиви кориснику – то је један од кључних начина да убрзате свој Вордпрес сајт и оптимизујете слике за Google PageSpeed.

Можете одложено учитавати слике у садржају чланака или тексту виџета, као и сличице, аватаре и смајлије. LazyLoad се брине и о одложеном учитавању iframe-ова: YouTube iframe-ове лако ћете заменити сличицом за преглед да бисте додатно скратили време учитавања свог веб сајта.

Не користи се ниједна JavaScript библиотека као што је jQuery, а скрипта је мања од 10 KB.

Зашто је одложено учитавање кључно за перформансе?

Одложено учитавање је кључна техника за побољшање перформанси која убрзава ваш сајт. Скратићете време учитавања, побољшати оцену перформанси у Lighthouse-у и побољшати оцене Core Web Vitals.

Одложено учитавање слика на Вордпресу помоћи ће вам да постигнете бољу оцену у PageSpeed Insights из три главна разлога:

Погледајте наш потпуни списак разлога зашто треба да користите одложено учитавање. Затим укључите LazyLoad и убрзајте свој Вордпрес веб сајт!

Зависности

LazyLoad скрипта: https://github.com/verlok/lazyload

Постављање

  1. Отпремите целу фасциклу rocket-lazy-load у директоријум /wp-content/plugins/
  2. Укључите додатак у изборнику „Додаци“ у Вордпресу

ЧПП

Како да користим изворно одложено учитавање?

Да бисте користили изворно одложено учитавање у прегледачима који подржавају ову могућност, потребно је да употребите следећи ред:

add_filter( 'rocket_use_native_lazyload', '__return_true' );

Прегледачи који не подржавају изворно одложено учитавање користиће решење засновано на JS-у, као и до сада.

Како да искључим Lazy Load на неким страницама?

Можете користити филтер do_rocket_lazyload.

Ево примера који треба ставити у датотеку functions.php, а који искључује одложено учитавање на чланцима:

add_action( 'wp', 'deactivate_rocket_lazyload_on_single' );
function deactivate_rocket_lazyload_on_single() {
    if ( is_single() ) {
        add_filter( 'do_rocket_lazyload', '__return_false' );
    }
}

Како да искључим Lazy Load на неким сликама?

Једноставно додајте својство data-no-lazy="1" у своју ознаку img или iframe.

Можете користити и филтере rocket_lazyload_excluded_attributes или rocket_lazyload_excluded_src да бисте изузели одређене обрасце.

За iframe-ове, филтер је rocket_lazyload_iframe_excluded_patterns.

Како да променим праг који покреће учитавање?

Можете користити филтер rocket_lazyload_threshold.

Пример кода:

function rocket_lazyload_custom_threshold( $threshold ) {
    return 100;
}
add_filter( 'rocket_lazyload_threshold', 'rocket_lazyload_custom_threshold' );

Како уклонити ознаку „

Можете користити филтер rocket_lazyload_noscript да бисте искључили додавање ознаке <noscript> која се користи ради усаглашености када је JS искључен.

add_filter( 'rocket_lazyload_noscript', '__return_false' );

Како променити чувар места за одложено учитане слике

Можете користити rocket_lazyload_placeholder да бисте променили подразумевани чувар места за одложено учитане слике.

function rocket_lazyload_custom_placeholder( $placeholder ) {
    return 'default.jpg';
}
add_filter( 'rocket_lazyload_placeholder', 'rocket_lazyload_custom_placeholder' );

Како променити HTML излаз пре слања прегледачу

Можете користити филтер rocket_lazyload_html да бисте изменили HTML излаз створен након примене одложеног учитавања, а пре слања прегледачу.

Како изузети YouTube видео снимке из одложеног учитавања

Можете користити филтер rocket_lazyload_exclude_youtube_thumbnail да бисте изузели обрасце који одговарају YouTube видео снимцима које не желите да одложено учитате.

function rocket_lazyload_exclude_youtube( $patterns ) {
    $patterns[] = 'string_to_match';

    return $patterns;
}
add_filter( 'rocket_lazyload_exclude_youtube_thumbnail', 'rocket_lazyload_exclude_youtube' );

Користим додатак X и моје слике се више не приказују

Неки додаци нису усаглашени без одложеног учитавања. Отворите тему на форуму подршке и видећемо како можемо решити проблем искључивањем одложеног учитавања за тај додатак.

Како да одложено учитам позадинску слику?

Додатак ће аутоматски одложено учитати позадинске слике постављене атрибутом style на елементу div:

<div style="background-image: url(image.jpg);">

Можете га применити и ручно. Елемент на који желите да примените одложено учитавање мора имати следећи посебан запис:

<div class="rocket-lazyload" data-bg="url(../img/image.jpg)"></div>

Елемент мора имати класу rocket-lazyload и атрибут data-bg, чија је вредност CSS url слике.

Где да пријавим безбедносне грешке пронађене у овом додатку?

Све безбедносне грешке пронађене у изворном коду додатка site-reviews можете пријавити путем Patchstack програма за откривање рањивости. Тим Patchstack-а ће вам помоћи око провере, доделе CVE ознаке и побринуће се да обавести програмере овог додатка.

Повезани додаци

Рецензије

Lost all page content now restoring backup

21. јул 2024.
Installed the plugin and selected the three options from settings and checked the website so find all content missing. I then reversed the process but content still missing and not visible in backend. Attempting to restore from backup.

It’s working like a charm!

26. јун 2024.
This plugin added lazy loading functionality to my custom WordPress theme, worked like a charm! Thank you a lot! 🙏🏼👨🏻‍💻
Прочитај свих 139 рецензија

Сарадници и градитељи

„Додатак LazyLoad – одложено учитавање слика, видео снимака и iframe-ова“ је софтвер отвореног кода. Следећи људи су допринели овом додатку.

Сарадници

„Додатак LazyLoad – одложено учитавање слика, видео снимака и iframe-ова“ је преведен на 16 језика. Хвала преводиоцима на њиховим доприносима.

Преведите „Додатак LazyLoad – одложено учитавање слика, видео снимака и iframe-ова“ на свој језик.

Заинтересовани сте за развој?

Прегледајте кôд, погледајте SVN складиште или се претплатите на дневник развоја преко RSS-а.

Дневник измена

2.4.1

Исправка грешке: побољшано препознавање атрибута за позадинске слике и ојачан приказ сличица YouTube видео снимака (rocket-lazyload-common 3.0.22)

2.4.0

Безбедност: исправљена рањивост Stored Cross-Site Scripting (XSS) за пријављене кориснике, коју је пријавио Pathstack.

2.3.9

Ажурирано издање ради исправке неслагања између ознаке издања на GitHub-у и броја издања, што доводи до проблема при објављивању.

2.3.8

Побољшање: усаглашеност са Launchpad-ом (погледајте https://github.com/wp-launchpad)
Побољшање: подигнута усаглашеност са PHP > 7.3
Грешка: уклоњен wp-media/rocket-lazyload-common из vendors
Побољшање: wp-media/rocket-lazyload-common подигнут на 3.0

2.3.7

Исправка грешке: уклоњен филтер rocket_lazyload_polyfill због рањивости у polyfill-у

2.3.5

Побољшање: додатак тестиран са најновијим издањем Вордпреса v5.9.3
Побољшање: измењен садржај WP readme датотеке.

2.3.4

Побољшање: омогућено да ознаке <a> одложено учитавају позадинске слике
Побољшање: додата ознака на одложено учитане елементе picture
Исправка грешке: спречена кобна грешка у вези са сукобом пакета League Container са WooCommerce-ом 4.4
Исправка грешке: ажурирано одложено учитавање позадинских слика ради подршке за ново издање lazyload скрипте
Исправка грешке: исправно се примењује класа rocket-lazyload на елементе са позадинском сликом и празном вредношћу класе
Исправка грешке: исправно се примењује класа rocket-lazyloadclass на елементе са неисправним HTML-ом
Исправка грешке: спречен проблем приказа позадинских слика када се око URL-а користе различите врсте наводника
Исправка грешке: спречено нарушавање распореда када атрибут alt садржи HTML кодиране знакове

2.3.3

Побољшање: класе data-skip-lazy и skip-lazy додате на списак изузетака у оквиру иницијативе за међусобну усаглашеност додатака за одложено учитавање
Побољшање: изворно одложено учитавање користи се само ако је филтер rocket_use_native_lazyload true
Побољшање: одложено учитавање се примењује на позадинске слике постављене на елементима figure
Исправка грешке: исправно се додаје класа rocket-lazyload када је атрибут class празан на елементу са позадинском сликом
Исправка грешке: исправна замена YouTube iframe-а сликом за преглед када се користи релативни протокол
Исправка грешке: youtube-nocookie.com се задржава током LazyLoad-а

2.3.2

Исправка грешке: погрешни знакови у HTML коду YouTube сличице

2.3.1

Исправка грешке: спречен сукоб са WP Rocket-ом
Исправка грешке: примењује се loading=“lazy“ на YouTube сличицу
Исправка грешке: додат атрибут autoplay на iframe учитан преко YouTube сличице

2.3

Побољшање: додата подршка за изворно одложено учитавање у прегледачу
Исправка грешке: у неким случајевима спречена неисправна слика за елемент picture
Исправка грешке: спречени погрешни lazy атрибути за srcset и sizes на слици унутар елемента picture

2.2.3

  • Побољшање: побољшана усаглашеност за елемент picture
  • Побољшање: одложено учитавање се примењује на позадинске слике постављене на елементима section, span и li
  • Побољшање: вредности $width и $height прослеђују се и филтеру rocket_lazyload_placeholder
  • Исправка грешке: за подразумеване димензије чувара места користи се 0 уместо 1 ради боље усаглашености
  • Исправка грешке: побољшана подршка за бесконачно померање
  • Исправка грешке: позадинске слике Enfold avia-background-fixed и data-large_image изузете из одложеног учитавања

2.2.2

  • Исправка грешке: атрибут data-height-percentage аутоматски се изузима ради спречавања проблема са приказом
  • Исправка грешке: поново исправно руковање прилагодљивим видео снимцима помоћу fitVids-а

2.2.1

  • Побољшање: додат начин за прилагођавање могућности lazyload скрипте
  • Исправка грешке: спречена грешка у Internet Explorer-у 11
  • Исправка грешке: спречен сукоб са WooCommerce variation swatches
  • Исправка грешке: спречен празан src када је слика уметнути base64
  • Исправка грешке: спречен проблем када изворни атрибут src користи једноструке наводнике

2.2

  • Побољшање: lazyload скрипта ажурирана на најновије издање
  • Побољшање: када је могуће, за величину чувара места користе се димензије изворне слике, ради смањења померања садржаја
  • Побољшање: занемарују се слике које користе нови атрибут loading, који је Chrome увео за изворно одложено учитавање у прегледачу

2.1.5

  • Исправка грешке: спречено подударање са погрешним подацима када се атрибут data-style налази на div-у за позадинске слике
  • Подразумевано се уклања data-cfasync=“false“
  • Побољшање: додат филтер rocket_lazyload_script_tag за измену HTML-а lazyload скрипте по потреби
  • Побољшање: атрибут data-no-minify додат у ознаку lazyload скрипте да би се спречило да је JS спајачи споје
  • Побољшање: побољшан кôд за MutationObserver тако да позива методу за ажурирање одложеног учитавања само ако нови чворови додати у DOM садрже слику/iframe или елемент са .rocket-lazyload

2.1.4

  • Исправка регресије: скрипте се поново исправно изузимају из одложеног учитавања

2.1.3

  • Исправка грешке: садржај унутар ознака noscript се занемарује да би се спречила њихова измена и проблеми са приказом

2.1.2

  • Побољшање: lazyload скрипта ажурирана на најновије издање
  • Побољшање: додат начин за одложено учитавање слике YouTube сличице
  • Побољшање: атрибути width и height додати на слику YouTube сличице у зависности од резолуције
  • Побољшање: polyfill за intersectionObserver подразумевано је искључен, а додат је начин да се укључи
  • Побољшање: data-cfasync=“false“ додат у ознаку lazyload скрипте
  • Побољшање: спречено одложено учитавање у уређивачу страница Oxygen Builder
  • Исправка грешке: CSS за случај без JS-а смештен у ознаку noscript и уклоњен идентификатор no-js

2.1.1

  • Исправка грешке: исправно се примењује одложено учитавање на елементе picture
  • Исправка грешке: спречено двоструко учитавање слике када елемент img унутар елемента picture има само атрибут srcset, а нема атрибут src

2.1

  • Побољшање: lazyload скрипта ажурирана на најновије издање
  • Побољшање: одложено учитавање се примењује на елементе picture пронађене на страници
  • Побољшање: одложено учитавање се примењује на div елементе са позадинском сликом пронађене на страници. Више информација потражите у ЧПП.

2.0.4

  • Побољшање: додат филтер за изузимање образаца одложеног учитавања iframe-ова
  • Побољшање: образац soliloquy-image аутоматски се изузима из одложеног учитавања
  • Исправка грешке: спречен проблем када је слика/iframe удвостручен на истој страници
  • Исправка грешке: спречена грешка W3C провере за SVG чувар места

2.0.3.2

  • Исправка грешке: исправно се занемарују уметнуте скрипте са преломима реда

2.0.3.1

  • Исправка грешке: исправљен проблем који је спречавао рад одложеног учитавања

2.0.3

  • Исправка грешке: спречен неисправан приказ ако је JavaScript искључен
  • Исправка грешке: одложено учитавање се не примењује на страницама уређивача Divi/Extra/Beaver Builder
  • Исправка грешке: за сваки iframe користи се исправан URL када је више iframe-ова на истој страници
  • Исправка грешке: садржај унутар уметнутих ознака script се занемарује да се у њему не би примењивало одложено учитавање

2.0.2

  • Исправка грешке: исправљена грешка у усаглашености са додатком AMP

2.0.1

  • Исправка грешке: спречена кобна грешка на оперативним системима који разликују велика и мала слова

2.0

  • Побољшање: одложено учитавање сада се примењује на куки template_redirect, што би требало да омогући додатку да оптимизацију примени на више слика уз мање сукоба
  • Побољшање: lazyload скрипта циља посебно елементе слика/iframe-ова са атрибутом data-lazy-src
  • Побољшање: lazyload скрипта ажурирана на најновије издање
  • Побољшање: могућност примене одложеног учитавања на позадинске слике са посебним записом, погледајте ЧПП
  • Побољшање: као чувар места користи се SVG слика уместо base64 GIF-а
  • Исправка грешке: MutationObserver се користи само ако је доступан у прегледачу
  • Исправка грешке: при коришћењу могућности YouTube сличице, YouTube упит се исправно обликује ако је URL видео снимка кодиран
  • Исправка грешке: побољшано препознавање iframe-ова ради спречавања неочекиваних резултата
  • Исправка грешке: ажуриран CSS за могућност YouTube сличице ради спречавања проблема са Гутенберговим блоком за уградњу

1.4.9

  • Побољшање: lazyload скрипта ажурирана на најновије доступно издање
  • Побољшање: користи се lazy-sizes ради спречавања грешке W3C провере када је sizes задат, а srcset није
  • Побољшање: слике или iframe-ови се обрађују само ако је тај елемент у могућностима изабран за одложено учитавање
  • Исправка: спречено упозорење за lazyload+v у Google Search Console
  • Исправка: спречено PHP обавештење са WooCommerce-ом за слике производа

1.4.8

  • Напомена: најмање потребно издање Вордпреса сада је 4.7
  • Побољшање: ажурирано издање lazyload скрипте
  • Побољшање: уклоњена слика чувара места ради бржег утиска учитавања
  • Побољшање: усаглашеност са YouTube URL-ом за приватност
  • Побољшање: слика за пуштање ажурирана тако да одговара YouTube логотипу
  • Побољшање: подршка за параметре YouTube URL-а
  • Побољшање: одложено учитавање слика приказаних помоћу wp_get_attachment_image(). /!\ нема резервног решења ако је JavaScript искључен
  • Исправка: користи се исправна величина задата у srcset за одложено учитану слику
  • Исправка: спречена замена YouTube сличицом на плејлистама
  • Исправка: спречено одложено учитавање iframe-ова на AMP страницама
  • Исправка: исправљен домен текста за преводе (хвала @ Chantal Coolsma)

1.4.7

  • Исправљена усаглашеност са бесконачним померањем
  • Спречено одложено учитавање на сликама masterSlider-а

1.4.6

  • Исправно се укључује издање 8.5.2 lazyload скрипте
  • Спречена грешка 404 за lazyload скрипту ако URL садржи „-v“

1.4.5

  • Преименован назив странице подешавања у WP изборнику
  • Нови банер производа на страници подешавања
  • Условно се учитава друго издање скрипте у зависности од тога да ли прегледач подржава IntersectionObserver
  • Исправљена грешка због које се слике које су на почетку скривене не приказују исправно када дођу у видно поље (клизач, језичци, хармоника)

1.4.4

  • Нови изглед администрације

1.4.3

  • Додатак је поново усаглашен са PHP < 5.4

1.4.2

  • Ажурирана lazyload скрипта ради враћања усаглашености са IE9/10

1.4.1

  • Исправљена грешка изазвана превише агресивним чишћењем

1.4

  • Нова могућност: замена YouTube видео снимака сличицом. Ова могућност може знатно скратити време учитавања, нарочито ако имате више видео снимака на истој страници

1.3.3

  • 16. септембар 2017.
  • Спречено уклањање скрипти и стилова током обраде HTML-а

1.3.2

  • 12. септембар 2017.
  • Исправљен проблем са сликама које се у одређеним условима нису приказивале јер изузимање атрибута слика није исправно радило

1.3.1

  • 7. септембар 2017.
  • Одложено учитавање се не примењује на Divi клизач

1.3

  • 1. септембар 2017.
  • Побољшана обрада HTML-а слика и iframe-ова да буде бржа и делотворнија
  • Одложено учитавање усаглашено са fitVids-ом за iframe-ове
  • Одложено учитавање се не примењује на AMP страницама (усаглашено са додатком AMP компаније Automattic)
  • Као подразумевани чувар места за iframe користи се about:blank ради спречавања упозорења у конзоли прегледача
  • Одложено учитавање се не примењује на сличицу upPrev

1.2.1

  • 22. август 2017.
  • Исправљена недостајућа lazyload скрипта
  • Нема одложеног учитавања слика у захтевима REST API-ја

1.2

  • 22. август 2017.
  • Ажурирана lazyload скрипта на најновије издање
  • Измењен начин учитавања скрипте

1.1.1

  • 13. фебруар 2017.
  • Исправка грешке: уклоњена употреба кратке ознаке ради спречавања грешке 500 на неким инсталацијама

1.1

  • 12. фебруар 2017.
  • Ново
    • Ажурирана JS библиотека
    • Подршка за iFrame
    • Подршка за srcset и sizes
    • Нова страница могућности

1.0.4

  • 28. април 2015.
  • Исправка грешке: решен сукоб између LazyLoad-а & Emoji од Вордпреса 4.2

1.0.3

  • 8. јануар 2015.
  • Исправка грешке: LazyLoad се не примењује на CAPTCHA из Really Simple CAPTCHA ради спречавања сукоба.

1.0.2

  • 28. децембар 2014.
  • Побољшање: додат филтер « rocket_lazyload_html » за управљање излазом који ће бити исписан.

1.0.1.1

  • 25. јул 2014.
  • Исправљена глупа грешка са новим регуларним изразом у 1.0.1

1.0.1

  • 16. јул 2014.
  • Исправка грешке: када IMG ознака или садржај (виџета или чланка) садржи ниску „data-no-lazy“, занемаривале су се све IMG ознаке уместо само једне.
  • Безбедносна исправка: preg_replace() је могао да доведе до XSS рањивости, хвала Alexander Concha
  • Усклађеност кода

1.0

  • 1. јануар 2014.
  • Прво издање.

Мета

Оцене

4.2 од 5 звездица.

Ваша рецензија

Види све рецензије

Сарадници

Подршка

Имате нешто да кажете? Потребна вам је помоћ?

Види форум подршке