Интерактивные инструкции в Tilda

Встройте пошаговый интерактивный гайд на свой сайт Tilda через Zero-блок — одна строка кода, без программиста и плагинов. Виджет адаптируется под любой экран.

Zero-блок T123 Без плагинов Данные в России, 152-ФЗ
tilda.site/help
Логотип Tilda TildaГайд внутри страницы
Шаг 3 / 7 Нажмите «Продолжить»

Способ встройкиZero-блок T123 · HTML-код

Зачем

Зачем встраивать интерактивные инструкции в Tilda

Онбординг клиентов прямо на сайте

Покажите, как работает продукт, прямо на лендинге или в разделе «Как начать». Новый клиент сразу видит интерфейс шаг за шагом — без звонков и видеоинструкций.

Поддержка без очередей

Добавьте страницу «Помощь» с интерактивными FAQ-гайдами на Tilda. Клиенты решают типовые вопросы самостоятельно, а поддержка получает меньше тикетов.

Демонстрация продукта на лендинге

Покажите возможности SaaS или сервиса в живом интерактивном плеере. Потенциальный клиент кликает по шагам и сам «пробует» продукт без регистрации.

База знаний внутри сайта

Tilda удобна для создания корпоративных порталов. Встройте гайды по процессам прямо на страницы — сотрудники и партнёры получают инструкции в контексте.

Как встроить

Как встроить пошаговый гайд в Tilda — за 5 минут

Создайте гайд в Demiqo

Зарегистрируйтесь и запустите расширение Chrome. Нажмите «Записать», выполните процесс как обычно — скриншоты и описания шагов сгенерируются автоматически.

Скопируйте код виджета

В Demiqo откройте гайд, перейдите в «Поделиться» и скопируйте строку с виджетом. Ваш SLUG уже подставлен автоматически.

Откройте Zero-блок в Tilda

В редакторе страницы Tilda нажмите «+», выберите категорию «Другое» и добавьте блок T123 HTML-код (Zero Block). Он позволяет вставить произвольный HTML.

Вставьте код в блок

Откройте настройки блока T123, вставьте скопированный код в поле «HTML-код внутри блока» и нажмите «Применить». Виджет появится на предпросмотре.

Опубликуйте страницу

Нажмите «Опубликовать» в Tilda. Откройте сайт в браузере и убедитесь, что гайд загружается и работает. Проверьте отображение на мобильном устройстве.

Код для вставки в Zero-блок Tilda (T123)
<!-- Вставьте в поле «HTML-код» блока T123 -->
<script src="https://demiqo.ru/w.js" data-guide="ВАШ-SLUG" async ></script>

Если Tilda не выполняет скрипты в вашей конфигурации, используйте iframe-вариант:

<iframe src="https://demiqo.ru/embed/ВАШ-SLUG" width="100%" height="600" frameborder="0" ></iframe>
Что вы получаете

Преимущества интерактивных инструкций на Tilda

Без программиста

Вся работа — в интерфейсе Demiqo и редакторе Tilda. Никакого JavaScript, API или деплоя.

Мобильная адаптация

Плеер адаптируется под смартфон автоматически. Tilda-страница и гайд выглядят корректно на любом устройстве.

Аналитика просмотров

В Demiqo видно, сколько раз просмотрен гайд, до какого шага доходят посетители и с каких источников приходят.

Формы сбора заявок

Добавьте шаг с формой прямо в гайд. Заявки идут в amoCRM, Битрикс24, Telegram или на email. Подробнее об интеграциях.

Доступ по паролю

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

Экспорт PDF / MD / PNG

Сопроводительные материалы в любом формате — для офлайн-использования или корпоративных документов.

FAQ

Вопросы про интерактивные инструкции в Tilda

Тормозит ли виджет Demiqo сайт на Tilda?

Нет. Виджет загружается асинхронно (атрибут async) — он не блокирует загрузку вашей страницы. Скрипт весит около 5 KB и инициализируется только когда посетитель прокрутит страницу до блока с гайдом.

Нужен ли плагин или доступ к коду Tilda?

Нет. Достаточно стандартного Zero-блока T123 («HTML-код»), доступного в редакторе Tilda без каких-либо дополнений. Никаких плагинов, сторонних интеграций или технических настроек на стороне Tilda.

Можно ли разместить несколько гайдов на одной странице Tilda?

Да. Добавьте несколько Zero-блоков T123, в каждом укажите разный data-guide="SLUG". Гайды будут работать независимо друг от друга и не мешать встроенным скриптам Tilda.

Адаптируется ли виджет под мобильные устройства на Tilda?

Да, полностью. Плеер Demiqo адаптивный: на мобильных экранах интерфейс перестраивается, hotspot-подсказки масштабируются, кнопки навигации удобны для тапа. Адаптивность работает без дополнительных настроек в Tilda.

Работает ли виджет на бесплатном тарифе Tilda?

Да. Zero-блок с HTML-кодом доступен на всех тарифах Tilda. Виджет Demiqo использует стандартный JavaScript и не требует платных функций платформы. Сам Demiqo также имеет бесплатный тариф с 5 гайдами.

Готовая структура

Начните с шаблона инструкции

Выберите сценарий, замените шаги своими и опубликуйте готовый гайд на Tilda.

Открыть шаблоны
Встройка в Tilda

Создайте первый гайд бесплатно

Запишите процесс в Chrome, получите готовые шаги и вставьте инструкцию на сайт одной строкой кода.

Начать бесплатно