Вставка кода виджета при помощи Google Tag Manager
Если Вы используете Google Tag Manager (GTM) для размещения скриптов на Вашем сайте, то разместить код виджета динамического коллтрекинга также необходимо через GTM. При этом изменять непосредственно код виджета не нужно.
Если в GTM еще нет триггера DOM Ready, то его необходимо добавить. Для этого в GTM зайдите:
1) в раздел "Триггеры";
2) нажмите "Создать";
3) назовите триггер "DOM Ready";
4) выберите тип триггера "Модель DOM готова";
5) нажмите "Сохранить":
Если в GTM еще нет триггера DOM Ready, то его необходимо добавить. Для этого в GTM зайдите:
1) в раздел "Триггеры";
2) нажмите "Создать";
3) назовите триггер "DOM Ready";
4) выберите тип триггера "Модель DOM готова";
5) нажмите "Сохранить":
Далее, необходимо добавить тег, для этого:
1) перейдите в раздел "Теги";
2) нажмите "Создать":
1) перейдите в раздел "Теги";
2) нажмите "Создать":
3) назовите тег "Mango Calltracking";
4) выберите тип тега "Пользовательский HTML";
5) в поле "HTML" вставьте скрипт виджета из Личного кабинета;
4) выберите тип тега "Пользовательский HTML";
5) в поле "HTML" вставьте скрипт виджета из Личного кабинета;
В GTM нужно вставить только часть кода виджета, которая ограничена тегами <srcipt> и </srcipt>. Пример кода:
<script>
(function(w, d, u, i, o, s, p) {
if (d.getElementById(i)) { return; } w['MangoObject'] = o;
w[o] = w[o] || function() { (w[o].q = w[o].q ||
[]).push(arguments) }; w[o].u = u; w[o].t = 1 * new Date();
s = d.createElement('script'); s.async = 1; s.id = i; s.src = u;
p = d.getElementsByTagName('script')[0];
p.parentNode.insertBefore(s, p);
}(window, document, '//widgets.mango-office.ru/widgets/mango.js',
'mango-js', 'mgo'));
mgo({calltracking: {id: xxxx, elements: [{selector: '.mgo-number-xxxx'}]}});
</script>
6) включите флаг "Поддержка функции document.writ2e";
7) в расширенных настройках:
7) в расширенных настройках:
- установите "Приоритет активации тегов" в «-1»;
- поставьте флаг "Активировать этот тег только в опубликованных контейнерах";
- в поле "Настройки активации тега" выберите "Без ограничений":
Затем, в этом же окне конфигурации тега следует:
1) в разделе "Триггеры" добавьте созданный триггер DOM Ready;
2) нажмите "Сохранить".
1) в разделе "Триггеры" добавьте созданный триггер DOM Ready;
2) нажмите "Сохранить".
3) GTM необходимо опубликовать, для этого в рабочем окне GTM нажмите "Отправить":
4) нажмите "Опубликовать":
Дальнейшие действия
При желании, можно указать название и описание изменений (не обязательно). Не забудьте убедиться в том, что скрипты GTM корректно установлены на Вашем сайте и HTML-тег с номером телефона на сайте имеет класс "mgo-number-xxxx"
(где xxxx - id виджета).
Сам номер коллтрекинга необходимо разместить в нужных частях страницы непосредственно в html. Вы можете взять первую строку кода виджета из Личного кабинета, в которой будет отображаться номер, и установить её вместо Вашего номера на сайте.
Пример:
Пример:
<a class="mgo-number-xxxx" href="tel:+74991234567">+7 (499) 1234567</a>
Этот код (HTML-тег с номером телефона) должен быть размещен на сайте после (ниже) скриптов GTM.
