Делаем кликабельным номер телефона, Whatsapp, Telegram и E-mail
Скорость и простота коммуникации — то, к чему современные потребители уже привыкли. В эру высокоскоростного мобильного интернета люди хотят решать свои задачи через смартфон, делая минимум лишних движений. Клик сюда, клик туда и готово!
Поэтому важно сделать так, чтобы взаимодействие с сайтом было максимально простым. Например, чтобы позвонить в компанию достаточно было кликнуть по телефону в шапке.
Разберемся, как проработать такую маленькую, но очень важную деталь сайта, как кликабельные кнопки связи (телефон, почта, мессенджеры).
Номер телефона
Чтобы при клике на номер телефона начинался звонок нужно сделать следующие шаги.
HTML-код сайта
Некликабельный номер телефона (просто текст) может выглядеть в коде по-разному, например, так:
Чтобы сделать обычный текст кликабельным нужно сделать из него гиперссылку и указать действие, которое будет совершено по клику (в нашем случае набор номера).
Как создать активную ссылку на Telegram
Для создания любых ссылок используется тег …. Между тегами располагается текст ссылки или картинка (например, иконка трубки). Атрибут href=“” указывает адрес ссылки или действие. Для набора номера используется параметр: tel:+7XXXXXXXXXX, где +7XXXXXXXXXX — нужный номер телефона.
Если доработать предыдущие примеры, то получится следующий код:
Теперь при нажатии на номер телефона будет совершаться набор указанного в ссылке номера. Именно тот, который указан в ссылке, а не в тексте, поэтому будьте внимательны! Проверяйте получившийся код в работе.
Зная, как устроен HTML-код вы легко сможете реализовать на любом движке или конструкторе.
В WordPress
Метод создания кликабельной ссылки на движке WordPress аналогичен пункту «HTML-код сайта» данной статьи. Главная задача в том, чтобы найти нужный фрагмент кода в админ-панели.
Шапка сайта
Записи/страница
В Tilda
Zero-блок
Стандартный блок
Активная ссылка на WhatsApp
Принцип точно такой же, как и с телефоном (смотрите предыдущий пункт данной статьи), отличие только в самой ссылке. Она будет выглядеть следующим образом:
Для размещения кликабельного текста на сайте подойдут все инструкции, как для телефонного номера.
Кликабельная иконка для сайта
Но обычно кликабельным делается не номер телефона, а специальная иконка WhatsApp. Для этого:
Ссылка на Telegram
С Телеграм тот же алгоритм действий, что и Whatsapp (смотрите предыдущий пункт данной статьи), но основное отличие в том, что в РФ, например стандартные ссылки в формате https://t.me/seoforge не работают. Поэтому необходимо использовать редирект через такие сервисы, как tele.gg, telegram.im и другие. Сервисы полностью бесплатны и существует большой список таких сервисов без сторонней рекламы, используйте именно их.
Ссылка будет выглядеть следующим образом.
Кликабельная почта E-mail
При клике на e-mail открывался почтовый клиент:
Кликабельный Skype
При клике на кнопку открывался чат в Skype с указанным пользователем пользователем:
Номер телефона в виде ссылки (кликабельный) на мессенджеры с сайта
С каждым годом интеграция с социальными сетями и мессенджерами происходит все глубже. Многие компании и организации в борьбе за клиента, стараются сделать обратную связь как можно проще и удобнее. Одна из таких возможностей – сделать кликабельные номера телефонов на сайте.
Введение
Если вы установите кликабельные номера телефонов на своем сайте, то при нажатии они будут сразу переводить в мессенджера Viber, WhatsApp или Telegram, что позволит быстро установить коммуникацию с вами.
Это всё будет работать при условии, что у пользователя стоит одно из этих приложений на мобильном устройстве или на компьютере.
Кликабельная ссылка Viber
Для мобильных и ПК устройств:
«%2B» — это «+» в HTML кодировке.
Кликабельная ссылка WhatsApp
Для мобильных и ПК устройств:
Кликабельная ссылка Telegram
С Telegram-ом это делается немного по-другому. Если для Viber и WhatsApp мы использовали номер телефона для вызова чата, то в Telegram используется логин (имя) пользователя.
Для мобильных устройств:
Ссылка для ПК (чат откроется в браузере):
Кликабельная ссылка для звонка
Для мобильных и ПК устройств:
С каждым годом посещение сайтов с мобильных устройств растет и чтобы это все работало как надо, нужно побеспокоиться о хорошей мобильной версии сайта.
Всем удачи!
Возможно вам так же будет интересно:
Как сделать ссылку на Telegram
Ссылка на Телеграмм на сайте, в социальной сети или ленте новостей поможет пользователям связаться с вами. В мессенджере удобно реализована работа с URL, причем относится это и к их пересылке. Но давайте разберемся со всем по порядку.
Ссылка на аккаунт в приложении
Если вы — человек публичный и постоянно должны быть на связи, это можно делать через мессенджер. Для этого в нем предусмотрена система прямых линков на диалоги, групповые беседы, аккаунты личные и групповые. Перед тем как сделать ссылку на свой Телеграмм, вам нужно в первую очередь получить имя-идентификатор. Для этого:
Это простейший способ, как скопировать ссылку на себя в Телеграмме. После нажатия вы не переходите по линку, а переносите URL в буфер обмена (извещение об этом всплывает на экране). Теперь можете вставить его в любое сообщение или отправить самому себе в том же приложении, чтобы, скажем, открыть на компьютере. Структура адреса настолько проста, что вы можете просто его запомнить и дать ссылку на свой профайл Телеграмм просто по памяти.
Ссылка на диалог или чат
С тем, как узнать свою ссылку в Телеграмме, мы разобрались. Но это еще далеко не все. Очень часто публичные чаты мессенджера содержат информацию, которую не нужно выносить наружу. Но надо дать пользователям возможность присоединяться к чату. В этом случае можно примерно таким же образом скопировать гиперссылку на групповую беседу.
Неважно, кто вы в этом чате — администратор или простой участник. Функция работает для всех.
Скрытие ссылки в Telegram
На самом деле возможности Markdownbot гораздо больше. К тому же, это не единственный разметочный бот в Telegram. Но на первых порах его возможностей вам вполне хватит.
Как в Телеграмме узнать номер телефона?
Как в Telegram посмотреть свой номер телефона
Для просмотра личных данных выполните следующие действия.
Источник: telefonom.ru
Написать в Telegram без добавления в контакты
Онлайн сервис позволяет написать сообщение или начать чат Telegram с номером телефона, не добавляя его в контакты (адресную книгу).
Введите номер телефона и нажмите кнопку «Перейти в Telegram».
Написать в телеграм ▶
Телеграм написать без добавления контакта ▶
Отправить сообщение в телеграм без добавления контакта ▶
Написать в тг по номеру ▶
Как в телеграмме написать на незнакомый номер ▶
Онлайн сервис
Введите номер телефона:
Сервис не сохраняет никаких введенных данных, а лишь формирует ссылку для перенаправления в приложение Telegram
Как отправить сообщение Telegram без добавления контакта
- Запустите любой интернет-браузер на устройстве, например, Google Chrome, Mozilla Firefox или Safari.
- Введите следующую ссылку в строке адреса или поиска https://t.me/XXX
- Вместо XXX укажите номер телефона, включая код страны. Например, +7XXXYYYYYYY, соответственно ссылка будет выглядеть так: https://t.me/+7999XXXXXXX
- Нажмите Ввод (Enter) на устройстве, и Вы будете автоматически перенаправлены в Telegram с окном «Открыть чат» к контакту с номером телефона, указанному ранее.
Источник: findhow.org
Как в Тильде сделать кликабельным номер и почту
Чтобы по клику на номер телефона начинался звонок, у текста с номером должна быть ссылка вида:
tel:+79991112233 , где +79991112233 — ваш номер телефона.
Перейдите в «Контент» блока → выделите нужный фрагмент текста → в появившемся меню нажмите «Ссылка» → укажите ссылку и настройте стили ссылки → Применить → Сохранить.
В некоторых блоках, например из категории «Соц.сети», при выборе в «Контенте» блока пункта «Phone» нужно указать просто номер без «tel:».
Следите, чтобы на опубликованной странице ссылка имела вид именно tel:+79991112233 (а не tel:tel:+79991112233, допустим). Например в Google Chrome можно навести курсор на текст, и в левом нижнем углу появится адрес ссылки.
Кликабельная почта (email)
Добавьте тексту с вашим email ссылку вида:
В таком случае по клику на вашу почту у пользователя на устройстве будет открываться приоритетное приложение почты. В качестве адреса отправителя будет указан ваш email.
Как и с телефоном, в некоторых блоках при использовании пункта «Email» нужно указать просто адрес почты без «mailto:».
Источник: seven-flares.ru