Как отключить отложенную загрузку изображений в WordPress для конкретных страниц

Отложенная загрузка изображений в WordPress обычно помогает, но на некоторых страницах она мешает: первый экран «прыгает», слайдер и hero-блок грузятся с задержкой, а в отчётах Lighthouse портится LCP. В таких случаях не нужно отключать lazy load на всём сайте. Практичнее убрать его точечно — для конкретного шаблона, записи или набора страниц.

Когда lazy load действительно мешает

Типичный сценарий: на главной или лендинге первое большое изображение находится выше сгиба, а тема или плагин добавляет к нему loading="lazy". Браузер откладывает загрузку, и пользователь видит пустой блок или резкий сдвиг контента. Иногда проблема проявляется только в мобильной версии, где hero-картинка участвует в расчёте LCP.

Проверять нужно не «на глаз», а по HTML и поведению страницы:

• в исходном коде у нужного изображения есть loading="lazy";
• картинка выше первого экрана;
• после отключения lazy load на этом элементе LCP и визуальная стабильность улучшаются;
• другие изображения на странице можно оставить с отложенной загрузкой.

Что именно ломается

Чаще всего страдают:

• главный баннер на главной странице;
• первый слайд в карусели;
• изображение в блоке «о компании» на лендинге;
• картинка в шапке записи, если она используется как ключевой визуальный элемент.

Если lazy load отключить полностью, вы потеряете смысл оптимизации на длинных страницах. Поэтому задача — исключить только проблемные изображения или страницы.

Диагностика: где WordPress добавляет lazy load

В WordPress атрибут loading может появляться из ядра, темы или плагина оптимизации. Сначала нужно понять источник. Откройте страницу в браузере, посмотрите исходный HTML и найдите нужный <img>. Если атрибут добавлен уже на сервере, его видно сразу. Если он появляется позже, значит вмешивается JS-плагин или оптимизатор.

Полезно проверить три вещи:

1. Есть ли loading="lazy" в исходнике страницы.
2. Не переопределяет ли тему вывод миниатюры через собственный шаблон.
3. Не добавляет ли lazy load плагин к изображениям через JavaScript.

Если у вас установлен плагин оптимизации, сначала временно отключите его lazy load и сравните HTML. Это быстрее, чем искать проблему в шаблоне вслепую.

Как отключить lazy load точечно через код

Самый надёжный вариант — убрать lazy load для конкретных страниц или для конкретных изображений в теме. Для этого удобно использовать фильтр wp_img_tag_add_loading_attr. Он позволяет управлять атрибутом loading на этапе генерации HTML.

Ниже пример: отключаем lazy load на главной странице и на странице с ID 42. Для остальных страниц поведение WordPress не меняется.

<?php
add_filter( 'wp_img_tag_add_loading_attr', function( $value, $image, $context ) {
    if ( is_front_page() || is_page( 42 ) ) {
        return false;
    }

    return $value;
}, 10, 3 );

Что здесь важно:

• return false убирает атрибут loading у изображения;
• условие можно расширить под нужный шаблон, категорию или тип записи;
• фильтр сработает только для изображений, которые проходят через стандартный вывод WordPress.

Если нужно отключить lazy load только у первого изображения

Иногда проблема касается только hero-картинки, а не всей страницы. Тогда лучше не отключать lazy load глобально для шаблона, а пометить конкретное изображение как приоритетное. Для этого можно убрать атрибут у первого изображения в контенте через фильтр wp_get_attachment_image_attributes, если вы выводите его как attachment image.

<?php
add_filter( 'wp_get_attachment_image_attributes', function( $attr, $attachment, $size ) {
    if ( is_front_page() && ! empty( $attr['class'] ) && strpos( $attr['class'], 'hero-image' ) !== false ) {
        unset( $attr['loading'] );
        $attr['fetchpriority'] = 'high';
    }

    return $attr;
}, 10, 3 );

Этот вариант полезен, когда вы контролируете разметку блока и можете добавить класс hero-image. Но не стоит раздавать fetchpriority="high" всем картинкам подряд — браузеру нужен только один действительно приоритетный ресурс.

Как отключить lazy load через шаблон темы

Если у вас есть доступ к шаблону, иногда проще явно вывести нужную картинку без атрибута loading. Это особенно удобно для hero-блока, который не должен откладываться ни при каких условиях.

<?php
$thumb_id = get_post_thumbnail_id();
if ( $thumb_id ) {
    echo wp_get_attachment_image(
        $thumb_id,
        'full',
        false,
        array(
            'class' => 'hero-image',
            'loading' => false,
            'fetchpriority' => 'high',
        )
    );
}

Такой подход хорош тем, что вы контролируете итоговый HTML без лишних фильтров. Но он требует аккуратности: если картинка не выше первого экрана, приоритет может быть лишним.

Сравнение подходов

Пошаговое решение без лишнего риска

1. Найдите конкретную страницу, где lazy load мешает.
2. Проверьте исходный HTML и убедитесь, что проблема действительно в атрибуте loading.
3. Определите источник: ядро WordPress, тема или плагин.
4. Добавьте точечное исключение через фильтр или шаблон.
5. Очистите кэш страницы, кэш плагина и CDN, если он есть.
6. Снова проверьте HTML и визуальное поведение страницы.

Как проверить, что решение сработало

После правки не ограничивайтесь просмотром страницы в браузере. Проверьте именно то, что меняли:

• в исходном коде у нужного изображения больше нет loading="lazy";
• hero-картинка загружается сразу, без заметной задержки;
• в Lighthouse или PageSpeed Insights LCP не ухудшился из-за отложенной загрузки;
• на остальных изображениях страницы lazy load по-прежнему работает;
• кэш после изменений очищен, иначе вы будете смотреть старую версию HTML.

Если используете CDN или серверный кэш, обновите и его. Иначе можно ошибочно решить, что фильтр не сработал, хотя на деле просто отдаётся старая копия страницы.

Частые ошибки и как их исправить

Отключили lazy load на всём сайте

Так делают, когда не хотят разбираться с шаблоном. В итоге тяжёлые страницы начинают грузиться хуже, а смысл оптимизации теряется. Исправление простое: верните lazy load и исключите только проблемные страницы или изображения.

Меняют только HTML, но забывают про плагин

Если lazy load добавляет плагин, а не WordPress, правка шаблона может не помочь. Нужно либо отключить соответствующую опцию в плагине, либо убрать его обработчик для нужного шаблона.

Ставят fetchpriority="high" на несколько картинок

Браузер не любит, когда всё объявляют приоритетным. В приоритете должен быть один главный ресурс на первом экране. Остальное лучше оставить обычной загрузкой.

Не очищают кэш

Это самая банальная причина ложных выводов. После изменения кода очистите кэш плагина, серверный кэш и CDN. Иначе вы будете проверять старую разметку.

Практические советы по производительности

Если вы уже трогаете изображения, заодно проверьте соседние настройки. Иногда проблема не в lazy load как таковом, а в слишком тяжёлой hero-картинке или в неудачном размере изображения. Для первого экрана лучше использовать файл подходящего размера, а не оригинал на несколько мегабайт.

Полезная последовательность для проверки:

• убедиться, что изображение не больше нужного размера;
• сохранить его в адекватном формате;
• оставить lazy load для всех картинок ниже первого экрана;
• не тащить в hero-блок лишние слайдеры и фоновые видео, если они не нужны.

Если вам нужен более широкий набор инструментов для чистки технических дублей и контроля SEO-настроек, можно посмотреть Clearfy Pro: https://wpshop.ru/plugins/clearfy. Но даже с плагином логика остаётся той же: сначала найти источник проблемы, потом отключать точечно, а не «на всякий случай».

Если у вас есть конкретный шаблон, где lazy load ломает первый экран, лучше закладывать исключение сразу в тему или в небольшой mu-plugin. Так решение не потеряется после обновления и не будет зависеть от ручных настроек в админке.