Введение
Каждый владелец или разработчик сайтов стремится создавать ресурсы, которые будут выделяться на фоне однообразных и скучных сайтов. Для этого они ищут и внедряют уникальные решения, чтобы придать проекту оригинальность. Одним из таких решений является использование пошаговой прокрутки или Full Page Scroll на платформе Tilda. В этой статье мы подробно рассмотрим, как реализовать Full Page Scroll в Tilda, используя как стандартные блоки, так и Zero Blocks.
Что такое Full page scroll в Tilda и зачем он нужен
Full Page Scroll в Tilda — это эффект прокрутки, при котором пользователь перемещается по веб-странице блок за блоком. Такой подход позволяет создавать оригинальные и привлекательные лендинги, которые впечатляют посетителей.
Tilda — один из лучших инструментов для разработки сайтов. Платформа предоставляет возможность быстро и легко создавать качественные сайты с различными эффектами, включая Full Page Scroll.
Как создать Full page scroll в Tilda из zero block
В этой главе мы научимся создавать Full page scroll в Tilda, используя несколько нулевых блоков:
- Создайте zero block.
- Зайдите в редактор блока.
- Добавьте любой желаемый контент и настройте экраны адаптивности.
- В поле «WINDOW CONTAINER HEIGHT, %» пропишите цифру «100», чтобы блок занимал всю видимую высоту на любом экране.
- Сохраните изменения и выйдите из зеро блока.
- Зайдите в настройки zero block и нажмите на «Добавить CSS Class Name».
- В появившемся поле пропишите класс «uc-mydiv».
- Сохраните изменения и закройте настройки.
Теперь этот zero block полностью подготовлен для пошаговой прокрутки (Full page scroll). Вы можете создать бесконечное множество разных блоков, используя zero block, но в каждом из них должны быть выполнены эти шаги:
- В поле «WINDOW CONTAINER HEIGHT, %» пропишите цифру «100».
- Зайдите в настройки zero block и нажмите на «Добавить CSS Class Name».
- В появившемся поле пропишите класс «uc-mydiv».
То есть все блоки, которые будут использоваться для пошаговой прокрутки, должны иметь одинаковый класс «uc-mydiv».
После того, как вы создадите и настроите все зеро блоки, выполните следующие действия:
- После всех блоков нажмите на кнопку «+» и добавьте HTML блок «Т123».
- Нажмите на кнопку «Контент» в html блоке.
- Скопируйте и вставьте код в «Контент»
- Cохраните изменения и опубликуйте страницу.
Этот метод использования Full page scroll полностью адаптивный и будет одинаково работать на всех экранах. Всё, что вам нужно сделать – это адаптировать ваш контент, который находится в зеро блоках.
Как создать Full page scroll в Tilda из стандартных блоков
Процесс создания Full page scroll, используя стандартные блоки Тильды практически аналогичен варианту с зеро блоками:
- Добавьте нужные вам стандартные блоки.
- Каждому созданному блоку в настройках присвойте класс «uc-mydiv».
- После всех блоков нажмите на кнопку «+» и добавьте HTML блок «Т123».
- Нажмите на кнопку «Контент» в html блоке.
- Скопируйте и вставьте в «Контент» код из предыдущей главы
- Cохраните изменения и опубликуйте страницу.
Если вы используете стандартные блоки в пошаговой прокрутке, то они автоматически будут адаптированы под все размеры экранов.
Преимущества использования Full page scroll в Tilda
- Увеличение конверсии
Использование эффекта Full page scroll может способствовать росту конверсии на вашем лендинге. Этот эффект привлекает внимание пользователя, предоставляя ему больше информации о вашем продукте или услуге.
- Улучшение визуальной привлекательности
Full page scroll делает лендинг более стильным и запоминающимся. Он создает динамичный и интерактивный опыт для пользователя.
- Повышение удобства использования
Эффект Full page scroll упрощает навигацию по лендингу. Пользователь может легко прокручивать страницу, экономя время на поиске нужной информации.
Недостатки использования Full page scroll в Tilda
- Затрудненный доступ к контенту
Full page scroll может усложнить доступ к информации для некоторых пользователей. Например, если нужно быстро найти конкретную информацию, прокрутка страницы может занять больше времени.
Больше информации на нашем ТГ канале