Настройки Зеро блока
Настройки элементов Зеро блока
Слои + блоки
Направляющие
Позиционирование + переполнение
Горячие клавиши
Взаимодействие элементов между собой
Наследование параметров у элементов при адаптиве
Текстовый блок. Межстрочка в тильде = процент в фигме. Чтобы совпадало и межбуквенное расстояние, то прописываем в фигме пиксели
Можно копировать стили и вставлять в другой текст
Можно выбрать шрифт, не выходя из Тильды и посмотреть — как он смотрится
Visibility. Можно скрыть элемент в любом брейкпоинте и скрыт он будет только в нем
Картинка меняет пропорции фото равномерно. Есть возможность прописать тег ALT для изображения. Полезно для поисковика и для людей с ограниченными возможностями. Можно выключить Lazy Load, актуально для первого экрана. Pointer Events — выключаем видимость элемента курсором (стоматология)

Посмотреть настройки EDIT (настройка Flip)
Есть возможность зафиксировать фото по скролу внутри самого шейпа
Можно назначить гибкое позиционирование как в px так и в процентах
С недавних пор в шейпе появилась возможность прописать тег ALT для изображения

В шейп или картинку можно загрузить иконки или фото из библиотеки Тильды
Кнопку можно сделать в процентах
Текст в кнопке можно прижать к левому или правому краю + css
Можно подтянуть видео из ВК (показать инструкцию)
Можно подтянуть видео из своего хостинга в MP4 с автоплеем и без звука. Звук запрещен с автоплеем. Можно зациклить видео по кругу. Спрятать элементы управления. Управлять заполненностью видео-фрейма контентом (посмотрим на примере Кузьмы)
В mp4 и WEBM мы можем загружать свои видео весом до 5 мб на хостинг Тильды
Как подгрузим картинку, появляется значок плей
Можно использовать код в любом месте вашего сайта
Карта от яндекса, гугла
3-d туры
Таймеры обратного отсчета
Виджеты сервисов бронирования
И много много всего...
Можно добавить фото + скруглить его с помощью CSS
Можно добавить разную иконку на сам тултип
Назначаем имя форме
Пишем текст с сообщением об успешной отправке
Можно сделать два поля в ряд
Стрелки можно расположить в разных местах
Можно написать текст и поместить внутрь картинки. После добавления текста появляются настройки текста
Можно добавить ссылку на видео с Ютуб или Вимео. Появится кнопка Play с настройками
Можно добавить ссылку на внутренний или внешний ресурс. Появятся настройки ссылок для SEO
Точки добавляем на мобилке, стрелки на десктопе
Можно скрыть все элементы управления и растянуть слайдер на на всю ширину экрана в %
Слайдеры на первых экранах часто используют известные маркетплейсы, но будьте аккуратны
Я использую фигму. В тильде этот инструмент находится на совсем начальной стадии своего развития. Можно использовать разве что простые решения. Например нарисовать волну, простую фигуру или загрузить иконку в SVG + перекрасить ее в подходящий цвет
Можно сконвертировать в изображение
LET'S GO!
Морфеуc — персонаж фильма «Матрица», исполняемый актёрами Лоренсом Фишберном и Яхья Абдул-Матином II
Нео — главный герой серии фильмов «Матрица». Его также иногда называют «Избранным»
Тринити (англ. Trinity) — персонаж вселенной медиафраншизы «Матрица», старший офицер корабля «Навуходоносор»
Выключка текста по всей ширине to enter the edit mode. Use layers, shapes and customize adaptability. Everything is in your hands. Click "Block Editor" to enter the edit mode. Use layers, shapes and customize adaptability. Everything is in your hands. Click "Block Editor" to enter the edit mode. Use layers, shapes and customize adaptability. Everything is in your hands. Click "Block Editor" to enter the edit mode. Use layers, shapes and customize adaptability. Everything is in your hands.
Демонстрация настройки Position Absolute + лайфХак, как убрать значок Made on Tilda
Демонстрация настройки Overflow: auto
Настройка Isolation предотвращает конфликты z-индекса — в проектах, где несколько элементов имеют разные значения z-индекса, свойство isolation может создавать независимые контексты, чтобы предотвратить проблемы с многоуровневостью
Направляющие можно скрывать и показывать разные на разных брейкпоинтах. Можно прописывать координаты. Можно использовать как силовые линии при расположении элементов по Window в px. Отличный помощник не только при вертикальном выравнивании, но и при горизонтальном выравнивании
Элемент по Window в px
Горячие клавиши, которые я использую
Alt — смотреть расстояние между элементами
[ — занести элементы в самый низ
] — занести элементы в самый верх
Ctrl + L — показать/скрыть блок со слоями
Зажатое колесико или зажатый пробел позволяют перемещать область зеро блока
Ctrl + колесико вперед — приблизить рабочую область
Ctrl + колесико назад — отдалить рабочую область
Ctrl + H — показать горизонтальную направляющую
Ctrl + Shift + H — показать вертикальную направляющую
Ctrl + 1...5 — переключаться между брейкпоинтами
Ctrl + C — копировать элементы
Ctrl + V — вставить элементы
Ctrl + D — дублировать элемент
Ctrl + Z — откатить шаг назад
Ctrl + A — выделить все элементы рабочей области
L — заблокировать/разблокировать элемент элемент
Перемещение предмета с зажатой клавишей Shift
Цифрами от 1 до 9 можно управлять непрозрачностью элементов