Как отключить lazy load в Tilda: отключаем ленивую загрузку изображений

Введение

Как отключить lazy load в Tilda – вопрос, который волнует многих пользователей этой популярной платформы. Lazy load — это технология, которая призвана ускорить загрузку страниц, но иногда она может привести к нежелательным результатам. Давайте разберемся, как справиться с этой “ленью” и управлять загрузкой наших Tilda-сайтов.

Lazy Load: просто ленивая загрузка?

Прежде чем погрузиться в детали того, как избавиться от lazy load в Tilda, давайте разберем, что это такое. Lazy load – это метод оптимизации загрузки страниц, при котором изображения и другой контент подгружаются только тогда, когда пользователь доскролливает до них. Это помогает ускорить начальную загрузку страницы и экономит трафик. Однако, иногда мы хотим иметь полный контроль над тем, как и когда наш контент загружается.

Как отключить lazy load в Tilda

Так, как отключить lazy load в Tilda? Оказывается, это довольно просто. Есть три разных способа, каждый из которых мы подробно рассмотрим ниже:

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

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

1. Зайдите в настройки сайта
2. Во вкладке «Еще» найдите пункт «Выключить Lazy Load изображений»
3. Активируйте галочку в этом пункте
4. Сохраните изменения и опубликуйте страницу

После этих действия lazy load отключится на всех страницах вашего тильда сайта. Tilda не рекомендует этого делать, так как из-за этого ваш сайт может загружаться гораздо дольше, чем с включенной функцией ленивой загрузки.

Отключаем lazy load для конкретных изображений в zero block

Да, этот способ работает только в том случае, если вы используете zero block. Зайдите в настройки любого изображения в нулевом блоке, найдите пункт «LAZYLOAD» и в выпадающем списке выберите «Off». В этом случае, ленивая загрузка отключится только для этого конкретного изображения.

Отключаем ленивую загрузку для любого блока на сайте

А теперь самое интересное. Третий способ, которым мы с вами поделимся, дает полный контроль над ленивой загрузкой на вашем тильда сайте. Он дает возможность отключать lazy load в любом желаем блоке целиком. А это значит, что все изображения, находившиеся в этом блоке, начнут загружаться без функции ленивой загрузки. Вам не придется конвертировать блок в zero block, чтобы вручную настраивать изображения, как во втором способе. Интересно? Тогда перейдем к реализации:

1. Создайте блок или блоки, в которых вы хотите выключить lazy load
2. Присвойте этим блокам любой одинаковый класс
3. После всех блоков на странице добавьте блок «Т123»
4. Зайдите в «Контент» и скопируйте в него следующий код:

<script>
function updateUCNolazyBlocks() {
    const nolazyBlocks = document.querySelectorAll('.uc-block'); //Укажите класс ваших блоков

    nolazyBlocks.forEach(block => {
        // Удаляем класс "loaded"
        block.querySelectorAll('.loaded').forEach(loadedElement => {
            loadedElement.classList.remove('loaded');
        });

        // Находим элементы с атрибутом "data-original"
        block.querySelectorAll('[data-original]').forEach(originalElement => {
            const imageUrl = originalElement.getAttribute('data-original');

            // Проверяем, есть ли в элементе стиль "background-image"
            const style = originalElement.getAttribute('style');
            if (style && style.includes('background-image')) {
                // Заменяем background-image на новое значение
                originalElement.style.backgroundImage = `url('${imageUrl}')`;
            }
        });
    });
}

// Обновляем блоки с интервалом в 1 секунд (1000 миллисекунд)
setInterval(updateUCNolazyBlocks, 1000);

// Вызываем функцию для первоначального обновления
updateUCNolazyBlocks();

</script>

5. Пропишите класс ваших блоков в указанном месте в коде
6. Сохраните изменения и опубликуйте страницу

Теперь, во всех блоках, которым вы присвоили класс и привязали скрипт, lazy load перестанет работать.

Когда полезно отключать lazy load (ленивая загрузка)?

Теперь, когда вы знаете, как отключить lazy load в Tilda, давайте рассмотрим, когда это действительно полезно. Lazy load может быть отличным решением для сайтов с большим объемом изображений, где каждый байт трафика важен. Однако, если вы хотите полный контроль над загрузкой контента, особенно для медленных интернет-соединений или для страниц с многослойной графикой, то отключение lazy load может быть разумным выбором.

Заключение

Таким образом, вопрос “как отключить lazy load в Tilda” имеет простой ответ, но всегда стоит помнить, что lazy load — это инструмент оптимизации, который может пригодиться в разных ситуациях. Иногда лень не так уж и плоха, особенно если она помогает ускорить загрузку страницы. В конечном итоге, выбор зависит от ваших потребностей и целей, и, как говорится, “всяк хочет жить, а кто-то хочет быстро грузиться”.

Смотрите обучающие видео уроки по Тильде тут

Читайте также: Пагинация в Tilda