Как квиз попадает на сайт wfolio
Код LeadForms ставится в wfolio один раз на весь сайт — в «Настройки» → «Интеграция с сервисами». Что и где показывать, вы выбираете в LeadForms, во вкладке «Публикация».
Если квиз должен открываться кнопкой LeadForms внутри страницы или стоять на странице блоком, понадобится ещё короткий код — его вставляют в блок «HTML» на нужной странице. Блок «HTML» добавляется на страницы сайта, поэтому для этого нужен тариф wfolio с сайтом, а не только с галереями.
Если квиз должен открываться кнопкой LeadForms внутри страницы или стоять на странице блоком, понадобится ещё короткий код — его вставляют в блок «HTML» на нужной странице. Блок «HTML» добавляется на страницы сайта, поэтому для этого нужен тариф wfolio с сайтом, а не только с галереями.
В редакторе квиза откройте «Публикация» → «На сайт» и скопируйте код LeadForms
Раскройте блок «Код на сайте» и скопируйте код. Он выглядит так:
Это один код на весь аккаунт: он подключает все ваши квизы и виджеты, для следующих квизов менять его не нужно. Если блок называется «Код LeadForms на сайте найден» — код уже стоит в wfolio, переходите к шагу «Вернитесь в LeadForms…».
<script async src="https://script.leadforms.ru/v1.js" data-key="ВАШ_КЛЮЧ"></script> — ключ в нём уже ваш.Это один код на весь аккаунт: он подключает все ваши квизы и виджеты, для следующих квизов менять его не нужно. Если блок называется «Код LeadForms на сайте найден» — код уже стоит в wfolio, переходите к шагу «Вернитесь в LeadForms…».
В wfolio откройте «Настройки» → «Интеграция с сервисами»
В самом низу левого меню панели wfolio выберите «Настройки» и откройте карточку «Интеграция с сервисами» — «Внешние сервисы и вставка стороннего кода». Здесь добавляется код, который должен работать на всех страницах сайта.
Подробнее о вставке стороннего кода — в справке wfolio.
Подробнее о вставке стороннего кода — в справке wfolio.
Вставьте код в поле «Сторонний код в теге <head>» и сохраните
Вставьте скопированный код LeadForms в поле «Сторонний код в теге <head>». Поле «Сторонний код в теге <body>» не нужно, его не трогайте.
Нажмите «Сохранить» под полями.
Нажмите «Сохранить» под полями.
Вернитесь в LeadForms, выберите, где проходит квиз и чем открывается, и нажмите «Опубликовать»
Во вкладке «Публикация» → «На сайт» в пункте «Где проходит квиз» выберите «Окно поверх сайта» или «Блок в странице», а в «Чем открывается» отметьте нужные способы — можно несколько сразу. Нажмите «Опубликовать» внизу вкладки «Публикация»: пока квиз не опубликован, на сайте он не откроется — только по прямой ссылке.
Для кнопки LeadForms в углу экрана и для автооткрытия на этом всё — переходите к шагу «Проверьте квиз на сайте». Блок «HTML» нужен, только если выбрали:
— «Кнопка на странице» — код
— «Блок в странице» — код
ID — номер квиза. Скопируйте нужный код.
Для кнопки LeadForms в углу экрана и для автооткрытия на этом всё — переходите к шагу «Проверьте квиз на сайте». Блок «HTML» нужен, только если выбрали:
— «Кнопка на странице» — код
<div data-leadforms-button="ID"></div>;— «Блок в странице» — код
<div data-leadforms-block="ID"></div>.ID — номер квиза. Скопируйте нужный код.
Откройте страницу, где должен быть квиз
В левом меню wfolio откройте раздел «Сайт» и кликните по названию страницы, на которую нужно поставить квиз, — например, «Главная» или «Услуги». Блок «HTML» добавляется на страницы с типом «Составная страница», тип подписан под названием.
Нажмите (+) «Добавить блок»
В редакторе страницы синие кнопки (+) стоят на линиях между блоками. Нажмите ту, что находится в месте, где должен появиться квиз, — при наведении появится подсказка «Добавить блок».
Откройте вкладку «Виджеты»
Откроется окно «Новый блок» с вкладками по типам блоков. Перейдите на вкладку «Виджеты».
Выберите блок «HTML»
Прокрутите вкладку «Виджеты» вниз до раздела «HTML». В нём несколько раскладок: HTML-блок на всю ширину, узкий, два рядом или рядом с текстом или фото. Для квиза подходит первый вариант — HTML-блок на всю ширину. Нажмите на него.
Вставьте код кнопки или блока в блок «HTML»
На странице появится блок с подписью «HTML блок». Кликните в его поле и вставьте скопированный код кнопки или блока — прямо в редакторе страницы. Код LeadForms сюда повторно вставлять не нужно — он уже стоит в «Интеграции с сервисами».
Проверьте квиз на сайте
Нажмите «Смотреть сайт» вверху левого меню и откройте страницу с квизом. Кнопка должна открывать квиз, а блок — показывать его прямо в контенте страницы.
Настройки показа меняются в LeadForms, во вкладке «Публикация», — код в wfolio после этого менять не нужно, достаточно снова нажать «Опубликовать».
Готово! Квиз вставлен.
Настройки показа меняются в LeadForms, во вкладке «Публикация», — код в wfolio после этого менять не нужно, достаточно снова нажать «Опубликовать».
Готово! Квиз вставлен.
Кнопка в углу экрана на всех страницах
Если квиз должен открываться на всём сайте, а не на одной странице, в «Чем открывается» отметьте «Кнопка LeadForms — в углу или кнопкой-баннером». Отдельный код для этого не нужен — хватает кода LeadForms в поле для
<head>. На каких страницах и устройствах показывать кнопку, выбирается там же, в «Публикации».Автооткрытие
Если квиз должен открываться сам — через время, при интересе или при уходе со страницы, — во вкладке «Публикация» → «На сайт» в «Чем открывается» отметьте «Автооткрытие», задайте настройки и нажмите «Опубликовать».
На сайте нужен только код LeadForms в поле «Сторонний код в теге <head>», как в шагах выше. Блок «HTML» здесь не нужен: кнопки на странице нет, квиз открывается сам.
На сайте нужен только код LeadForms в поле «Сторонний код в теге <head>», как в шагах выше. Блок «HTML» здесь не нужен: кнопки на странице нет, квиз открывается сам.
Без вставки кода: кнопка со ссылкой
Квиз можно открыть и по прямой ссылке. В wfolio нажмите (+), вкладка «Кнопки», в настройках кнопки выберите действие «Перейти на внешний адрес» и вставьте ссылку на квиз — она есть в LeadForms во вкладке «Публикация» → «Прямая ссылка». Квиз можно открыть и на своём домене, см. инструкцию по своему домену. Подробнее о квизе для фотографов на wfolio — на отдельной странице.
Ставили квиз раньше по старой инструкции?
Если в «Интеграции с сервисами» стоит прежний код LeadForms (с
В личном кабинете у такого сайта будет плашка «сайт на старом коде» — откройте «Гайд по переходу»: он проверит страницы сайта и покажет, что удалить и чем заменить.
Leadforms.init), квиз продолжит работать как раньше, но новые способы показа, настройки «Публикации» и виджеты на старом коде не работают.В личном кабинете у такого сайта будет плашка «сайт на старом коде» — откройте «Гайд по переходу»: он проверит страницы сайта и покажет, что удалить и чем заменить.
Не получается настроить?
Если что-то не получается, вы можете — поможем разобраться.