Гайды по Tilda:
настройка сайта и модификаций

Галерея в Zero Block, слайдер из стандартных карточек или инерционная лента GL03? Разбираем выбор, подключение и ошибки на мобильных.

Как собрать движущуюся ленту из стандартных карточек или Zero Block: структура, две строки, пауза, мобильная версия и разбор частых ошибок.

Чем отличаются табы страницы и вкладки товара. Как добавить характеристики в несколько колонок, оформить таблицу и проверить её на телефоне.

Как добавить поиск по вопросам и ответам, вынести поле в Zero Block и сделать постоянную ссылку на отдельный пункт аккордеона.

Как подключить избранное в магазине Tilda, открыть его из своей шапки и добавить поиск, статусы и заметки с помощью Избранного Pro.

Как выбрать меню для Tilda: стандартный блок, своя шапка в Zero или полноэкранный Atelier. Фиксация, мобильная навигация и проверка ссылок.

Как отправить собранную корзину Tilda другому человеку: товары, варианты и количество в одной ссылке. Настройка кнопки, восстановление и проверка заказа.

Как добавить сравнение товаров в Tilda: кнопки в каталоге, таблица параметров, подсветка отличий и проверка на телефоне. Что подготовить в карточках.

Как разместить корзину Tilda в своей шапке Zero Block, добавить счётчик товаров и сумму. Настройка шейпа, мобильной версии и открытия ST100.

Как автоматически показать процент скидки в карточке товара Tilda по старой и новой цене. Формула расчёта, оформление плашки и проверка вариантов.

Как задать понятный формат ввода в форме Tilda: дата, время и собственная маска. Чем маска отличается от проверки данных и как избежать конфликтов.

Как сделать удобную загрузку файлов в форме Tilda: область перетаскивания, список выбранных файлов и понятные состояния. Настройка и проверка доставки.

Как настроить автосохранение формы Tilda: восстановление ответов после обновления страницы, срок хранения и исключения. Что происходит после отправки.

Как сделать плавающие подписи полей в Tilda: название поднимается при вводе и остаётся видимым. Настройка цвета, отступов и проверка на телефоне.

Как показать прогресс заполнения формы Tilda: считать все поля или только обязательные, оформить индикатор и проверить несколько форм на странице.

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

Как собрать в Tilda галерею из вертикальных и горизонтальных фото: настроить колонки, отступы и просмотр с увеличением на компьютере и телефоне.

Как оставить цену и кнопку покупки на экране длинной страницы товара Tilda. Подключение плашки, работа с вариантами и проверка мобильной версии.

Как показать детали товара в Tilda: настроить увеличительную линзу на компьютере и крупное фото на телефоне. Подготовка изображений и проверка галереи.

Как показать упаковку, добавки и услуги карточками с фотографиями в Tilda. Настройка дополнительных опций, доплаты, выбранного состояния и корзины.

Как добавить в Zero Block плашку с промокодом, который копируется по нажатию. Вложенные элементы, CSS-классы, подтверждение и проверка результата.

Как настроить свой курсор в Tilda: кольцо, шлейф или подпись над ссылкой. Выбор элементов, поведение на телефоне и проверка удобства.

Как подключить Lottie-файл к Zero Block в Tilda: плеер, код запуска, воспроизведение по скроллу или наведению и поведение на телефоне.

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

Как дать посетителю добавить нескольких участников в одной форме Tilda. Подготовка полей, ограничение количества и передача списка вместе с заявкой.

Как показать посетителю заполненные данные перед отправкой формы Tilda. Выбор полей, возврат к исправлению, маскирование контактов и проверка заявки.

Как добавить движущийся градиент в заголовок Zero Block: три цвета, скорость, класс подключения и работа с пошаговой анимацией Tilda.

Как добавить заставку со счётчиком от 0 до 100 в Tilda: оформление цифр, длительность, выход и проверка первого экрана на телефоне.

Как настроить 3D-наклон или переворот карточек Tilda: выбрать элементы, оформить оборот и сохранить удобные ссылки и мобильный вид.

Как настроить движение фотографий в Tilda: проявление из-под маски, параллакс, медленный зум и цвет при наведении. Выбор изображений и проверка границ.

Как изменить число товаров в ряд, ширину каталога, промежутки и высоту фото в Tilda. Один код с настройками для компьютера и телефона.

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

Как превратить строки «Название: значение» в аккуратные характеристики товара Tilda. Подзаголовки, разделители, длинные значения и мобильный вид.

Как добавить к публикациям Tilda календарь или ленту дней. Выбор даты события, диапазона и проверка фильтра после подгрузки карточек.

Как показать статьи Tilda в формате сторис: взять обложки из потока, объединить по разделам, настроить просмотр и разместить ленту в Zero Block.

Как добавить фоновые MP4-видео в карточки TE100: порядок файлов, раскрытие карточек и мобильное управление. Что проверить перед публикацией.

Как ограничить заголовки и описания в Tilda по числу строк: отдельные настройки для телефона, длинные слова и доступ к полному тексту.

Как оформить обычную ссылку в Tilda как кнопку: фон, отступы, обводка и наведение. Точное совпадение адресов и проверка на телефоне.

Плавное увеличение карточек товаров и услуг в Tilda: выбор элементов, масштаб и скорость. Почему эффект не раздвигает сетку и работает от 1200 px.

Как собрать Coverflow из GL03 в Tilda: центральное изображение, наклон соседних, отражение и управление. Отдельный блок или вставка в Zero.

Как выделить активное поле формы в Tilda: четыре эффекта фокуса, цвет и скорость. Проверка клавиатурой, на телефоне и рядом с ошибками формы.

Как связать ссылку с карточкой тарифа в Zero Block: якорь, класс и пульсирующая обводка. Чем подсветка отличается от прокрутки и выбора тарифа.

Как пустить текст по волне или кругу в Zero Block: область, исходная надпись и настройка движения. Скролл, непрерывный режим и свой SVG-путь.

Как разрешить посетителю двигать элементы Zero Block мышью и пальцем: общий класс, курсор и масштаб. Ограничения области и сохранения позиций.

Как задать карточке разные углы в покое и при наведении: общий радиус, отдельные углы и плавность. Проверка фотографий и экранов от 1200 px.

Как сделать стопку фотографий из GL03: глубина, смена верхней карточки, свайп и автопрокрутка. Отдельное размещение и вставка в Zero Block.

Как вывести разницу старой и новой цены в каталоге Tilda, карточке товара и попапе. Подпись, валюта, отступы и проверка вариантов товара.

Как добавить реакцию кнопки на курсор в Tilda: магнитное движение, заливка, обводка, стрелка и пульсация. Выбор кнопок и поведение на телефоне.

Как анимировать фотографию внутри карточки Tilda: увеличение, переход из чёрно-белого в цвет, наклон и подпись. Выбор изображения и мобильная версия.

Как добавить глитч изображению или восстановление заголовка из символов в Tilda. Два режима, простой текст, восстановление надписи и проверка телефона.

Как настроить светящуюся рамку или радужный блеск карточки в Tilda: цвета, наклон, скорость и реакция на мышь. Проверка свечения у краёв блока.

Как настроить наклон, магнит, зум, подсветку и другие реакции карточек в одном конструкторе Tilda. Выбор элементов, ограничения и проверка после фильтрации.

Как превратить GL03 в повторяющееся полотно фотографий: размеры, инерция, автодвижение и управление пальцем. Вставка в Zero и удобная прокрутка страницы.

Как сделать световой круг над сеткой GL03: радиус, мягкая граница, затемнение и движение пальцем. Размеры области и проверка фотографий на телефоне.

Как показывать фотографии по движению мыши и пальца: источник GL03, область эффекта, шаг появления и затухание. Отличие от обычной галереи.

Как сделать заставку с первой буквой бренда в Tilda: пять форм рамки, шрифт, подпись и выход. Настройка ожидания и проверка на телефоне.

Как настроить тексты сразу в нескольких стандартных блоках Tilda: шрифт, интервалы и правила для разных экранов. Пустые поля и приоритет меньшей ширины.

Как изменить мобильную сетку стандартных блоков потоков и CMS в Tilda: колонки, промежутки, фотографии и тексты. Граница включения и неподдерживаемые блоки.

Как собрать справочник из потока или CMS Tilda: алфавитная навигация, поиск вместе с разделами и размещение в Zero. Проверка состава всех записей.

Как рассчитать время чтения по полному тексту публикации Tilda: скорость, минуты, секунды и место бейджа. Ограничение для отдельной страницы статьи.

Как добавить движение всей карточке Tilda: магнит за курсором, эластичный масштаб и подъём. Выбор блоков, свободное место и поведение на телефоне.

Как сделать горизонтальную 3D-галерею из GL03: перспектива для телефона и компьютера, движение, автопрокрутка и подписи фотографий из Tilda.

Как подключить Lottie JSON к заставке Tilda: прямая ссылка, размер, проценты и выход. Автоматический и фиксированный режимы, запасной спиннер.

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

Как собрать текстовую заставку Tilda с заменой шумовых знаков на название: алфавит, ритм, подпись и выход. Кириллица и уменьшение движения.

Как сделать контурную надпись с цветной заливкой в Tilda: четыре цвета, перелив, счётчик и выход. Отличие анимации от реального прогресса загрузки.

Как настроить два состояния стандартной карточки Tilda: поворот по трём осям, подъём, перспектива и плавность. Выбор элемента и работа от 1200 px.

Как сделать ряд TM101 с расширением активной карточки и соседей. Ширина, подписи, промежутки и выбор ленты или сетки на телефоне.

Как настроить квадратную заставку Tilda: палитра, плотность, порядок появления и исчезновения, плашка с текстом. Что показывают условные проценты.

Как настроить заставку с четырьмя цветовыми пятнами: палитра, размытие, скорость, текст и выход. Проверка контраста на компьютере и телефоне.

Как сделать заставку с прорисовкой названия: шрифт, контур, подпись и выход. Чем SVG-текст отличается от загрузки готового логотипа.

Как открыть страницу через расширяющийся круг: кольцо, счётчик, конечный радиус и плавность. Проверка углов экрана и выхода на телефоне.

Как настроить волну перед открытием страницы: цвет, высота, скорость края и время заполнения. Название, счётчик и проверка телефона.

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

Как настроить «Кольцо-прогресс»: активная дуга, дорожка, максимальный размер, бренд и проценты. Разница между заполнением и вращением.

Как настроить заставку с диафрагмой камеры: цвета, бренд, проценты, строка f-stop и время раскрытия. Проверка на компьютере и телефоне.

Как настроить текстовую заставку с осями wght и wdth. Подключение шрифта на сайте, крайние состояния букв, подпись, линия прогресса и выход.

Как закрасить контурное название одним цветом: шрифт, обводка, светящаяся граница, подпись и время выхода. Отличия от градиентной заливки.

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

Как настроить прелоадер с уменьшением пикселей: градиент, название, подпись, счётчик и выход. Что создаёт Canvas и почему нельзя подставить фотографию.

Как настроить частицы на Canvas: шрифт, шаг сетки, размер точек, два цвета и задержки. Проверка читаемости и плавности на телефоне.

Как оформить барабаны счётчика: размеры, шрифт, расстояния, суффикс и подпись. Отсчёт, пауза на 100 и отличие от счётчика продаж.

Как настроить Split-flap табло: слово латиницей до 12 символов, ячейки, интервалы и остановка букв. Ограничения алфавита и проверка телефона.

Как настроить терминальную заставку: строки лога, маркер {brand}, акцент после |, скорость печати и выход. Почему это оформление, а не команды сервера.

Как собрать заставку из движущихся полос: число, ширина, высота, промежутки и подпись. Проверка на телефоне и отличие от настоящего анализа звука.

Как настроить три цвета, проценты, подпись и финальную вспышку. Что происходит без WebGL и почему этот мод не искажает загруженную фотографию.

Как собрать галерею из GL03: пропорции плиток, колонки, просмотр без обрезки, подписи и клавиатура. Вставка в шейп Zero Block и мобильная версия.

Как привести избранное к стилю магазина: сетка, фото слева или сверху, название, цена, варианты и кнопка удаления. Область для сердечек и адаптивы.

Как настроить объёмные кубики: цвета граней, размер, глубина, подписи и время. Что показывают проценты и можно ли менять число кубов.

Как настроить падающие символы на Canvas: набор знаков, размер, след и цвета. Название, шесть положений индикатора и проверка телефона.

Как настроить анимированную волну: линия, свечение, подписи, проценты и финал. Что можно отключить и почему это не измерение звука.

Как настроить декоративный штрихкод: полосы, лазер, размеры, бренд и строка прогресса. Почему SKU не становится настоящим кодом товара.

Как настроить CRT-заставку: раскрытие линии, полосы, виньетка, тексты и схлопывание. Длительности этапов и проверка сокращённого движения.

Как настроить ядро и орбиты: радиусы, цвета, размытие и скорость. Размеры композиции на телефоне, проценты и масштабирование при выходе.

Как настроить падение мяча: радиус, высота, гравитация, упругость и число отскоков. Тень, индикаторы и покрытие углов финальным кругом.

Как настроить от одного до пяти колец, пульсацию, луч и центр. Скорость оборота, длительность заставки, проценты и выход к странице.