Добавить квиз в сайт можно 6 способами:
Шаг №1 для всех способов — установка кода инициализации (скрипта):
Независимо от того, каким способом будете устанавливать квиз, нужно внедрить на сайт код инициализации (скрипт). Данный код находится во вкладке «Установка квиза» => Далее нужно выбрать способ установки квиза => «Вставить код на сайт»
Код инициализации устанавливается в блог <head> на вашем сайте. Если у вас сайт выполнен на каком-либо конструкторе сайтов, то вам нужно найти место куда вы сможете вставлять HTML код — можете уточнить у поддержки вашего конструктора сайтов или найти инструкцию к вашему конструктору в нашей базе знаний.
Шаг №2 для всех способов — вставка кода квиза.
Теперь расскажем подробнее про каждый способ.
Способ 1: Автооткрытие квиза
Для автооткрытия квиза на сайте достаточно установить код инициализации квиза (скрипт). В настройках кода инициализации нужно выбрать настройки автооткрытия, кликнуть «Далее» и скопировать код.
Скопированный код нужно установить на сайт как было сказано в пункте выше.
Готово! Квиз будет открываться в модальном окне.
Способ 2: Вставить кнопку Marquiz
Чтобы установить кнопку, необходимо перейти во вкладку установки и выбрать «По кнопке». Здесь можно настроить дизайн кнопки и после этого скопировать код кнопки.
Устанавливаем код инициализации, как описано в начале инструкции, и затем код кнопки.
Код кнопки нужно установить в тэг <body> на вашем сайте в место, где вы хотите видеть кнопку. Готово! Квиз будет открываться в модальном окне.
Способ 3: Добавить ссылку на квиз в свою кнопку
Для установки кнопки необходимо перейти во вкладку установки и выбрать «По кнопке», далее выбрать «Своя кнопка». Вы можете выбрать одну из двух ссылок которые можно разместить в коде кнопки.
Вставьте скопированную ссылку в href="ссылка" вашей кнопки (пример: href="#popup:marquiz_5aa84f60ee90d200185234af").
Готово! Квиз будет открываться в модальном окне.
Способ 4: Вставить квиз в тело сайта
Для установки кнопки необходимо перейти во вкладку установки и выбрать «В тело сайта». В данном меню можно редактировать размеры квиза и настраивать кнопку, которая будет показываться в мобильной версии
На мобильных устройствах квиз будет отображаться в виде кнопки с модальным окном. Вы можете поменять эту настройку, если уберете галочку рядом с надписью «Кнопка на мобильной версии».
После настройки, установите код инициализации как описано в начале инструкции, далее скопируйте код установки квиза и установите в нужное место на сайте в тэг <body>. Готово!
Способ 5: Установить квиз баннером
Для установки кнопки необходимо перейти во вкладку установки и выбрать «Баннером». Дальше в меню можно настроить дизайн баннера.
После настройки копируем код инициализации и вставляем его на сайт, как показано в начале инструкции, далее копируем код банера и устанавливаем его перед закрывающим тегом </body>.
Готово! Квиз будет открываться в модальном окне.
Способ 6: Установить квиз виджетом
Для установки виджета, необходимо перейти во вкладку установки и выбрать «Виджет».
В данном меню вы сможете произвести визуальную настройку виджета.
После настройки копируем код инициализации и вставляем его на сайт, как показано в начале данной инструкции, далее копируем код виджета и устанавливаем перед закрывающим тэгом </body>. Готово!
Теперь проверяем правильность установки квиза:
Если все четыре пункта высвечиваются зеленым цветом, то всё сделали правильно, кнопка установлена и квиз корректно работает.
Если какой-то то из пунктов высвечивается красным цветом, то следует проверить следующие настройки по пунктам:
🐞«код инициализации не установлен» — проверяем, добавили ли код инициализации в блок head.
🐞«скрипт модального окна не установлен» — проверяем, добавили ли код инициализации в блок head.
🐞 «кнопка открытия квиза не установлена» — проверяем, добавили ли кнопку открытия квиза из редактора кнопки в нужное место.
🐞«квиз не установлен или это не тот квиз» — проверяем, что id квиза в коде инициализации или в кнопке открытия квиза соответствует текущему квизу.