Подмена на сайте
Описание
Для отслеживания источников звонков необходимо осуществлять подмену номеров на вашем сайте – именно этот процесс позволяет сопоставить информацию по сессии со звонком. Для реализации подмены на сайте у вас есть сразу несколько способов, о которых ниже пойдет речь.
Добавление подмены
Добавление подмены может происходить в двух местах: в процессе добавления пула на табе "Отслеживание" в разделе меню "Настройки" – "Управление номерами" и на табе "Подмена" в том же меню.
Добавление подмены во время настройки пула
На первом шаге добавления пула вы можете указать настройки подмены на сайте:
В данном поле вы можете ввести номера с сайта, которые необходимо подменять пулом, или класс или идентификаторы элементов, в которых расположен номер. Номер указывается в формате 4951234567, то есть без лишних символов и без кода страны. При введении любого из значений на табе "Подмена" будет создан блок подмены, который в дальнейшем можно будет редактировать.
Обратите внимание! Вводя номер телефона, блок подмены будет создан и сразу будет доступен для осуществления подмены, а ввод любых других символов будет распознан как название класса – его необходимо будет донастроить на табе "Подмена", отредактировав созданный блок подмены. Об этом рассказано подробнее далее в инструкции.
Добавление подмены
Добавление подмены происходит по нажатию кнопки "Добавить подмену". По ее нажатию откроется сайдбар с настройками добавления подмены.
Далее пункты добавления пула будут рассмотрены подробнее.
Автоматическая подмена номера
Данный пункт выбран по умолчанию. Выбрав данный пункт и введя номер в поле "Номер для поиска", Calltouch автоматически будет искать указанный вами номер и подменит его на отслеживаемый. Если номер встретится на странице несколько раз, все одинаковые номера будут заменены на отслеживаемый номер.
В поле "Номер для поиска" указывается номер, который необходимо найти на сайте и заменить на номер из пула. В одном автоматическом поиске номера можно указать только один номер. Если же вам необходимо подменять другие номера на сайте, создайте для них отдельные подмены, аналогично этому.
Главное условие для успешной подмены - номер на сайте должен быть представлен вместе с кодом города, в ином случае используйте подмену по классам или идентификаторам.
В поле "Селектор для поиска номера" указывается CSS-селектор, внутри всех элементов которого будет осуществлен поиск номера. По умолчанию выбран body, то есть поиск будет во всем отображаемом содержимом. Доступные селекторы представлены в таблице:
Селектор | Пример | Результат |
Базовые селекторы |
||
".class" | ".call_phone" | Выберет все элементы с классом "call_phone". |
"#id" | "#call_phone" | Выберет элемент с идентификатором "call_phone". |
"tag" | "body" | Выберет все элементы внутри тега "body". |
Комбинированные селекторы | ||
"first, second, ..." | ".call_phone_1, .call_phone_2" | Выберет все элементы с классами call_phone_1, call_phone_2. |
"outer inner" | "div .call_phone_1" | Выберет все элементы с классом call_phone_1, которые находятся в тегах div (независимо от уровня вложенности). |
"parent > child" | "div > .call_phone_1" | Выберет все элементы с классом call_phone_1, которые находятся в тегах div на первом уровне вложенности. |
Селекторы по атрибутам | ||
"[attr]" | "[href]" | Выберет все элементы, у которых имеется атрибут href. |
"[attr = value]" | "[href = 'tel:+74953080100']" | Выберет все элементы, у которых атрибут href равен "tel:+74953080100". |
"[attr ^= value]" | "[href ^= 'tel']" | Выберет все элементы, у которых атрибут href начинается с "tel". |
"[attr $= value]" | "[href $= '0100']" | Выберет все элементы, у которых атрибут href заканчивается на "0100". |
"[attr *= value]" | "[href *= 'tel']" | Выберет все элементы, у которых атрибут href содержит подстроку "tel". |
"[attr ~= value]" | "[name ~= 'Promo']" | Выберет все элементы, у которых атрибут name содержит слово "Promo". |
"[attr |= value]" | "[name |= 'ru']" | Выберет все элементы, у которых атрибут name равен "ru", либо начинается с "ru-". |
"[first][second][..." | "[href *= 'tel'][href *= 'callto']" | Выберет все элементы, у которых атрибут href содержит подстроку "tel" или подстроку "callto". |
Простые фильтры | ||
":not(selector)" | "div:not(.call_phone_3)" | Выберет все элементы с тегом div, кроме тех, которые имеют класс call_phone_3. |
Фильтры по содержимому | ||
":contains('text')" | ":contains('номер')" | Выберет все элементы, в которых содержится текст "номер". |
":has(selector)" | "div:has(a)" | Выберет все элементы с тегом div, внутри которых имеются элементы с тегом a. |
Фильтры дочерних элементов | ||
":first-child" | "a:first-child" | Выберет все элементы с тегом a, находящиеся первыми внутри своего родительского элемента. |
":last-child" | "a:last-child" | Выберет все элементы с тегом a, находящиеся последними внутри своего родительского элемента. |
":nth-child( )" ":nth-last-child( )" |
"a:nth-child(3)" "a:nth-last-child(1)" |
"a:nth-child(3)" выберет все элементы с тегом a, находящиеся третьими сверху внутри своего родительского элемента. "a:nth-last-child(1)" выберет все элементы с тегом a, находящиеся первыми снизу внутри своего родительского элемента. |
":only-child" | "a:only-child" | Выберет все элементы с тегом a, являющиеся единственными внутри родительского элемента. |
":only-of-type" | "a:only-of-type" | Выберет все элементы с тегом a, являющиеся единственными тегом a внутри родительского элемента. |
":first-of-type" | "a:first-of-type" | Выберет все элементы с тегом a, являющиеся первым тегом a внутри родительского элемента. |
":last-of-type" | "a:last-of-type" | Выберет все элементы с тегом a, являющиеся последним тегом a внутри родительского элемента. |
":nth-first-of-type( )" ":nth-last-of-type( )" |
"a:nth-first-of-type(3)" "a:nth-last-of-type(1)" |
"nth-first-of-type(3)" выберет все элементы с тегом a, находящиеся третьими сверху (среди элементов с тегом a) внутри своего родительского элемента. "nth-last-of-type(1)" выберет все элементы с тегом a, находящиеся первыми снизу (среди элементов с тегом a) внутри своего родительского элемента. |
Обратите внимание, что для работы селекторов на вашем сайте должна быть установлена последняя версия скрипта Calltouch.
Подмена содержимого класса
Выбрав данный пункт, номер телефона вместе с содержимым HTML-тегов с указанным классом будет автоматически подменяться на отслеживаемые номера. Для этого в поле "Название класса" введите название класса, содержимое которого необходимо подменять на указанное далее.
В поле "Содержимое класса" введите содержимое HTML-тега, которое необходимо подменять. То, что будет указано в данном поле, будет отображено на сайте, поэтому, для отображения номера из пула, необходимо использовать freemarker шаблон. Этот шаблон использует привычный синтаксис и порядковые номера цифр в номере телефона. Рассмотрим это на примере: если вы хотите, чтобы номер из пула отображался в формате +7 (495) 123-45-67, необходимо использовать шаблон:
+${pn[0]} (${pn[1]}${pn[2]}${pn[3]}) ${pn[4]}${pn[5]}${pn[6]}-${pn[7]}${pn[8]}-${pn[9]}${pn[10]}
Если в подменяемом HTML-теге, название класса которого вы указываете в настройках подмены, содержится также сопроводительный текст "Номер телефона", то шаблон будет выглядеть как:
Этот шаблон означает, что вместо каждого элемента от 0 до 10 будут подставлены цифры отслеживаемого номера телефона в 11-значном формате, который закреплен за пулом.
Номер телефона: +${pn[0]} (${pn[1]}${pn[2]}${pn[3]}) ${pn[4]}${pn[5]}${pn[6]}-${pn[7]}${pn[8]}-${pn[9]}${pn[10]}
Подмена содержимого идентификатора
Данный пункт полностью аналогичен подмене содержимого класса, только вместо класса вы должны указать идентификатор HTML-тега в поле "Название идентификатора".
Использование в пулах
После выбора и настройки типа подмены вы можете выбрать в каких пулах использовать данную подмену: во всех созданных или только в определенных пулах:
Выбрав опцию "Все онлайн пулы", данная настройка подмены будет применена ко всем онлайн-пулам, которые подразумевают подмену на сайте.
Выбрав опцию "Выборочно", вам будет предложен список пулов, к которым можно применить данную настройку подмены.
Редактирование подмены
Редактирование подмены происходит на табе "Подмена". При наведении на блок подмены появится кнопка "Редактировать":
По нажатию на кнопку редактирования откроется сайдбар настроек подмены, куда вы можете внести любые изменения.
Удаление подмены
Обратите внимание! Удалить блок подмены можно только при условии, что он не используется ни в одном пуле.
Удаление подмены происходит на табе "Подмена". При наведении на блок подмены появится кнопка "Удалить":
и мы поможем вам
- A/B тестирование (раздел «Подключение»)
- Email-трекинг (раздел «Подключение»)
- Отслеживание офлайн конверсии (раздел «Подключение»)
- Подключение к отслеживанию дополнительных доменов (раздел «Подключение»)
- Подмена номеров на AMP-страницах Google (раздел «Подключение»)