Как добавить квиз на сайт?

Общая инструкция для всех сайтов

Добавить квиз в сайт можно 6 способами:

  1. Автооткрытие квиза; 
  2. Вставить кнопку Marquiz;
  3. Добавить ссылку на квиз в свою кнопку;
  4. Вставить квиз в тело сайта; 
  5. Установить всплывающий баннер; 
  6. Установить Marquiz в виде виджета.

Установка кода инициализации (скрипта):

Важно! Независимо от способа установки квиза вам нужно внедрить на сайт код инициализации (скрипт). Данный код находится во вкладке "Установка квиза" => далее нужно выбрать способ установки квиза => “Вставить код на сайт”

Код инициализации устанавливается в блог <head> на вашем сайте. Если у вас сайт выполнен на каком-либо конструкторе сайтов, то вам нужно найти место куда вы сможете вставлять HTML код (можете уточнить у поддержки вашего конструктора сайтов или можете найти инструкцию к вашему конструктору в нашей базе знаний).

Способ 1: Автооткрытие квиза 

Для автооткрытия квиза на сайте достаточно установить код инициализации квиза (скрипт). В настройках кода инициализации нужно выбрать настройки автооткрытия, кликнуть "Далее" и скопировать код.
Скопированный код нужно установить на сайт как было сказано в пункте выше.

Готово! Квиз будет открываться в модальном окне.

Способ 2: Вставить кнопку Marquiz

Для установки кнопки необходимо перейти во вкладку установки и выбрать "По кнопке". Там вы сможете настроить кнопку как вам нужно и после этого скопировать код кнопки. 

Установите код инициализации как описано в начале инструкции и код кнопки.

Код кнопки нужно установить в тэг <body> на вашем сайте в место где вы хотите видеть кнопку. Готово! Квиз будет открываться в модальном окне.

Способ 3: Добавить ссылку на квиз в свою кнопку

Для установки кнопки необходимо перейти во вкладку установки и выбрать "По кнопке", далее выбрать "Своя кнопка". Вы можете выбрать одну из двух ссылок которые можно разместить в коде кнопки.
Вставьте скопированную ссылку в href="ссылка" вашей кнопки (пример: href="#popup:marquiz_5aa84f60ee90d200185234af").

Готово! Квиз будет открываться в модальном окне.

Способ 4: Вставить квиз в тело сайта 

Для установки кнопки необходимо перейти во вкладку установки и выбрать "В тело сайта". В данном меню вы можете редактировать размеры квиза и настроить кнопку, которая будет показываться в мобильной версии
На мобильных устройствах квиз будет отображаться в виде кнопки с модальным окном. Вы можете поменять эту настройку, если уберете галочку рядом с надписью "Кнопка на мобильной версии".

После настройки, установите код инициализации как описано в начале инструкции, далее скопируйте код установки квиза и установите в нужное место на сайте в тэг <body>. Готово!


Способ 5: Установить всплывающий баннер 

Для установки кнопки необходимо перейти во вкладку установки и выбрать "Баннером". В данном меню вы сможете произвести визуальную настройку баннера.

После настройки скопируйте код инициализации и вставьте его на сайт, как показано в начале инструкции, далее скопируйте код банера и установите его перед закрывающим тегом </body>.

Готово! Квиз будет открываться в модальном окне.

Способ 6: Установить виджет на сайт 

Для установки виджета, необходимо перейти во вкладку установки и выбрать "Виджет"

В данном меню вы сможете произвести визуальную настройку виджета.

После настройки скопируйте код инициализации и вставьте его на сайт, как показано в начале данной инструкции, далее скопируйте код виджета и установите перед закрывающим тэгом </body>. Готово!

 

Чтобы проверить правильность установки квиза необходимо сделать следующие действия:  

  1. Скопировать адрес сайта. Скопируйте адрес вашего сайта, на котором установлен квиз.
  2. Найти раздел «установка квиза». На сайте Marquiz, в панели редактирования, перейдите в раздел «установка квиза».
  3. Проверьте установку. выберите ваш способ установки квиза, перейдите в пункт "Вставить код на сайт" =>  "Проверьте правильность установки", введите в окно полный адрес страницы, где вы установили квиз, и нажмите "проверить" 

Если все четыре пункта высвечиваются зеленым цветом, то вы все сделали правильно, кнопка установлена и квиз корректно работает.

Если какой-то то из пунктов высвечивается красным цветом, то следует проверить следующие настройки по пунктам:

«код инициализации не установлен»
Проверьте, добавили ли вы код инициализации в блок head.
«скрипт модального окна не установлен»
Проверьте, добавили ли вы код инициализации в блок head.
«кнопка открытия квиза не установлена»
Проверьте, добавили ли вы кнопку открытия квиза из редактора кнопки в нужное место.
«квиз не установлен или это не тот квиз»
Проверьте, что id квиза в коде инициализации или в кнопке открытия квиза соответствует текущему квизу.

👆 На этом пока всё