Как отключить автоматическую прокачку изображений в WordPress

Автоматическая прокачка изображений (lazy loading) внедрена в WordPress начиная с версии 5.5 и позволяет откладывать загрузку изображений вне экрана до момента прокрутки страницы до них. Это существенно ускоряет загрузку страниц и повышает производительность. Однако в некоторых случаях нужно отключить этот механизм: например, если он конфликтует с кастомными слайдерами, галереями или плагинами, либо если изображения должны быть загружены сразу для корректного отображения.

Почему стоит отключить lazy loading для изображений

Lazy loading — мощный инструмент оптимизации, но в ряде ситуаций он может создавать проблемы:

• Некорректная загрузка изображений в слайдерах и каруселях.
• Ошибки при работе с кастомными скриптами, которые управляют изображениями.
• SEO-аспекты — некоторые поисковые роботы могут не индексировать ленивозагружаемые изображения.
• Негативное влияние на пользовательский опыт, если изображения не появляются вовремя.

Если вы столкнулись с подобными проблемами, разумно отключить автоматическую прокачку.

Как отключить lazy loading на уровне темы или плагина

В WordPress по умолчанию у всех изображений в атрибут img добавляется loading="lazy". Чтобы отключить это, можно использовать фильтр wp_lazy_loading_enabled. Пример кода для файлы functions.php вашей темы или плагина:

function wpblock_disable_lazy_loading( $default, $image, $context ) {
    return false; // Отключаем lazy loading для всех изображений
}
add_filter( 'wp_lazy_loading_enabled', 'wpblock_disable_lazy_loading', 10, 3 );

Этот код полностью отключит lazy loading во всем сайте.

Отключение lazy loading только для определенных типов изображений

Если нужно отключить lazy loading не для всех изображений, а, например, только для изображений в шапке или слайдере, добавьте проверку внутри функции:

function wpblock_disable_lazy_loading_for_headers( $default, $image, $context ) {
    // Проверяем, если изображение в контексте 'post-thumbnail' (миниатюра поста)
    if ( 'post-thumbnail' === $context ) {
        return false;
    }
    return $default;
}
add_filter( 'wp_lazy_loading_enabled', 'wpblock_disable_lazy_loading_for_headers', 10, 3 );

Таким образом, lazy loading останется включенным для остальных изображений.

Удаление атрибута loading="lazy" через JavaScript

Если вы не хотите или не можете менять PHP-код, можно удалить атрибут у изображений на фронтенде через JavaScript. Например, для отключения lazy loading в определенном блоке слайдера:

document.addEventListener('DOMContentLoaded', function() {
    const images = document.querySelectorAll('.slider img[loading="lazy"]');
    images.forEach(function(img) {
        img.removeAttribute('loading');
    });
});

Этот метод полезен, если вы работаете с темой или плагином, где нет доступа к серверному коду.

Совместимость с плагином Clearfy Pro для управления lazy loading

Если вы используете Clearfy Pro, то в нем есть удобные настройки для управления lazy loading — можно включать и отключать его для различных типов контента, а также задавать исключения. Это избавляет от необходимости писать код и снижает риск ошибок.

Итоги и рекомендации

Отключать lazy loading стоит только в случаях, когда он действительно вызывает проблемы с отображением или функционалом. Используйте фильтр wp_lazy_loading_enabled для тонкой настройки механизма или плагин Clearfy Pro для удобного управления. Если нужен быстрый фронтенд-фикс — удаляйте атрибут loading через JavaScript.

Такой подход позволит сохранить баланс между производительностью сайта и корректной работой всех элементов, связанных с изображениями.