Обложка на Тильде: как сделать первый экран сайта
Обложка на Тильде это блок первого экрана из категории «Обложка»: фон-картинка или видео, заголовок, подзаголовок и кнопка. Фоновое изображение загружают во вкладке «Контент», высоту задают в пикселях или в vh, а читаемость текста обеспечивает цветной фильтр поверх фона. Ниже шаги настройки и проверка перед публикацией.
Ответ за 30 секунд
Обложку собирают из блока категории «Обложка»: загружают фон, пишут заголовок, задают высоту и фильтр. На телефоне фоновое видео не запускается, поэтому картинку в «Контенте» загружают всегда. Параметры взяты из справки Тильды на 20 октября 2026.
Обложку увидят по своему адресу только после подключения домена: .ru от 200 ₽ за первый год (Таймвеб, на 20 октября 2026).
Проверка обложки на Тильде перед публикацией1680 pxрекомендуемая ширина фонового jpg
5 МБпредел для MP4 и WebM в фоне
1vhравен 1% высоты экрана
01 · 1 мин
Что такое обложка в Тильде и из чего она состоит#
Обложка это блок первого экрана: то, что посетитель видит до прокрутки. В библиотеке блоков она лежит в категории «Обложка», у каждого варианта свой код, например CR26 или CR34. Внутри обычно фон, надзаголовок, заголовок, подзаголовок, описание и одна-две кнопки.
Заголовок формулирует предложение сайта, а кнопка ведёт к главному действию: заявке, каталогу или нужному блоку страницы. Обложку ставят сразу после меню, так что сначала идёт шапка, потом первый экран.
Текст на обложке правят кликом по нему или в «Контенте». Оформление, то есть шрифт, размер и цвет, задают в «Настройках» в разделе «Типографика».
02 · 1 мин
Как сделать обложку на Тильде по шагам#
- Добавьте блок. Откройте библиотеку, выберите категорию «Обложка» и вариант по превью: с картинкой, с видео, с формой или с таймером.
- Загрузите фон. В «Контенте» найдите поле «Фоновое изображение». Подходит jpg шириной около 1680 px.
- Напишите тексты. Заголовок, подзаголовок и кнопку правят кликом по тексту или в полях «Контента».
- Подберите фильтр. Цвет и непрозрачность затемняют фон, чтобы текст читался.
- Задайте высоту в «Настройках»: параметр Height принимает пиксели и vh.
- Проверьте вид на телефоне и опубликуйте страницу: как опубликовать сайт на Тильде.
Инструмент · 1 мин
Проверка обложки на Тильде перед публикацией#
Последние ошибки в обложке видно только на телефоне. Пройдите короткий список, прежде чем открывать сайт посетителям.
Проверка обложки перед публикацией
Отмечайте пункты, подсказка покажет следующий шаг
04 · 1 мин
Фон обложки в Тильде: картинка, видео, цвет и фильтр#
| Вариант фона | Как задать | Что учесть |
|---|---|---|
| Картинка | «Контент», поле «Фоновое изображение» | Нужна всегда: на телефоне она заменяет видео |
| Видео по ссылке | Вкладка «Видео» в «Контенте»: YouTube, Rutube, Kinescope, VK Видео или Vimeo | Звук в фоновом видео не воспроизводится |
| Видеофайл | MP4 или WebM до 5 МБ | Тяжёлый файл замедляет страницу |
| Цвет или градиент | Поля «Цвет фильтра в начале» и «в конце», у каждого своя непрозрачность | Один цвет при непрозрачности 100% даёт сплошную заливку |
Фильтр затемняет фон и даёт нужный оттенок. Если цвета в начале и в конце разные, получается градиент. Чтобы обложка плавно переходила в следующий блок, в конце ставят непрозрачность 100% и выбирают цвет этого блока. Подробнее о вставке видео: видео на Тильде.
05 · 1 мин
Высота обложки в Тильде: пиксели, vh и экран телефона#
Высоту задают параметром Height в «Настройках». В пикселях блок остаётся одной высоты на любом устройстве, в vh он растягивается вслед за экраном: 1vh равен 1% высоты экрана, а 100vh закрывает его целиком.
Для узкой обложки обычно берут примерно от 60 до 70 процентов высоты экрана. Тогда ниже виден край следующего блока, и посетитель понимает, что страницу можно листать. Полноэкранную обложку из 100vh проверяйте на телефоне: на маленьком экране заголовок и кнопка должны помещаться без обрезки.
06 · 1 мин
Форма, таймер и Zero Block на обложке Тильды#
Форма заявки есть в нескольких вариантах обложки: CR26, CR26AN, CR32, CR34 и CR36. Её настраивают так же, как обычные формы, о них на странице формы на Тильде. Таймер обратного отсчёта встроен в обложки CR34 и CR35: в «Контенте» задают дату, время и часовой пояс окончания.
Если готовых вариантов не хватает, обложку превращают в Zero Block: внизу настроек блока есть кнопка «Convert to Zero Block». Сама возможность доступна с тарифа Personal, а несохранённые правки при превращении теряются.
07 · 1 мин
Вопросы об обложке на Тильде#
Как сделать обложку на Тильде с видео вместо картинки?
Откройте «Контент» блока, вкладку «Видео» и вставьте ссылку на YouTube, Rutube, Kinescope, VK Видео или Vimeo либо загрузите MP4 или WebM до 5 МБ. Звук в фоновом видео не играет.
Почему на телефоне обложка Тильды показывает картинку вместо видео?
Фоновое видео на телефонах не запускается, там показывается фоновое изображение. Поэтому картинку в «Контенте» загружают даже тогда, когда на компьютере виден ролик.
Какую высоту задать обложке на Тильде?
Для узкой обложки хватает примерно от 60 до 70 процентов высоты экрана, для полноэкранной берут 100vh. Единица vh привязана к высоте экрана, пиксели остаются постоянными.
Можно ли поставить форму заявки на обложку Тильды?
Да, форма встроена в обложки CR26, CR26AN, CR32, CR34 и CR36. Получателя заявок выбирают в настройках сайта, как для любой другой формы.
Почему этому можно верить
Как мы проверяли
Источники цифр на этой странице: Тарифы Тильды, tilda.cc/ru/pricing, проверено 20 октября 2026; Домены Таймвеб, timeweb.com/ru/services/domains, проверено 20 октября 2026; Виртуальный хостинг Таймвеб, timeweb.com/ru/services/hosting, проверено 20 октября 2026; Справка Тильды: работа с обложкой (фон, видео, фильтр, высота, форма и таймер), help-ru.tilda.cc/cover, проверено 20 октября 2026.
Зарегистрируйте домен для сайта
Чтобы сайт на Тильде открывался по своему адресу, нужен домен. Домены Timeweb: более 300 зон, бесплатный SSL и единая панель.
- .ru и .рф от 200 ₽ за первый год
- Более 300 доменных зон
- Бесплатный SSL на домен
- Подключение к Тильде одной записью