Как добавить квиз в сайт через Яндекс Тег Менеджер

Инструкция для установки квиза на сайт с помощью Яндекс Тег Менеджер

1. Подготовка в Яндекс Метрике

  1. Перейдите в личный кабинет Яндекс Метрики.

  2. Выберите нужный счётчик.

  3. Включите:

    • Тег-менеджер

    • Пользовательский HTML (в разделе «Настройки счетчика»).

В личном кабинете Метрики нужно перейти в настройку вашего счетчика и включить там «Тег-менеджер», а также функцию «Пользовательский HTML».В личном кабинете Метрики нужно перейти в настройку вашего счетчика и включить там «Тег-менеджер», а также функцию «Пользовательский HTML».


2. Создание триггера

  1. В Тег-менеджере перейдите во вкладку «Триггеры» → «Добавить триггер».
    После этого открываем сам «Тег Менеджер» и переходим во вкладку «Триггеры», тут нажимаем «Добавить триггер».

  2. Настройте:

    • Название: например, "Quiz".

    • Тип триггера: «Просмотр страницы».
      У триггера указываете ваше название, тип триггера выбираем «Просмотр страницы», условия активации триггера – некоторые события.

    • Условия активации:

      • Выберите «Некоторые события».

      • Добавьте условия:

        Page URL не содержит marquiz.ru (для сайта)
        Page URL не содержит mrqz.ru (для квиза по прямой ссылке)


    • В настройке триггера выберите переменную Page URL. В условиях укажите «Не содержит» и введите значения marquiz.ru (для сайта) и mrqz.ru (или другой домен) для прямой ссылки.
      Рекомендуется указать оба значения для избежания ошибок при открытии квиза по ссылке.

  3. Сохраните триггер.


3. Добавление тега

  1. Перейдите во вкладку «Теги» → «Добавить тег».
    Открываем вкладку «Теги» и нажимаем кнопку «Добавить тег».

  2. Заполните:

    • Название: например, "Marquiz Widget".

    • Шаблон тега: «Пользовательский HTML».
      Указываете ваше название, в шаблоне тега выбираем «Пользовательский HTML».

  3. Вставьте HTML-код из редактора квиза:

    • В Marquiz перейдите в «Установка».
      Код HTML нужно скопировать из редактора устанавливаемого вами квиза.

    • Выберите один из способов:

      • Баннер

      • Автооткрытие

      • Виджет

    • Скопируйте код и вставьте в поле HTML в Тег-менеджере.
      Необходимо перенести код квиза из редактора квиза в поле HTML в настройках тега.

  4. Привяжите созданный триггер к тегу.
    Затем нужно лишь активировать триггер, выбрав ранее созданный, и сохранить тег.


4. Публикация

  1. Нажмите «Опубликовать» в Тег-менеджере.
    Нажмите «Опубликовать» в Тег-менеджере.

  2. Дождитесь завершения компиляции контейнера (появится уведомление от Яндекса).
    Дождитесь завершения компиляции контейнера


Готово! Теперь код квиза теперь работает через Тег менеджер. Для отображения квиза добавьте код кнопки непосредственно на сайт


Важно: 

  • Через Тег менеджер поддерживаются только 3 способа установки: Баннер, Автооткрытие, Виджет.

  • Проверьте, что триггер корректно активируется на нужных страницах.

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