магазин кастомных решений для тильды
Здесь собраны самые уникальные решения для тильды, с помощью которых вы сможете расширить функционал своих сайтов
Настройте
Цвета, размеры, поведение в конструкторе ниже
Скопируйте код
Одна кнопка — код в буфере обмена
Вставьте в Tilda
Блок T123 (HTML) на нужной странице

Lottie-прелоадер для страницы Tilda

Собственная JSON-анимация с выбором положения, режимом ожидания и счётчиком.
Подробнее о модеСвернуть описание

Что умеет мод

  • Показывает вашу Lottie-анимацию на полноэкранной заставке.
  • Настраивает размер, положение и отступы анимации и процентов отдельно.
  • Предлагает автоматический и фиксированный режимы длительности.
  • Убирает заставку сдвигом в одну из четырёх сторон или затуханием.

Как подключить

Lottie JSONПолноэкранная заставкаОдин код в T123
  1. Подключите файл

    Замените демо-ссылку прямым адресом Lottie JSON. Убедитесь, что файл доступен браузеру и анимация появилась в превью. Используйте именно файл, а не страницу его просмотра.

  2. Настройте расположение

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

  3. Выберите ожидание и выход

    В автоматическом режиме заставка ориентируется на завершение загрузки страницы. В фиксированном задаётся время счётчика, после которого код также учитывает готовность страницы. Укажите максимальное ожидание и вариант выхода.

  4. Установите и проверьте

    Вставьте код в T123 в начале страницы и опубликуйте. Проверьте загрузку файла, движение и исчезновение заставки на компьютере и телефоне. Отдельный HTML-плеер в Zero Block для этого прелоадера не нужен.

Что учитывать. Текущая версия рассчитана на Lottie JSON. Архив .lottie и ссылка на страницу сервиса не заменяют прямой адрес JSON-файла. В режиме «Авто» проценты условно приближаются к 90 и завершаются после готовности страницы. Они не измеряют точный объём скачанных данных.

Вопросы и ограничения

Где менять цвета своей анимации?

В исходном Lottie-файле. Настройка цвета спиннера относится к кольцу-заглушке, а не перекрашивает вашу анимацию.

Что будет, если очистить ссылку?

Вместо файла показывается кольцевой спиннер. Он также используется как запасной вариант при ошибке загрузки анимации.

Чем отличается от конструктора Lottie внутри страницы?

Этот мод создаёт заставку перед содержимым одним кодом T123. Для анимации внутри Zero Block и управления по скроллу используйте отдельный конструктор Lottie.

Нужно ли добавлять несколько кодов для разных позиций?

Нет. Положение выбирается в одном конструкторе. Установите один прелоадер на страницу; смена позиции не требует второй копии кода.

Доступ к конструктору

Мод доступен по подписке Pro. Войдите в аккаунт, чтобы настроить его и получить код. Действующие условия указаны в тарифах.

Другие варианты заставок

Made on
Tilda