Как сделать телефон кликабельным html
Как сделать кликабельный номер телефона на сайте
Я не буду лить воду про выгоды кликабельного номера на сайте. Надеюсь, вы в курсе. Суть: посетитель жмакает на номер, автоматом идет звонок. Естественно, это относится к мобильным устройствам.
Рассмотрим несколько вариантов, смотря на чем у вас сайт.
HTML-код
Обычный номер телефона, который пока является простым текстом, в коде может выглядеть так:
+7(999)888-77-66
Или так (если присвоен класс):
Или так (если к этому тексту применены стили: цвет, шрифт, форматирование):
За гипертекст (возможность текста в коде HTML включать в себя гиперссылку) отвечает тег . . Атрибут href=”” отвечает за то, куда будет направлен клиент — внутри кавычек указывается адрес страницы или действие.
За автоматический набор номера по клику отвечает параметр tel:ХХХ, где XXX — номер телефона без пробелов и тире.
Таким образом, для первого примера код будет следующим:
К тексту добавили действие – вызов на конкретный номер.
Сделаем и второй номер кликабельным:
Третий пример тоже без особых усилий становится гипертекстом. При этом сохраняются его изначальные стили:
По этому же принципу вы можете сделать кликабельный email.
Чтобы email стал кликабельным, поставьте атрибут .
Сайт на WordPress
Для Вордпресса есть специальный плагин CallPhone’r. Этот модуль выводит на каждой странице сайта иконку, при нажатии на которую мобильное устройство переходит в режим вызова.
Там же есть возможность настройки по времени отображения иконки. Это позволит не получать звонки от клиентов в нерабочее время.
Сайт на LPmotor
Этот конструктор дает несколько вариантов.
1) Телефон в виде текста.
В этом случае выделите текст телефона в блоке и нажмите кнопку добавления ссылки в панели редактирования:
2) Переход к набору номера с кнопки. В панели редактирования блока «Кнопка» необходимо выставить «Переход по ссылке» и указать ваш номер телефона в формате «tel:88005555555».
3) Переход к набору номера с иконки/картинки. Здесь в выпадающем меню «Действие» нужно выбрать «Переход по ссылке» и вставить номер в формате «tel:+74957873422».
4) Также можно вставить кликабельный телефон на сайт в виде html блока.
Тогда в поле «Редактирование HTML-кода» нужно вставить
Сайт на Wix
1) Чтобы создать кликабельный номер телефона:
— Нажмите «Редактировать текст».
— Введите номер телефона. Не вводите другой текст в том же окне.
2) Чтобы связать текст ссылкой с номером телефона:
— Нажмите «Редактировать текст».
— Введите текст, например, «Позвонить сейчас».
— Нажмите на иконку «Ссылка».
— Выберите Номер телефона.
— Введите номер телефона в поле «Номер телефона».
3) Чтобы связать кнопку ссылкой с номером телефона:
— Нажмите на иконку Ссылка.
— Выберите Номер телефона.
— Введите номер телефона в поле «Номер телефона».
Сайт на Tilda
Чтобы при клике на номер телефона начинался звонок или при клике на e-mail открывался почтовый клиент, нужно навесить на них ссылки.
1) Ссылка, которую нужно задать тексту с номером телефона: tel:+71234567890 (все без пробела). Будет работать при просмотре сайта на телефоне.
Например, выбираете блок меню ME301, во вкладке Контент в поле Дополнительно указываете номер телефона, затем выделяете его и с помощью выпадающей панели инструментов для текста добавляете ссылку вида tel:+7123456789.