Модификации, скрипты и эффекты для Тильды

2.

3.

4.

1.

5.

6.

7.

Модификации представляют собой коды, плагины и скрипты, которые расширяют границы привычного функционала платформы. Какие-то модификации фокусируются на улучшении визуала и анимации, другие на добавлении отсутствующего по умолчанию функционала, а какие-то могут ускорить процесс разработки сайта и упростить жизнь дизайнера.

Основная задача модификаций (модификаторов) — выйти за рамки базового функционала Тильды и разработать привлекательный и удобный сайт.

Благодаря модификациям возможно:

• Сделать сайт привлекательнее

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

• Расширить функции сайта

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

• Улучшить пользовательский опыт

Да просто приятнее будет пользоваться сайтом, где уделено внимание мелочам. Пользователь только задумался, а это уже сделано.

• Ускорить верстку

Применение готовых модификаций избавляет от необходимости программирования с чистого листа, что существенно сокращает сроки создания сайта.

На каком тарифе Тильды доступны модификации

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

Мы подробно рассказали о о разных тарифах и их ограничениях в нашей статье «Как выбрать подходящий план Тильды для бизнеса».

Есть несколько команд, которые предлагают скрипты и модификации для упрощения работы дизайнера при создании сайтов на Tilda. Часть их решений доступна через платную подписку, и авторы помогают с установкой и настройкой, часть доступна бесплатна. В этой статье мы рассмотрели модификации нескольких авторов, которые считаем классными и полезными (их можно встретить в статье с подборкой лучших сайтов на Тильде).

1. Эффекты для кнопок
Различные эффекты, проявляющиеся при наведении на кнопки. Доступен разный функционал в зависимости от версии (платная и бесплатная): например, «подписаться на Телеграм» может интегрироваться в кнопку иконку мессенджера.

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

3. Анимация текста и заголовков
Плагин позволяет красиво анимировать заголовки —например, текст сможем закручиваться, рассеиваться или появляться из пустоты.

4. Счетчик для цифр
Часто используемый эффект, который можно встретить в блоках с цифрами о компании (например, «мы привезли уже 689 машин из Южной Кореи»). Регулируется скорость, диапазон цифр.

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

2. Конструктор слайдеров
Расширение стандартного функционала этого блока: красивое перелистывание, работа с табами, переключение стрелочками.

3. Эффект наложения блоков при скролле
Эффект, когда при скролле на какой-то блок сайта «налезает» следующие блоки, закрывая предыдущий.

4. Эффекты скрытого футера
Модификация, позволяющая футеру (подвалу) вашего сайта красиво появиться.

Посмотрите, как мы реализовали ее на другом нашем проекте — сайт, посвященный жанру ASMR (вошли с ним в подборку лучших сайтов на Тильде).

1. Скрипты для стандартных блоков
Множество решений, позволяющие ускорить верстку и добавить микро-фишек на сайт и сделать его привлекательнее: бегущая строка из логотипов, скругление углов, убирание текста в «под кат».

2. Модификации потоков
У Тильды есть стандартный инструмент для публикации новостей (Потоки), и этот скрипт позволяет внести щипотку индивидуальности в блок, который на всех сайтах выглядит одинаково.

3. Модификации для интернет-магазина
Большое количество приятных улучшений для вашего интернет-магазина: альтернативная сетка товаров в каталоге, увеличение карточки товара при наведении мышки, своя уникальная иконка для добавления товара в «Избранное». Часть плагинов доступна бесплатно, но большая, конечно, в закрытом платном клубе по подписке.

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

Большая часть модификаций на рынке направлена на улучшение дизайна и визуального опыта (анимации, перелистывание карточек, переходы между проектами в галерее), но есть и те, которые отвечают за маркетинг (дополнительные баннеры в корзине товаров, таймеры, улучшенные фото товаров в интернет-магазине, квизы).

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

Если вы поняли, что функционала базовых блоков вам уже не хватает, то можно попробовать создать свою собственную модификацию для Тильды. На этой платформе есть возможность добавлять свой код через Zero-блок, и, получается, что остается дело за малым — написать этот код самостоятельно.

Давайте рассмотрим этапы создания собственного плагина, используя искусственный интеллект (chatGPT, Claude, Perplexity и другие):

• Понять, что именно мы хотим реализовать
• Составить промпт (запрос-задание) для ИИ
• Внедрить полученный код на сайт

В нашем примере мы решили показать, как можно изменить внешний вид слайдера изображений, добавив ему другие стрелки. Для этого мы пошли в ChatGPT и дали ему такое задание:

После этого мы получили код, который надо внедрить на сайте (используется блок T123 или добавление через HTML). Вот так выглядит итоговый результат:

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

Есть несколько способов добавления скриптов и плагинов к себе на страницу — через стандартный блок T123 Тильды либо же через добавление HTML-кода, используя Zero Block.

Интерактивность, которую мы добавляем с помощью модификаций, помогает улучшить вовлечение пользователей, увеличить их время на сайте и улучшить поведенческие факторы, что упрощает SEO-продвижение. Если вы хотите узнать, как продвигать сайт на Тильде, то почитайте об этом в нашей другой статье.

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

Помимо вышеперечисленных преимуществ многие скрипты помогают и в скорости запуска проекта, сокращая время дизайнера и позволяя быть продуктивнее — соответственно, заказчик получает более качественный проект.