Как сделать слайдер до после в Тильде. Пошаговая инструкция
Введение
Слайдер «до и после» в Tilda — это востребованный элемент веб-дизайна, который позволяет сравнить изменения на странице, показывая ее состояние до и после внесения корректировок. Такой слайдер, например, можно использовать для демонстрации изменений в дизайне сайта. Tilda — это известный конструктор сайтов, предоставляющий пользователям множество инструментов для создания привлекательных и функциональных веб-страниц. Одним из таких инструментов является слайдер «до и после», который легко интегрировать на любую страницу, созданную с помощью Tilda.
Как добавить слайдер до после в Tilda
Чтобы добавить слайдер до и после в Tilda, необходимо выполнить несколько простых шагов. Вот они:
- Создайте zero block.
- Удалите лишние элементы в блоке.
- Нажмите на кнопку «+» и выберите «Add Image».
- Загрузите в зеро блок первое изображение для вашего слайдера.
- Точно также загрузите второе изображение.
- Оба изображения вынесите за пределы видимости зеро блока.
- Нажмите на кнопку «+» и выберите «Add HTML».
- Cкопируйте в html элемент код.
- Сохраните изменения и закройте html элемент.
- Нажмите на первое изображение правой кнопкой мыши и выберите пункт «Copy image url».
- Вернитесь в html элемент и вставьте скопированную ссылку на изображение вместо первого слова «ссылка».
- Таким же образом скопируйте ссылку на второе изображение и вставьте её в код вместо второго слова «ссылка».
- Выделите html элемент левой кнопкой мыши.
- В полях «W» и «H» вместо пикселей выберите проценты.
- Нажмите на «+container», в поле «CONTAINER» выберите «Window container».
- В полях «AXIS X» и «AXIS Y» выберите «center».
- Сохраните изменения и закройте zero block.
- Опубликуйте страницу.
Как использовать слайдер до после в Tilda
С помощью слайдера «до и после» в Tilda вы можете наглядно продемонстрировать результаты своей работы или добавить визуальный интерес на странице. Это может быть полезно для отображения улучшений интерфейса, внедрения новых функций или повышения качества продукта. Такой слайдер помогает эффективно донести изменения до клиентов или потенциальных покупателей. Кроме того, слайдер «до и после» идеально подходит для сравнения продуктов или услуг, например, для демонстрации различий между старой и новой версией продукта или разных цветовых схем. Это помогает пользователям лучше понять, какие изменения были внесены и как они могут повлиять на их восприятие продукта или услуги. Также слайдер «до и после» можно использовать в медицинской, косметической или других профессиональных областях. Например, он может показать результаты операции или эффект от применения косметических средств.