Челябинск
Например:
Челябинск
Москва
или
Выбрать автоматически
Челябинск
Москва
Екатеринбург
Тюмень
Санкт-Петербург
Новосибирск
Нижний Новгород
Казань
Омск
Самара
Ростов-на-Дону
Уфа
Красноярск
Пермь
Воронеж
Волгоград
Краснодар
RU
Делаем номер телефона на сайте кликабельным
Назад к списку
Делаем номер телефона на сайте кликабельным

Кликабельный номер – неотъемлемая опция современного сайта. Без нее вы можете потерять массу клиентов. Если на сайте номер телефона не кликабельный, а вставлен обычным текстом, то часть клиентов это оттолкнет, т.к. звонить попросту неудобно. Только представьте: надо выделить номер, скопировать его, свернуть браузер, открыть меню для ввода номера, вставить и только после этого звонить. Аж 6 действий! Ваши клиенты вряд ли захотят терять время на подобные манипуляции. Тем более, если через сайт конкурентов можно без проблем позвонить в одно нажатие.

Рассмотрим подробнее, как сделать телефонный номер кликабельным.

6173c962bfbc30aef81216817588c2a8452f160f.png

Способ первый. Коды сайта

Этот способ подходит, если можно править HTML-код. В нем обычный телефонный номер прописан так:

<span> +7 (945) 123-45-67 </span>

Если ему присвоен класс, то так:

<p class="phone"> +7 (945) 123-45-67 </p>.

Если к тексту применены стили, к примеру, цвета, шрифты, форматирование, код будет записан так:

<div id="number" class="phone mobile text num" style="color: #1f21ff;" name="phone_number"> +7 (945) 123-45-67 </p>.

Нужно вставить гиперссылку? Примените специальный тег <a>...</a>. А атрибут href="" уже направит пользователя на конкретную страницу. Напишите ее адрес внутри кавычек. Если хотите, чтобы номер был набран автоматически, используйте дополнительно tel:XXX. XXX – это номер телефона, пишите его без пробелов и тире.

В первом случае html-код будет прописан так:

<span><br><a href="tel: + 79451234567">+7(945)123-45-67</a><br></span>.

Во втором варианте так:

<p class="phone">
<br />
<a href="tel:+ 79451234567" >+7(945)123-45-67</a>
<br />
</p>

В третьем легко превратить номер телефона в гипертекст, сохранив все стили:

<div id="number" class="phone mobile text num" style="color: #1ff1ff;" name="phone_number"> <br> <a href="tel:+79451234567">+7(945)123-45-67</a> <br> </p>.

После всех изменений сохраните html-код. Теперь на сайте есть кликабельный номер!

mobile-vs-desktop-1 (1).png

Способ второй. Конструктор сайтов или CMS

В любом движке или конструкторе есть особые инструменты, которые делают номер кликабельным. Подробно об этом можно почитать в разделе FAQ.

Но есть один универсальный способ, который подходит для каждого конструктора.

Везде можно создать гиперссылку при форматировании текста. Цифры — это же тоже текст. Соответственно, их можно написать в редакторе, выделить и преобразовать в гиперссылку как обычный текст. А потом в блоке «Адрес» ввести телефонный номер: tel:+79451234567.

Гиперссылка автоматически будет активной.

Способ третий. Коллтрекинг

Если на сайте стоит коллтрекинг, при этом телефонный номер регулярно меняется, сделать его кликабельным можно.

Главное — запомнить, что за скрытие номера под другим видом отвечает атрибут class="callibri_phone". 

Если проект работает грамотно, на нем есть специальный скрипт, а к любому номеру в коде прикреплен данный атрибут. Подмена номера происходит автоматически. Скрипт системы коллтрекинга сам ищет нужные части с номерами телефонов и самостоятельно их заменяет.

Даже некликабельные цифры номера будут изменены. Если на номер телефона можно позвонить в одно нажатие, этот скрипт применит класс и подменит номер, который указан в атрибуте "href=tel:XXX.

Резюме

Кликабельный номер телефона — большой плюс для мобильной версии сайта. С ним вы станете значительно ближе к клиентам.

Если хотите сделать все проще и ничего не настраивать, установите на сайт сервис обратного звонка Callibri. Тогда вам смогут звонить даже те пользователи, которые посетили сайт на компьютере.

#Создание сайтов
#Продвижение сайтов

Видео компании
Презентация интернет-агентства INTEC
Семинар "Digital-трансформация маркетинга и продаж"
Трофименко Александр - Руководитель компании "Тех-Ас"
Игорь Родимов - Директор автосервиса "Мастер 12 Вольт"
загрузка карты...
загрузка карты...
загрузка карты...
загрузка карты...
загрузка карты...
загрузка карты...
загрузка карты...
загрузка карты...
загрузка карты...
загрузка карты...
загрузка карты...
загрузка карты...
загрузка карты...
загрузка карты...
загрузка карты...
загрузка карты...
загрузка карты...
загрузка карты...