Меню
Установка Колеса фортуны на Тильду: в тело сайта, всплывающее окно и своя кнопка
Пошаговое руководство по добавлению Колеса фортуны от Лид-виджет на сайт Tilda. Три способа интеграции: встраивание напрямую на страницу, запуск во всплывающем окне и открытие по клику на любую кнопку. От копирования кода в HTML-блок до публикации и проверки — всё за 10 минут.
Создайте и настройте колесо фортуны
Если вы еще не зарегистрировались и не создали колесо фортуны, обязательно сделайте это. В этом вам помогут инструкции:
Установка в тело сайта
Перейдите на страницу настроек вашего колеса фортуны, и перейдите во вкладку Установка.
Выберите пункт В тело сайта, и в открывшейся панели скопируйте код подключения.
Далее перейдите в личный кабинет Тильды, в настройки той страницы на которую нужно установить колесо фортуны. Добавьте новый блок.
Выберите Другое > HTML
У вас появится новый блок. Нажмите кнопку Контент.
Вставьте ранее скопированный код подключения, и нажмите на кнопку Сохранить и закрыть.
Нажмите на кнопку Опубликовать
После того как станица опубликуется нажмите Открыть страницу.
Как мы видим колесо фортуны успешно установилось в тело сайта. Как видим виджет растягивается на всю ширину страницы, и при этом фон тоже заполняет это пространство. При желании можно ограничить ширину виджета контенером определенного размера.
Установка в всплывающем окне
После того как мы установили виджет в тело сайта, теперь давайте установим в качестве всплывающего окна. Для этого снова переходим в настройки нашего колеса фортуны во вкладку Установка. И выбираем пункт Всплывающее окно на сайте.
Далее идем во кладку Код подключения и копируем его.
Заходим в настройки страницы на которой будет установлен виджет. По аналогии создаем блок HTML, прописываем в контент код который мы скопировали в настройках колеса фортуны и публикуем страницу.
Давайте теперь проверим как у нас теперь отображается колесо фортуны на нашем сайте. Видим что виджет установился корректно, отображается и кнопка и само всплывающее окно.
Своя кнопка открытия всплывающего окна с колесом фортуны
Что если вы хотите установить колесо фортуны в качестве всплывающего окна, но при этом хотите чтобы оно открывалось при клике на любую кнопку на сайте. Для этого передите в настройки колеса фортуны. Все та же вкладка где мы получали код подключения. В самом низу есть ссылка для кнопки Тильда. Скопируйте ее.
Далее идем в Тильду в настройки страницы где у нас стоит колесо фортуны. Отредактируйте контент блока где есть кнопка. Вставьте в поле ссылка для кнопки ту ссылку которую вы скопировали ранее в настройках колеса фортуны. Нажмите сохранить и закрыть и опубликуйте страницу.
Теперь при клике на эту кнопку у вас будет открываться всплывающее окно с виджетом.
Заключение
Готово! Мы рассмотрели все варианты установки колеса фортуны на сайт на Тильде.
Другие инструкции в разделе
Часто задаваемые вопросы
Нет, никаких специальных знаний не требуется. Вам достаточно скопировать готовый код подключения из личного кабинета Лид-виджет и вставить его в стандартный HTML-блок Тильды. Все инструкции показывают, куда именно нажать.
При установке в тело сайта колесо является полноценной секцией страницы и растягивается на всю ширину экрана. Вариант «Всплывающее окно» добавляет на сайт кнопку, при нажатии на которую колесо открывается в виде попапа поверх контента. Выбор зависит от дизайна страницы и желаемого акцента.
Колесо автоматически занимает всю доступную ширину. Чтобы визуально его сузить, достаточно поместить HTML-блок с кодом внутрь контейнера Тильды ограниченной ширины (например, в колонку фиксированной ширины). Сам код менять не нужно.
Во-первых, убедитесь, что вы опубликовали страницу — в режиме предпросмотра Тильды виджет может не загружаться. Во-вторых, проверьте, активен ли ваш виджет в Лид-виджет и не удалён ли он. В-третьих, откройте страницу в режиме инкогнито, чтобы исключить конфликт с расширениями браузера.
В настройках Колеса фортуны во вкладке «Установка» (раздел всплывающего окна) найдите «Ссылку для кнопки Тильда». Скопируйте её. Затем в редакторе Тильды у нужной кнопки вставьте эту ссылку в поле «Ссылка». После публикации клик по вашей кнопке будет открывать попап с колесом.
Да. Код подключения появляется только после того, как колесо создано и настроено в Лид-виджет. Если у вас ещё нет готового виджета, воспользуйтесь инструкцией по регистрации и инструкцией по созданию и настройке колеса фортуны.
Да, технически это возможно. Для этого создайте два отдельных виджета в Лид-виджет и добавьте их коды в разные HTML-блоки на странице Тильды. Однако следите, чтобы они не конфликтовали визуально и не перегружали страницу.
Код виджета асинхронный и не блокирует отрисовку остального контента. Влияние на скорость минимально, но для чистоты данных вы можете проверить показатели через PageSpeed Insights. При правильной настройке замедление практически незаметно для посетителей.
Не нашли ответ на свой вопрос?
Напишите нам — поможем разобраться
