Интеграция коллтрекинга МАНГО ОФИС (режим Площадка)

Адрес:
https://www.mango-office.ru/

Доступные методы:
https://www.mango-office.ru/support/calltracking_vs_analytics/api_dinamicheskogo_kolltrekinga/js_api_use_cases/?PATH=%2Fcalltracking_vs_analytics%2Fapi_dinamicheskogo_kolltrekinga%2Fjs_api_use_cases 



Доска объявлений
  1.  Для настройки доски необходимо подключить эту услугу в кабинете. Для этого идем в кабинет, далее Коллтрекинг

    Далее “Настройки”, далее “Доски объявлений”


    Настраиваем услугу (включаем ее и настраиваем IVR, вот документация для его настройки
    https://www.mango-office.ru/support/virtualnaya_ats/bystryy_start/nastroyka_skhemy_priema_zvonkov/?utm_source=inst)
  2.  На своей странице внедряем в head перед body следующий скрипт
    <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: XXXXXX}});
    </script>
    

    Этот скрипт можно получить из кабинета

  3. Затем на странице внедряем обработчик события запроса подмены номера

      Код верстки для примера:
<div class="mango-number-block">
   <input type="hidden" class="as-userPhone" value="79876543210">
   <a href="#0" class="show-number">Показать</a> <a class="mgo-number"></a>
</div> 

ВАЖНО: если у вас на странице несколько номеров, они все должны отличаться классами, например “mgo-number-{id}”, также нужно сгенерировать хэш

Код jquery:
$(document).on('click', '.show-number', function (e) {
  e.preventDefault();
  var isSucces = false;
  var ph = $(this).closest('.mango-number-block').find('.as-userPhone').val();
  // Запрашиваем номер
  var hash = as.tools.smallGuidGenerator();
  mgo.getNumber({ redirectNumber: ph, hash:hash }, function(result) {
	console.log("xx",result);
  // Вставляем номер телефона во все теги с классом mgo-number
  document.querySelectorAll('.mgo-number').forEach(function(elem) {
	  $(elem).html(" "+result.number);
	  var attr = $(elem).attr('href');
	  if(typeof attr !== typeof undefined && attr !== false){
		$(elem).attr('href','tel:+'+result.number);
	  }
	  isSucces = true;
	  $('.show-number').hide();
	});
  });
  setTimeout(function(){
	  if(!isSucces){
		  console.log("Mango Неверный номер")
	  }
  },1000);
});
 

Falcon Space - функциональная веб-платформа разработки на узком стеке MS SQL/Bootstrap. Вводная по Falcon Space
Насколько полезной была статья?

Google поиск по нашей документации

Falcon Space

Это снижение стоимости владения

за счет меньшего количества людей для поддержки и узкого стека разработки. Про снижение стоимости владения продуктом

Это быстрое внесение изменений

по ходу эксплуатации программы. Как создается функционал на платформе

Это простой удобный интерфейс

адаптация под мобильные устройства. Про юзабилити платформы

Нужна бесплатная консультация?
Получить оценку проекта
Создайте концепцию проекта на основе нашего шаблона и получите оценку проекта в виде КП.
Демо-сайт решений
Базисные решения, которые можно гибко адаптировать под себя: менять внешний вид, бизнес-логику и даже структуру базы данных.