Как сделать плавный переход между блоками в тильде

В линейном градиенте переход между цветами происходит по прямой линии. Можно использовать несколько цветов, изменить расстояние между ними внутри градиента и задать любой угол направления для цветового сочетания.

Чтобы добавить линейный градиент на элемент, перейдите в Настройки Zero Block → Background Color → Linear. Чтобы добавить ещё один цвет, выберите его на панели. Чтобы удалить цвет, зажмите его и потяните вниз. Под палитрой можно задать угол, под которым будет отображаться градиент — введите число или покрутите виджет мышкой.

Радиальный градиент (Radial)

Переход между цветами в радиальном градиенте происходит из центра наружу по кругу. В настройках блока можно задать любое количество цветов и расстояние между ними внутри градиента.

Чтобы добавить радиальный градиент на элемент, перейдите в Настройки Zero Block → Background Color → Radial.

Добавляйте градиенты в дизайн вашего проекта без использования дополнительных инструментов, прямо внутри редактора Zero Block.

Якоря и ссылки внутри страницы

Поставить ссылку, которая ведет внутрь страницы к конкретному блоку (разделу), можно двумя способами:

1. Добавьте в нужное место специальный блок — T173 Якорная ссылка из категории Другое. В Контенте T173 пропишите желаемое название для якоря, например: «contacts». И можно теперь переходить к этому месту, в котором находится блок T173, указывая ссылку вида «#contacts» на кнопках или в меню. Сам блок невидимый.

2. Поставить ссылку на любой блок: Для этого вам нужно в адресе ссылки прописать «#rec129000». Этот уникальный номер есть у каждого блока. Его можно найти в контекстной панели Settings блока (в самом низу). Обратите внимание, что если вы скопируете страницу, то номера блоков поменяются и вам нужно будет поставить ссылки заново.

Чтобы по ссылке посетитель сайта переходил к конкретному месту на другой странице, поставьте ссылку вида: /pagename#anchorname , где pagename — это адрес страницы, на которую нужно перейти, а anchorname — название якоря, который обозначает место, куда должен быть отправлен посетитель.

Если вы хотите, чтобы переход к назначенному блоку был плавным, «скользящим», добавьте на страницу блок T178 (Библиотека блоков → Другое → Плавный скролл до локальной ссылки).

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

Как сделать плавный скроллинг по якорным ссылкам?

Чтобы скролл был плавным, добавьте модификатор скролла — блок Т178 из категории «Другое». После его добавления все переходы по якорным ссылкам будут с плавной анимацией.

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

Плавная смена цвета фона

Чтобы сделать эффект плавной смены цвета фона, добавьте на страницу блок DV11A (категория «Разделитель») в том месте, где цвет должен поменяться. В настройках блока укажите цвет. Цвет фона страницы ниже этого блока поменяется.

Чтобы сделать переход к еще одному цвету или обратно к белому — добавьте еще один такой же блок и задайте новый цвет в настройках.

Разделы «Справочного центра»:

Как устроена Тильда
Настройки сайта
Редактирование страницы
Продвижение сайта

Домен и сертификат
Интернет-магазин
Формы приёма данных
Статистика сайта

Zero Block
Конструктор писем
Тарифы и платежи

Потоки и новости
Личный кабинет
Разработчикам

Сообщить о нарушении прав

Если вы считаете, что пользователь Tilda Publishing нарушает ваши права, отправьте нам сообщение через форму

Как связаться с поддержкой

Для консультаций по функциям платформы используйте форму обратной связи в вашем личном кабинете или напишите на team@tilda.cc

Как сделать плавный переход между блоками в тильде