Простой коллтрекинг своими руками. Часть JavaScript
Появилась необходимость у клиента отслеживать некоторые сайты через статический коллтрекинг, для этого были написаны скрипты для Bitrix на php и часть на JavaScript, которую рассмотрим в этой статье.
Клиент занимается автозапчастями, по-этому отслеживаем тематические площадки:
- farpost.ru
- drom.ru
- auto.ru
- ferio.ru
Итак приступим
Создадим файл в our_script.js в папке нашего шаблона Битрикс или любой другой CMS — очевидно js часть не будет сильно отличаться.
Скрипт максимально простой, мы получаем заранее обработанные в php куки, анализируем их содержимое и подменяем телефоны на указанные.
Очевидно, что можно сделать модуль, в который пользователь сможет вносить признаки и телефоны, но для простоты мы оставили только самую суть. Далее все понятно из комментариев в скрипте:
// @consultapp.ru
// файл our_script.js в папке /ПУТЬ_К_ШАБЛОНУ/js/
function get_co (co_name){
var res = document.cookie.match ( '(^|;) ?' + co_name + '=([^;]*)(;|$)' );
if (res) return (unescape(res[2]));
else return null;
}
// по готовности документа получаем куки
$(document).ready(function() {
var lidsrc = get_co ( "ИМЯ_НАШЕЙ_КУКИ" );
var tel=null;
var telhref=null;
// анализируем текст куки и указываем нужный телефон
if((lidsrc.indexOf("farpost")>=0) || (lidsrc.indexOf("drom")>=0)){
tel='8 (999) 999-99-99';
telhref='tel:79999999999';
}else if(lidsrc.indexOf("ferio")>=0){
tel='8 (888) 888-88-88';
telhref='tel:78888888888';
}else if(lidsrc.indexOf("auto.ru")>=0){
tel='8 (777) 777-77-77';
telhref='tel:77777777777';
}
// заменяем телефоны на странице по признаку class
// предварительно все ссылки (тег <a>) надо отметить,
// добавив в class атрибут cont_tel
if(tel!=null){
// все отмеченные телефоны
$('.cont_tel').html(tel);
$('.cont_tel').attr("href", telhref);
$('.cont_tel_html').html(tel);
$('.cont_tel_href').attr("href", telhref);
}
}
);
Вставим в header шаблона строку php подключения js для Bitrix, в других CMS есть свои инструменты, ну или вставить в head напрямую, тут уж как кому нравится.
<?
// @consultapp.ru
// подключаем наш скрипт в шаблоне .php
$APPLICATION->AddHeadScript(SITE_TEMPLATE_PATH."/js/our_script.js");
?>
Куки мы используем, т.к. HTTP_REFERER постоянно меняется при переходе по страницам, а нам надо точно указывать одинаковый телефон на всех страницах сайта, который бы соответствовал источнику, с которого пришел клиент.