«Колесо Фортуны» показывает посетителю окно с колесом призов. Он нажимает кнопку, колесо крутится и останавливается на призе: промокоде или ссылке на акцию. Перед тем как показать приз, виджет может попросить email или телефон, и тогда каждый розыгрыш приносит вам контакт. В этой инструкции по шагам разобрано, как создать колесо в личном кабинете, заполнить призы, настроить показ, вставить код на сайт и читать статистику.
Перед началом
Придумайте призы и заведите промокоды в своём магазине или CRM: колесо выдаёт ровно тот текст, который вы впишете, и само скидку не применяет. Если призом будет страница акции, подготовьте её адрес. Призов в колесе от 2 до 12. Как подобрать призы и шансы, чтобы акция окупалась, рассказано в статье блога «Как настроить колесо фортуны».
Колесо доступно на всех тарифах, включая бесплатный. Сколько колёс можно создать: на Free — 1, на Pro — до 3, на Business — до 10. Призы, шансы, сбор контактов, условия показа, пять шаблонов оформления, тексты окна и кнопка на странице работают на любом тарифе. Цвета, шрифт, скругления и анимацию меняют на Pro и Business, а ссылку на сервис под окном убирают на Business. Цены — на странице «Тарифы».
Создание колеса по шагам
- Войдите в личный кабинет по коду из письма. В меню «Виджеты» выберите «Колесо фортуны» (на главной странице кабинета это плитка среди виджетов).
- Нажмите «Новый виджет», в окне «Укажите ваше название для нового виджета» введите название, которое будет видно только вам, например «Колесо для сайта», и нажмите «Создать». Колесо появится в списке: нажмите под ним «редактировать».
- В карточке «Награды» выберите «Тип награды»: «Промокоды» или «Ссылки». Заполните у каждого приза «Название (текст на колесе)» и «Промокод» или «Ссылка (URL)». Кнопка «Добавить награду» добавляет приз, крестик в углу карточки удаляет его.
- Если призы должны выпадать с разной частотой, включите «Установить шансы вручную» и задайте каждому «Шанс (%)». Сумма шансов должна быть ровно 100 %.
- В карточке «Получение приза» выберите «Действие после выигрыша»: показать приз сразу или сначала запросить email либо телефон. Чтобы узнавать о новых контактах, включите «Уведомлять на почту о новых контактах».
- В карточке «Условия запуска» решите, когда открывать колесо: по таймеру, при попытке уйти с сайта или по JavaScript-событию.
- В карточке «Дизайн» выберите шаблон, впишите тексты окна и при желании включите «Кнопку на странице». Проверьте результат в «Предпросмотре»: кнопка «Крутануть» прокручивает колесо прямо в редакторе.
- Нажмите «Сохранить». Затем нажмите «Код для вставки», скопируйте строку из поля «HTML-код виджета» и вставьте её на все страницы сайта.
- Откройте сайт в обычном и в приватном окне браузера и дождитесь, пока колесо появится: так вы увидите его глазами нового посетителя.
Что уже есть в новом колесе
Новое колесо можно сразу поставить на сайт и посмотреть, как оно работает. В нём три приза: «Скидка 10%» с промокодом PROMO10, «Скидка 20%» с PROMO20 и «Бесплатная доставка» с FREESHIP, приз показывается сразу без сбора контакта, колесо открывается через 5 секунд после загрузки страницы, а шансы распределяются автоматически. Перед запуском акции замените промокоды на свои: иначе посетители получат коды, которых нет в вашем магазине.
Настройки виджета
«Название виджета» видно только вам в списке виджетов. Переключатель «Отображать виджет на мобильных» включён по умолчанию: если его выключить, на телефонах колесо не появится. «Временно отключить» прячет колесо с сайта, не удаляя настройки, а в списке виджетов у него появится пометка «отключён».
Награды и шансы
«Тип награды» один на всё колесо: либо все призы — промокоды, либо все — ссылки. При промокодах посетитель видит код и кнопку «Скопировать». При ссылках он видит кнопку «Забрать приз», которая открывает адрес из поля «Ссылка (URL)». Адрес должен начинаться с https:// или http://, иначе редактор не сохранит колесо.
«Название (текст на колесе)» — это надпись на секторе, до 30 символов. Пишите коротко: «Скидка 10%», «Доставка 0 ₽», «Подарок к заказу». Сектора раскрашиваются цветами шаблона по кругу. Призов должно быть не меньше двух и не больше двенадцати: при попытке удалить предпоследний или добавить тринадцатый редактор покажет ошибку.
Пока «Установить шансы вручную» выключено, все призы выпадают одинаково часто. Если включить переключатель, у каждого приза появится поле «Шанс (%)». Над списком редактор показывает предупреждение, пока сумма не равна 100 %, и не сохраняет колесо с другой суммой. Шанс 0 % означает, что приз виден на колесе, но не выпадает никогда.
Приз определяет сервер AllWidgets, а не браузер посетителя. В код на сайте шансы и значения призов не попадают, поэтому подсмотреть промокод в коде страницы или подкрутить результат нельзя.
Получение приза и контакты
Поле «Действие после выигрыша» в карточке «Получение приза» задаёт, что происходит, когда колесо остановилось:
- «Показать приз сразу (без действий)» — посетитель сразу видит выигрыш и промокод или кнопку-ссылку;
- «Запросить Email перед показом приза» — виджет называет приз и просит: «Оставьте email — и приз ваш». Промокод или ссылка появятся после нажатия «Получить приз»;
- «Запросить телефон перед показом приза» — то же с номером телефона.
Email и телефон проверяются ещё в окне: с опечаткой виджет попросит исправить адрес или номер и не потратит приз. Если посетитель случайно закроет окно или перезагрузит страницу в той же вкладке, выигранный приз никуда не денется: колесо откроется с тем же результатом, а не начнёт розыгрыш заново.
Собранные контакты видны на странице статистики виджета. Если включить «Уведомлять на почту о новых контактах», о каждом новом контакте придёт письмо на email вашего аккаунта.
Когда колесо появляется
В карточке «Условия запуска» три способа показа, их можно включать вместе:
- «По таймеру» — через заданное число секунд после загрузки страницы (от 1 до 600, в новом колесе 5);
- «При попытке уйти с сайта» — когда курсор поднимается вверх за пределы окна, к вкладкам и адресной строке. Это движение мыши, поэтому условие работает на компьютере; на телефоне колесо откроют таймер, кнопка на странице или JavaScript-событие;
- «По JavaScript событию» — колесо открывает ваш собственный код, например после добавления товара в корзину. Подробнее ниже, в разделе «Установка на сайт».
Сами по себе таймер и уход со страницы показывают колесо один раз за визит, пока у посетителя открыт сайт в этой вкладке. Если на странице уже открыто другое окно AllWidgets, например квиз или «Ловец лидов», колесо дождётся, пока его закроют. Переключатель «Не показывать при повторных визитах» запоминает посетителя в cookie на год: тому, кто уже видел колесо, оно больше не показывается совсем — ни само, ни по кнопке на странице, ни по JavaScript-событию. Исключение одно: если посетитель уже прокрутил колесо, при перезагрузке страницы в той же вкладке оно откроется с его выигрышем.
Как подобрать момент показа, чтобы окно не раздражало, рассказано в статье блога «Всплывающее окно при уходе с сайта».
Дизайн и тексты окна
В карточке «Дизайн» пять шаблонов: «Минимал», «Неон», «Праздник», «Премиум» и «Пастель». Шаблон задаёт цвета секторов, указатель, обод колеса, кнопку и шрифт. Колёса, созданные до появления шаблонов, показываются в шаблоне «Праздник».
Блок «Тексты окна» доступен на любом тарифе: «Заголовок» (до 80 символов, по умолчанию «Испытайте удачу!»), «Подзаголовок» (до 160 символов) и «Текст кнопки» (до 32 символов, по умолчанию «Крутить колесо»). Пустое поле показывает надпись по умолчанию.
Переключатель «Кнопка на странице» добавляет на сайт постоянную кнопку, которой посетитель сам открывает колесо в любой момент. Для неё выбирают, «Где» она стоит («Справа внизу» или «Слева внизу»), «Форму» («Круглая иконка» или «Иконка и текст») и «Текст» до 24 символов. Кнопка — дополнительный способ показа: таймер и остальные условия работают как прежде.
Блок «Тонкая настройка» с пометкой Pro открывает «Цвета секторов» (от 2 до 6, повторяются по кругу), акцент, фон окна и его градиент, цвета текста и кнопки, «Затемнение страницы» и «Плотность затемнения», «Скругление углов», «Шрифт заголовков», «Анимацию появления», «Размер колеса» и «Обод колеса». Кнопка «Вернуть цвета шаблона» сбрасывает правки. Если тариф закончится, колесо будет показываться чистым шаблоном, а ваши цвета сохранятся и вернутся после оплаты.
«Предпросмотр» справа обновляется сразу, сохранять для этого не нужно. Переключатель «Компьютер / Телефон» показывает колесо на разных экранах, кнопка «Крутануть» прокручивает его, «Показать заново» возвращает окно в начало. На телефоне превью открывается кнопкой «Предпросмотр» внизу экрана. В превью ничего не записывается: ни розыгрыши, ни контакты, ни статистика.
White Label
Под окном колеса стоит небольшая ссылка «Сделано с помощью» на сервис. На тарифе Business в карточке «White Label» её можно убрать («Отключить ссылку на сервис») или заменить своим текстом со ссылкой («Свой HTML-код»). На Free и Pro карточка закрыта замком.
Установка на сайт
Нажмите «Код для вставки» под карточками. В окне «HTML-код виджета» скопируйте строку вида:
<script src="https://app.allwidgets.ru/s/fortune/ваш-идентификатор/"></script>
Вставьте её на все страницы, где должно появляться колесо: перед закрывающим тегом body или в любое место шаблона. Как это сделать на Tilda, WordPress и 1С-Битрикс, описано в статье «Как установить виджет на сайт». Код вставляется один раз: призы, тексты и оформление меняются в кабинете и подхватываются сайтом без правки кода.
Чтобы открыть колесо из своего кода, включите «По JavaScript событию» и вызовите функцию allwidgets_fortune() или отправьте событие allwidgets_fortune:
<button onclick="allwidgets_fortune()">Крутить колесо</button>
Если на странице несколько колёс, передайте в функцию идентификатор нужного: allwidgets_fortune('ваш-идентификатор'). Без включённого переключателя вызов ничего не делает и ошибок на сайте не вызывает. Открыть колесо можно и из других виджетов: действием «Открыть виджет» в Мультикнопке или кнопкой сообщения в «Фокусе».
Если колесо не появляется, проверьте, что не включено «Временно отключить», на телефоне включено «Отображать виджет на мобильных», вы не видели его раньше при включённом «Не показывать при повторных визитах» (откройте сайт в приватном окне) и тариф оплачен: колёса сверх лимита тарифа на сайте не показываются.
Статистика
В списке виджетов у колеса есть ссылка «статистика», а в редакторе — кнопка «Статистика». Вверху страницы три итога за всё время: «Показы» (сколько раз колесо открылось), «Вращения» и «Получили приз» — сколько посетителей оставили email или телефон и получили приз. При «Показать приз сразу» последний счётчик не растёт: смотрите «Вращения». Ниже график «Статистика по дням».
Таблица «Статистика по наградам» показывает, сколько раз выпал каждый приз, а «Контакты посетителей» — последние 100 контактов с датой, типом, выигранным призом и страницей, на которой его получили. Оттуда контакты можно перенести в свою CRM или сервис рассылок. Целей Яндекс Метрики у колеса нет: результат акции смотрите в статистике виджета и по применённым промокодам в своём магазине.